버킷플레이스 (오늘의집)

흰 지면과 #424242 글자 위에 하늘색 #0AA5FF 한 점, 제목은 10페이지 전부 국문 50px/700.

오늘의집을 만드는 버킷플레이스의 회사·채용 사이트입니다. 흰 지면에 진회색 본문, 하늘색 액센트 한 색만 쓰는 담백한 코퍼레이트 화면이고, 열 페이지 모두 가장 큰 글자가 국문 제목(50px/700)이라 국문 히어로 조판을 볼 수 있는 몇 안 되는 레퍼런스입니다. 자간을 전 구간 음수로 잡되 작은 글자일수록 더 좁히는 방식(12px −3.3% · 50px −1.6%)이 이 사이트의 조판 규칙입니다. 사진이 많은 채용·팀문화 페이지를 설계할 때, 그리고 국문 큰 제목의 자간·행간 기준을 잡을 때 참고하기 좋습니다.

https://www.bucketplace.com

Color Palette

Primary

Label

Fill

Line

Background

Static

Typography

Noto Sans KR · 400한글 전용 렌더 (99.8%)

Noto Sans JP · 400라틴·숫자 (73.1%)

Apple SD Gothic Neo · 400 / 700OS 폴백 (한글 0.2%)

Arial · 400 / 700UI 소수

Type Scaleraw 스타일 28종(1920)에서 추린 9단이며 히어로 50px은 1440 layout

display50px · 700 · 1.32

다람쥐 헌 쳇바퀴

title-legal37.5px · 700 · 1.8

다람쥐 헌 쳇바퀴

section36px · 700 · 1.5

다람쥐 헌 쳇바퀴

sub24px · 700 · 1.5

다람쥐 헌 쳇바퀴

lead20px · 400 · 1.6

다람쥐 헌 쳇바퀴

body18px · 400 · 1.83

다람쥐 헌 쳇바퀴

nav17px · 700 · 1

다람쥐 헌 쳇바퀴

body-sm14px · 400 · 1.57

다람쥐 헌 쳇바퀴

caption12px · 400 · 1

다람쥐 헌 쳇바퀴

국문 · Korean

