Open Props

FreeDesign System Tooling

Visit Open Props →

Open source

MIT View source →

A set of CSS custom properties — design tokens you can drop into any project.

PriceFree

PlatformsWeb

Why we recommend it

It gives you a considered scale for spacing, colour, easing and shadows without adopting a whole framework, which suits teams building their own system rather than buying one.

Strengths

Framework-agnostic — plain CSS variables
Well-considered scales for spacing, easing and shadow
Use only the pieces you need

Keep in mind

Tokens only — no components whatsoever
Default palette is opinionated
Requires you to build the actual component layer

Is this your tool? Claim this page for free: check the facts, reply to our review and get a badge for your site.

Claim this page

How much does Open Props cost?

Free — Free.

List price, excluding tax. Compare prices across the directory.

✅ Verified 21d ago

Backlight

Collaborative development environment purpose-built for design systems.

Freemium

✅ Verified 19d ago

Design Lint

Figma plugin that flags inconsistent styles and detached components.

Free

✅ Verified 20d ago

Knapsack

Design system platform connecting Figma, code and documentation in one place.

Quote

Visit Open Props →

Get a badge for your site

Link back to your listing and let people know it’s featured here — no account needed, just copy the code below onto your own site.

Featured on The Design Tools

<a href="https://thedesigntools.site/tools/open-props/" style="display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid #E6E6E6;border-radius:999px;font:600 13px sans-serif;color:#171717;text-decoration:none"><span aria-hidden="true">◆</span> Featured on <strong>The Design Tools</strong></a>

1 AI prompts for design systems & ui kits — ready-to-copy prompts for this discipline, organised alongside the directory. Browse design systems & ui kits prompts →