Your Design System
Pick your colors, choose a style, and export a complete design system — tokens, components, and all. Give it to your AI tools or use it yourself. Takes 5 minutes.
Pick with HSL — Prim converts to OKLCH behind the scenes for perceptually uniform color scales, every time.
Try a preset
From zero to a design system in 5 minutes
No agency, no Figma deep-dive, no week of bikeshedding. Pick your look, export your code, get back to building.
Look legit, instantly
Pick colors and a style. Prim generates a complete, consistent theme with proper contrast and dark mode. Looks like a designer did it.
Code you can actually ship
Not a mockup. Real React components in Tailwind or vanilla CSS — your tokens baked in. Copy, paste, done.
Building blocks for your AI
Export your design system and drop it into your AI tool's context. Now it generates consistent UI instead of random slop.
Accessible by default
Every theme auto-corrects for accessibility. You pick the colors — Prim makes sure everyone can read them.
WCAG AAA contrast
Surface text and link colors auto-correct to meet the strictest WCAG AAA standard (7:1 ratio). Not just checked — enforced.
Adaptive link shades
Links automatically walk the color scale to find the lightest/darkest shade that passes AAA on your background. Always readable.
Perceptual color science
OKLCH color space ensures uniform perceived lightness across hues. No more "the blue looks darker than the green at the same step."
Live contrast audit
Real-time WCAG checker (tap the button in the corner) shows AA, AA Large, and AAA pass/fail for every text/background pair.
Prim by the numbers
Everything you need, nothing you don't. All with your unique flair.
Frequently asked questions
Everything you need to know about Prim.
Stop overthinking your UI.
5 minutes to a design system that looks like you hired a team. Runs right in your browser.