hangulFont	Noto Sans KR — 한글 34,125글리프 중 34,052(99.8%). CDP 보고명은 'Noto Sans KR Thin'. 나머지는 Apple SD Gothic Neo 64(0.2%) · Noto Sans JP 9(0.03%)
hangulWeights	글리프 집계는 400×28,508 · 700×5,187 · 900×305 · 800×52지만 실제로 로드된 웹폰트 페이스는 Noto Sans KR 14개 · Noto Sans JP 3개가 전부 weight 400이다(fontsrc.json — 선언된 248개 페이스도 전량 w400 normal, 유니코드 서브셋만 나뉜다). 레거시 v1 요청 css?family=Noto+Sans+KR%7CNoto+Sans+JP에 웨이트 파라미터가 없어 굵기가 한 단만 온다 → CSS가 쓰는 700·800·900은 전부 브라우저 합성 볼드다(확인 완료). 홈 h1도 font-weight:700인데 400 페이스뿐이다
body	18px/400 lh1.83 ls−0.4px(−2.2%) ×6 · 20px/400 lh1.6 ls−0.4px(−2.0%) ×18 · 14px/400 lh1.57 ls−0.28px(−2.0%) ×18
sub	24px/700 lh1.5 ls−0.26px(−1.08%) ×3 · 섹션 제목 36px/700 lh1.5 ls−0.72px(−2.0%) ×10
label	nav 17px/400(비활성 ×9)·17px/700(활성 ×15) lh1.0 ls−0.3px · 배지 12px/400 ls−0.4px(−3.33%) pad 10px r999 ×4
mixing	국문 문장 안의 영문 고유명사(AI frontier·Product·Tech·Biz·contact@bucketplace.)를 Noto Sans JP가 그려 같은 줄에서 서체가 갈린다. 혼용 노드는 한글만 담은 프로브로 재측정한 값이다(fonts.json)
hangulHeadings	있다 — 10페이지 전부 최대 제목이 국문이다. 홈 히어로는 y180 h456 블록의 50px/700 h1 "'이렇게 살아보고 싶다'는 전 세계 사람들의 꿈을 현실로 만듭니다"로, 헤더 100px 아래 80px을 띄운 자리에서 시작해 456px를 텍스트만으로 쓴다(이미지 0 · CTA 0 · 본문 20px · textLen 244). 채용 y180 h147 50/700 "모두의 삶을 함께 바꿔나갈 기회" · 팀문화 y0 h676(paddingTop 180) 50/700 "오늘의집은 어떤 사람들이 모여있고,어떤 방식으로 일하는가" · 컬처 5페이지 y0(paddingTop 180) 50/700 "오늘의집 이야기" · 블로그 상세 50/700(div) · 정책 37.5/700. 1440과 1920에서 같은 50px이라 vw·clamp가 아니다
verdict	국문 히어로·대형 제목 레퍼런스로 유효하다. 인용할 값은 홈 y180 h456 히어로의 50px/700 lh1.32 자간 −0.8px(−1.6%), 그 아래 섹션 제목 36px/700 −2.0%, 그리고 헤더 100 + 여백 80 = y180에서 시작해 456px를 텍스트만으로 채우고 다음 섹션까지 80px을 띄우는 여백 배분이다. 다만 두 가지를 그대로 베끼면 안 된다 — 50px은 라이브러리 안에서 중간대이고(최대 100px/700), 700·800·900이 전부 합성 볼드다(로드 페이스 17개 전량 weight 400). 같은 조판을 쓰려면 굵기는 실제 Bold 페이스로 다시 잡아야 한다
rendered	Noto Sans KR Thin ×34052 · Apple SD Gothic Neo ×64 · Noto Sans JP Thin ×9

영문 · Latin영문 전용

latinFont	Noto Sans JP 12,962글리프(73.1%) · Noto Sans KR 4,625글리프(26.1%) · Apple SD Gothic Neo 112글리프(0.6%) · Apple Color Emoji 11글리프(0.1%)
latinWeights	실측 페이스 Thin
share	라틴 17,724글리프 / 한글 34,125글리프 — 지면의 34.2%가 라틴이다 (1440 CDP 실측)
scale	타입 스케일 단이 라틴 전용 서체로 지정된 곳 없음 — 라틴은 국문 서체 또는 폴백이 그린다
mixing	국영문 혼용 노드 662개(전체 1,798개) — 혼용 노드는 한글만 담은 프로브로 재측정해 라틴 글리프를 한글 집계에서 분리했다
roleNote	Noto Sans JP 영문 전용(73.1% · 선언됨)
verdict	영문 전용 서체가 있다 — Noto Sans JP 라틴 73.1% / 한글 0.0%. 다만 타입 스케일에 이 서체로 지정된 단이 없다 — 디스플레이 레퍼런스로 보기 어렵다
sharedWithKorean	국문과 같은 서체: Noto Sans JP · Noto Sans KR · Apple SD Gothic Neo
rendered	Noto Sans JP Thin ×12962 · Noto Sans KR Thin ×4625 · Apple SD Gothic Neo ×112 · Apple Color Emoji ×11 · Arial ×10 · Helvetica ×4

Spacing & Shape

Spacing

