Features

Mono UI features

Mono UI Features

Figma library

400+ components organized in a structured Figma library with auto-layout, variants, and semantic color styles. Everything a developer-tool designer needs, nothing they don't.

Dark mode first

Every component designed in dark mode first, then light. Mono UI ships with two complete themes — both tested for contrast, both production-ready.

Mono UI dark and light mode comparison — Dark first, light included
Two complete themes — dark-first design, both production-ready.

Developer handoff tokens

CSS variables and a JSON token file ship with every component. Tokens map 1:1 to Figma styles — no translation layer between design and code.

Mono UI token file and CSS variables — Tokens map 1:1 to Figma
CSS variables and JSON tokens ship with every component.

React component starters

Unstyled React component starters wired to the token system. Copy the component, apply your tokens, ship. No fighting a component library's opinions.

Mono UI React starter code snippet — Starters, not a library
Unstyled React starters wired to tokens — copy, apply, ship.