Superhuman
따뜻한 오프화이트 지면 위에 시네마틱 바이올렛 그라디언트 히어로를 얹은 프리미엄 프로덕티비티 스타일 — 빠르고 정제되고 값비싸 보인다.
설명
고급 이메일·프로덕티비티 제품의 마케팅 미학. 본문은 따뜻한 오프화이트(#f2f0eb) 지면에 near-black 텍스트로 조용하고 읽기 편하게 두고, 히어로와 CTA 밴드에서만 보랏빛 시네마틱 그라디언트와 큼직한 디스플레이 타입으로 극적 대비를 만든다. 부드럽게 둥근 카드(16px), 얇은 보더, near-black 필 버튼에 바이올렛 글로우 섀도가 브랜드 시그니처. 색으로 요란하게 꾸미지 않고, 여백과 그라디언트 이미지가 럭셔리·테크 감성을 만든다.
타입 스케일
display Ag 스타일 견본 Style Specimen
h1 Ag 스타일 견본 Style Specimen
h2 Ag 스타일 견본 Style Specimen
h3 Ag 스타일 견본 Style Specimen
body Ag 스타일 견본 Style Specimen
caption Ag 스타일 견본 Style Specimen
단일 산세리프(Super Sans VF, 커머셜 → Inter 대체). 웨이트는 측정값 그대로 460 본문 / 540 헤딩·디스플레이(비표준 중간 웨이트 — Inter로는 450~500·600 근사). 디스플레이는 크고 자간 살짝 타이트, 본문은 넉넉한 lh 1.5.
골든 예제 (exemplar)
Do
- 본문은 따뜻한 오프화이트 지면 + near-black 텍스트로 조용하게
- 히어로·CTA 밴드에만 바이올렛 시네마틱 그라디언트를 몰아서
- CTA는 near-black 필 버튼 + 바이올렛 글로우 링으로 시그니처를 만든다
- 카드는 16px 라운드 + 아주 얕은 섀도/얇은 보더
Don't
- 오프화이트 지면 위에 흰 텍스트 쓰지 말 것(히어로 그라디언트 위에서만 흰 텍스트)
- 본문 전체를 그라디언트로 도배하지 말 것 — 대비를 위해 지면은 차분히
- 각진 0radius UI 금지(필·라운드가 기본)
- 요란한 다색 팔레트 금지 — 바이올렛 단일 브랜드 액센트 유지
컴포넌트 노트
- button
- primary: near-black(primary) 필/라운드(radius 12px), 흰 텍스트, 우측에 원형 화살표 칩, 바이올렛 글로우 링. padding 6px 6px 6px 16px 류의 비대칭.secondary: 라이트 배경 위 흰 카드형 아웃라인 버튼(얇은 보더 + 미세 섀도), 다크 밴드 위에서는 반투명 화이트.hover: 글로우/섀도 강화, 150msaccent_usage: 바이올렛은 링·링크 하이라이트·아이콘 강조에. 큰 면적 채움은 그라디언트로.
- card
- radius 16px, 아주 얕은 섀도 또는 얇은 보더. 라이트 지면에서는 near-white 카드(card vs background 미세 톤차). 채팅·프로덕트 목업 카드는 반투명 화이트 오버레이(히어로 위).
- input
- radius 12px, 얇은 보더, 포커스 시 바이올렛 ring.
- nav
- 상단 얇은 바, 히어로 위에서는 흰 텍스트. 로고 좌측, 링크 중앙, 우측에 Log in + 라일락 Sign up 필 버튼.
- pill
- 채팅 버블·태그는 999px 라운드(일부는 999px 999px 0px 비대칭 말풍선).