Purpose	Value	Preview
Density	regular
Base unit	미확정
Max width	1136px
Docs width	1000px
Section gap	80px 기준 — 코퍼레이트·채용·팀문화 3페이지의 연속 섹션 간격 27건 중 80px×18
Header	100px fixed
Grid	컬처 5페이지 3열 345px + 거터 50px (345×3+50×2=1,135 ≈ contentWidth 1,136), 카드 7~12개가 래퍼 y0 h1711~2222 안에 든다 · 팀문화 작업공간 y1616 h1043은 385×365 타일 23개(거터 0) · 팀문화 소개 y716 h500은 365×300 5열(거터 20 · radius 4px) · 홈 사진 띠 y724 h365은 385×365 타일 10개(거터 0) · 채용은 1,136 단일 열에 1,136×98 행이 쌓인다 · 정책 요약 y379 h213은 169×213 6열(radius 6px)
Card Padding	컬처 카드 345×382(콘텐츠가 많은 AI frontier·Product 2페이지는 345×401), radius 0px, 배경 transparent, 테두리 0 · 팀문화 카드 365×300 radius 4px · 연혁 행 400×48 · 채용 공고 행 1,136×98
Button Padding	채용 CTA 0px(라인박스 높이) · 필터 칩 0 30px · 배지 10px · 셀렉트 0 30px 0 15px · 공유하기 1px 6px

Border Radius

Role	Value	Preview
standard	4px	108회 · 버튼·이미지 기본
small	6px	6회 · 작은 div
chip	25px	28회 · 필터 칩(#AI frontier 20px/400 pad 0 30px)
cta	30px	50회 · 채용 CTA 버튼(bg #3F474D 17px/700)
circle	100%	11회 · 인물 원형 이미지
pill	999px	86회 · 배지(bg #F7F8FA 12px/400 pad 10px)

Guidelines

지면은 #FFFFFF 하나로 두고 구조는 1px #DDDDDD 선(170회)으로 나눈다 — 색면 분할을 쓰지 않는다
국문 제목은 50px/700 lh1.32 자간 −0.8px(−1.6%), 섹션 제목은 36px/700 lh1.5 −0.72px(−2.0%)로 잡는다
자간은 전 구간 음수로 두되 작은 글자를 더 좁힌다 — 12px −3.33% · 18px −2.22% · 14/20/36px −2.0% · 50px −1.6%
콘텐츠 폭 1,136 중앙, 섹션 간격 80px 한 값(27건 중 18건), 카드 그리드는 3열 345px + 거터 50px(345×3+50×2=1,135)로 폭을 정확히 채운다
라운드는 4px 표준(108회), 채용 CTA만 30px(50회), 필터 칩 25px(28회), 배지 999px(86회)로 역할마다 고정한다
액센트 #0AA5FF는 버튼 배경·선택 칩·1px 아웃라인에만 쓰고, 링크 hover는 기본색과 무관하게 #0198ED 한 점으로 모은다
모션은 0.25s ease(225회) 한 값으로 통일하고, 진입은 slide-up 0.5s(57회), 사진 띠만 100s linear 마퀴로 돌린다
헤더는 100px fixed 흰색 + nav 7개(17px), 활성 라벨만 700으로 굵기를 바꿔 표시한다

Don't

#0AA5FF 위에 흰 글씨를 본문 크기로 올리지 않는다 — 2.68:1 ×30쌍으로 AA 미달이다
#828C94(3.43:1 ×127)를 본문에 쓰지 않고, #C2C8CC(1.69:1 ×18)는 텍스트로 쓰지 않는다
웨이트를 700·800·900으로 벌리지 않는다 — 로드된 웹폰트 페이스 17개가 전부 weight 400이라 그 위는 전부 합성 볼드다(글리프 700×5,187 · 900×305 · 800×52). 굵기가 필요하면 웨이트를 실제로 내려받아야 한다
그라디언트를 쓰지 않는다 — 9페이지 병합 실측 0개다
그림자로 구조를 만들지 않는다 — 8종 합쳐 39회뿐이고 경계는 1px 테두리 조합 213회가 맡는다
커스텀 이징이나 0.6s를 넘는 전환을 넣지 않는다 — easings는 ease ×363이 전부, 최장 duration이 0.6s ×75다
카드 모서리를 굴리지 않는다 — 컬처 카드 345×382는 radius 0px이고 라운드는 버튼·칩·배지·이미지에만 걸린다