메인 콘텐츠로 이동

Typography

A typography scale and font system for readable, hierarchical content.

Overview

COCSO UI uses Pretendard Variable as the default sans-serif font and Geist Mono for code. The typography system is based on a fixed numeric scale that maps directly to CSS custom properties with the --cocso-* prefix.

Font Size

The size scale consists of 15 steps from 10px to 60px. Each step is shown below rendered at its actual size.

Font Weight

Nine weight variants span the full range from thin (100) to black (900), giving precise control over visual hierarchy and emphasis.

Line Height

Line heights follow a named scale that maps to standard multipliers. Use tighter values for headings and wider values for body text.
NameTokenValuePreview
none--cocso-leading-none1
tight--cocso-leading-tight1.25
snug--cocso-leading-snug1.375
normal--cocso-leading-normal1.5
relaxed--cocso-leading-relaxed1.625
loose--cocso-leading-loose2