Font Weight
폰트 굵기 토큰. thin(100)부터 black(900)까지 9단계 제공.
--global-typography-fontWeight-{code}
Usage
import { global } from '@featuring-corp/design-tokens';
// TypeScript에서 사용
console.log(global.typography.fontWeight.regular); // "400"
console.log(global.typography.fontWeight.bold); // "700"
console.log(global.typography.fontWeight.medium); // "500"/* CSS에서 사용 */
.text-bold {
font-weight: var(--global-typography-fontWeight-bold);
}Tokens
| Code | Value | Preview |
|---|---|---|
thin | 100 | 다람쥐 헌 쳇바퀴에 타고파 |
extraLight | 200 | 다람쥐 헌 쳇바퀴에 타고파 |
light | 300 | 다람쥐 헌 쳇바퀴에 타고파 |
regular | 400 | 다람쥐 헌 쳇바퀴에 타고파 |
medium | 500 | 다람쥐 헌 쳇바퀴에 타고파 |
semiBold | 600 | 다람쥐 헌 쳇바퀴에 타고파 |
bold | 700 | 다람쥐 헌 쳇바퀴에 타고파 |
extraBold | 800 | 다람쥐 헌 쳇바퀴에 타고파 |
black | 900 | 다람쥐 헌 쳇바퀴에 타고파 |
전체 토큰 목록
--global-typography-fontWeight-thin: 100
--global-typography-fontWeight-extraLight: 200
--global-typography-fontWeight-light: 300
--global-typography-fontWeight-regular: 400
--global-typography-fontWeight-medium: 500
--global-typography-fontWeight-semiBold: 600
--global-typography-fontWeight-bold: 700
--global-typography-fontWeight-extraBold: 800
--global-typography-fontWeight-black: 900