Color
omb-gray 가 foundation color 이고, 그 위에 얹는 유채색은 primary 하나뿐입니다.
omb-gray
번호는 0=가장 밝음 → 9=가장 어두움. 값은 CSS 변수라 .dark 에서 재매핑되고, 컴포넌트는 dark: variant 를 쓰지 않습니다.
gray-0
#fafafa
gray-1
#f4f4f5
gray-2
#e4e4e7
gray-3
#d4d4d8
gray-4
#9f9fa9
gray-5
#71717b
gray-6
#52525c
gray-7
#3f3f46
gray-8
#27272a
gray-9
#18181b
- ·
gray-0— hover 배경 - ·
gray-1— 코드·인라인 배경 - ·
gray-2— 경계선 - ·
gray-3— 강한 경계·bullet - ·
gray-4— 약한 텍스트·날짜·포커스 링 - ·
gray-6— 보조 텍스트·캡션 - ·
gray-7— 본문 - ·
gray-9— 제목·강조
Primary
grayscale 밖의 유일한 색(전구색). 무드등과 도식 제목, 두 자리에만 놓입니다.
omb-primary
#d98a4e
omb-primary-text
#9c5a20
- ·
omb-primary— 빛으로 쓰는 값. 무드등(다크에서만 켜짐)과 파비콘. - ·
omb-primary-text— 글자로 쓰는 값. 원색은 흰 배경에서 대비 2.7:1 이라 읽히지 않아, 라이트에서만 어둡게 눌러 5.4:1 을 확보합니다(다크에서는 원색 그대로 6.5:1). - · 이 문장이 실제 색 입니다. 테마를 바꿔 두 값을 비교해 보세요.
쓰지 않는 것
색이 늘어날수록 '이 사이트에서 색은 특별하다'는 신호가 약해집니다.
white
#ffffff
black
#000000
`accent`·`destructive` 같은 시맨틱 색은 두지 않습니다. 상태와 강조는 회색 농도·굵기·언더라인으로 표현하고, primary 는 위 두 자리 밖으로 넓히지 않습니다.