Design System
Typography
h1 · 3.5rem / 600다람쥐 헌 쳇바퀴에 Ag 가나다 123
h2 · 2.25rem / 600다람쥐 헌 쳇바퀴에 Ag 가나다 123
h3 · 1.375rem / 600다람쥐 헌 쳇바퀴에 Ag 가나다 123
h4 · 1.125rem / 400다람쥐 헌 쳇바퀴에 Ag 가나다 123
body · 1rem / 400다람쥐 헌 쳇바퀴에 Ag 가나다 123
button · 0.95rem / 500다람쥐 헌 쳇바퀴에 Ag 가나다 123
caption · 0.8125rem / 500다람쥐 헌 쳇바퀴에 Ag 가나다 123
mobileCaption · 1.125rem / 600다람쥐 헌 쳇바퀴에 Ag 가나다 123
Fonts — Pretendard vs SUIT
PretendardThin 100 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123ExtraLight 200 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123Light 300 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123Regular 400 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123Medium 500 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123SemiBold 600 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123Bold 700 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123ExtraBold 800 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123Black / Heavy 900 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123
SUITThin 100 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123ExtraLight 200 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123Light 300 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123Regular 400 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123Medium 500 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123SemiBold 600 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123Bold 700 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123ExtraBold 800 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123Black / Heavy 900 — 다람쥐 헌 쳇바퀴에 Ag 가나다 123
Color tokens (light)
background#f5f5f7
surface#ffffff
surfaceSoft#eef2f7
borderrgba(29, 29, 31, 0.12)
text#1d1d1f
mutedrgba(29, 29, 31, 0.68)
primary00#f5f9ff
primary01#edf4ff
primary02#dbe9ff
primary03#c8dcff
primary04#adc9ff
primary05#8bb2ff
primary06#6798f0
primary07#3e7ae0
primary08#0071e3
primary09#0066cc
primary10#0054b3
gray05#ffffff
gray10#f2f2f4
gray20#e3e6eb
gray30#c2c6cf
gray40#8f96a3
gray50#6e7582
gray60#4a505c
gray70#2f3440
gray80#1f2430
gray90#12161f
gray100#090c12
tagBg#edf4ff
tagText#0066cc
Buttons