Typography

NCDS Admin은 일관된 타이포그래피 스타일을 제공합니다. 사용한 폰트 크기와 두께는 CSS 변수로 정의되어 있으며, 다양한 상황에서 사용할 수 있습니다. NCDS Admin의 기본 폰트는 다음과 같습니다.

커머스 산스(Commerce Sans)

:root {
  font-family: 'CommerceSans', sans-serif;
}

폰트 크기

Text

--font-size-xxxs (11px)

가나다라마바사아자차카타파하

--font-size-xxs (12px)

가나다라마바사아자차카타파하

--font-size-xs (13px)

가나다라마바사아자차카타파하

--font-size-sm (14px)

가나다라마바사아자차카타파하

--font-size-md (16px)

가나다라마바사아자차카타파하

--font-size-lg (18px)

가나다라마바사아자차카타파하

--font-size-xl (20px)

가나다라마바사아자차카타파하

Display

--font-size-display-xs (24px)

가나다라마바사아자차카타파하

--font-size-display-sm (30px)

가나다라마바사아자차카타파하

--font-size-display-md (36px)

가나다라마바사아자차카타파하

--font-size-display-lg (48px)

가나다라마바사아자차카타파하

--font-size-display-xl (60px)

가나다라마바사아자차카타파하

라인 높이

Text

--line-heights-xxxs (14)

가나다라마바사아자차카타파하

--line-heights-xxs (16)

가나다라마바사아자차카타파하

--line-heights-xs (18)

가나다라마바사아자차카타파하

--line-heights-sm (22)

가나다라마바사아자차카타파하

--line-heights-md (24)

가나다라마바사아자차카타파하

--line-heights-lg (28)

가나다라마바사아자차카타파하

--line-heights-xl (30)

가나다라마바사아자차카타파하

Display

--line-heights-display-xs (32px)

가나다라마바사아자차카타파하

--line-heights-display-sm (38px)

가나다라마바사아자차카타파하

--line-heights-display-md (46px)

가나다라마바사아자차카타파하

--line-heights-display-lg (60px)

가나다라마바사아자차카타파하

--line-heights-display-xl (76px)

가나다라마바사아자차카타파하

폰트 두께

Regular (--font-weights-commerce-sans-0)

가나다라마바사아자차카타파하

Medium (--font-weights-commerce-sans-1)

가나다라마바사아자차카타파하

Bold (--font-weights-commerce-sans-2)

가나다라마바사아자차카타파하