타이포그래피

자체 호스팅 Pretendard와 크기·행간·굵기 토큰으로 읽기 위계를 만듭니다.

목적

v0.1은 자체 호스팅하는 Pretendard Variable v1.3.9를 기본 글꼴로 사용합니다. 외부 CDN을 호출하지 않으며, 글꼴을 불러오지 못하면 한국어와 운영체제의 sans-serif 글꼴로 대체합니다. 크기와 행간은 같은 이름의 단계로 조합하고, 굵기는 의미 있는 위계에만 사용합니다.

제품에서 같은 글꼴을 사용하려면 토큰 CSS와 별도로 폰트 CSS를 한 번 불러옵니다.

@import '@hds/tokens/fonts.css';
@import '@hds/tokens/tokens.css';

사용 문법

font-family: var(--hds-font-family-sans);
font-size: var(--hds-font-size-body);
line-height: var(--hds-font-line-height-body);

생성된 스케일