Design Token
MO (Dark theme)
--bg
#000
--fg
#fff
--surface
w/0.04
--border
w/0.1
| Token | Value | Usage |
|---|---|---|
--bg | #000000 | 페이지 배경 |
--fg | #ffffff | 주 텍스트 |
--fg-muted | rgba(255,255,255,0.4) | 보조 텍스트, nav links |
--surface | rgba(255,255,255,0.04) | 카드, pill 배경 |
--border | rgba(255,255,255,0.1) | 기본 구분선, pill 테두리 |
NE / JJI (Light theme)
--black
#0a0a0a
--white
#fff
--gray-100
#f5f5f5
--gray-400
#aaa
| Token | Value | Usage |
|---|---|---|
--black | #0a0a0a | 주 텍스트, 아이콘 |
--white | #ffffff | 페이지 배경 |
--gray-100 | #f5f5f5 | 카드 배경, 이미지 placeholder |
--gray-400 | #aaaaaa | 보조 텍스트, 레이블 |
CSS Variables — 복사용
:root {
/* Layout */
--px: clamp(24px, 4vw, 48px);
--logo-h: 20px;
--ham-h: 20px;
--footer-clip-h: clamp(80px, 7vw, 130px);
--footer-clip-ty: -10%;
/* Typography */
--ls: -0.04em;
}