Design system inspiration series: IBM Carbon
🌱 seed (?)
On This Page
Typography design tokens
Source: https://github.com/carbon-design-system/carbon/tree/main/packages/type/ 😻
- Typography is a package (
@carbon/type), which is then imported as dependency—and exported—by other packages in the DS monorepo (eg. elements) - Design tokens are in JS and SCSS formats, defined separately
- What parts are specified?
- fontFamily —
sans: "'IBM Plex Sans', sans-serif", etc - fontWeight —
light: 300, etc - scale — array of integer sizes,
[12, 14, 16, 18, ...] - styles —
legal01,bodyCompact01,body01, etc - tokens — exporting the style names/aliases (
legal01etc)
- fontFamily —