Lexicon
A universal design system built for clarity.
Lexicon removes ambiguity: a complete Figma library, tailored utility classes, CSS custom properties, and clear implementation guidance. It’s also the shared foundation behind every product at the pace — tested in production, not just in theory.
What it does
Figma library
A complete, tokenised component library — ready to use, built on consistent foundations.
CSS custom properties
Design tokens shipped as CSS variables. Works with any stack, zero lock-in.
Tailored utilities
Purpose-built utility classes that map directly to the system — a Tailwind complement, not a copy.
Implementation guidance
Clear docs for every token, component, and pattern. No tribal knowledge.
Open-source core
The foundation is free — tokens, base components, and utilities for everyone.
Accessibility built in
Contrast, focus management, and semantic structure baked into every component.
Pricing
Free
The full documentation, design tokens, copy-paste code, and the React package — open to everyone.
- •All 122 code components, documented
- •Copy-paste code for every component
- •Design tokens + CSS custom properties
- •Tailwind preset
- •The conformance validator
- •@lexicon_design/react package
- •Theme Creator plugin — free on Figma Community
Starter
The Figma taster — every token, four modes, and 39 components. Enough to build real screens and see how the system thinks.
- •39 of 145 components
- •All 560 design tokens
- •Light, Dark + two demo brand modes
- •Brand-swap demo + token guide
- •CC BY 4.0 — use it in anything
Individual
Everything in Free, plus the design assets — for one designer.
- •Everything in Free
- •Figma library (.fig) — 145 components, themed by the free plugin
- •3 custom themes — 5 export formats each
- •Page templates
- •Advanced component recipes
- •1 licensed seat
Team
Everything in Individual, shared across your whole team.
- •Everything in Individual
- •10 custom themes
- •10 licensed seats
- •Shared team access
- •Priority support
Organisation
The whole system, unlimited — with a hand in where it goes next.
- •Everything in Team
- •Unlimited seats & themes
- •Multi-brand + white-label docs
- •A direct line to the roadmap
Lexicon is on the way.
Parlance validates against it. Tailwind Translator maps to it. Everything connects through one system.