Semantic tokens only
Colour with semantic tokens (background, primary, muted, border…), never raw values.
Draft — not yet reviewed by a maintainer
Why it matters
Raw colours lock a component to one palette and break dark mode and the installing project's theme. Semantic roles let the same structure work in any theme.
How to check it
No hex, rgb(), hsl() or palette classes in the component; it works in light and dark.
The default it guards against
Hard-coded hex values, Tailwind palette classes such as text-gray-500 and white cards that ignore the project's theme and vanish in dark mode.
Library items that apply it
No library item applies this rule yet. Items list the rules they follow in their taste notes, and this page picks them up automatically.
Where it comes from
- docs/v1.2/plan.md §4 (semantic theme tokens only)
- AGENTS.md (Library items)
- CONTRIBUTING.md (item checklist)
Repository paths refer to the Tessli repository ; WCAG references are to WCAG 2.2.