# Themes and fonts without fifty shades of almost

Use shared tokens so one decision stays one decision.

ID: theme
Language: en
Revision: 2
Translation source revision: 2
Canonical: https://jujin.dev/en/guides/theme/

## Concept

A theme groups visual decisions. Design tokens name shared colors, spacing, and typography; font choice is only one part.

## Example

A card uses surface and text tokens. Changing those shared values changes its theme without rewriting the card.

## When to choose it

System fonts vary by device; self-hosted fonts add consistency, downloads, and licensing work. Dark mode needs separate contrast checks. Keep role-based colors, readable text, visible focus, and saved theme choice. Check actual backgrounds, not color names. [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties) · [W3C](https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum.html)