Formance Design System
The open-source component registry for Formance. Install any component into your project with the shadcn CLI.
Open Source
Tailwind v4
shadcn Registry
Quick Start
Add the Formance registry to your project, then install components:
npx shadcn add https://design-system.localhost/r/button.json
npx shadcn add https://design-system.localhost/r/card.json
npx shadcn add https://design-system.localhost/r/input.jsonExplore
Colors
Brand palettes and semantic colors in OKLCh.
Typography
Polymath, Figtree, and Berkeley Mono typefaces.
Theming
Light and dark mode via CSS custom properties.
Components
25+ components built on Radix UI primitives.
Brand
Formance logo and icon in multiple sizes.
Installation
Install components with the shadcn CLI.
⌘K to search