# Open Props

> A ready made set of CSS custom properties, no framework attached

Category: Design systems and tokens (https://aiarabicdev.com/design-systems)
Canonical page: https://aiarabicdev.com/design-systems/open-props
Tags: design-systems, css, tokens, custom-properties

Open Props is a library of CSS custom properties covering colour, spacing, type, shadows, easings and animations. It is a token layer and nothing else, usable in plain CSS with no build step, no components and no opinion about your markup.

## Facts

- Licence: MIT
- Language: CSS
- Cost: Free and open source
- Self hostable: yes
- Added: 2026-08-23
- Last checked: 2026-08-23

## Links

- Website: https://open-props.style
- Source: https://github.com/argyleink/open-props

## Why a token only library is useful

Most projects need a considered scale far more than they need components. Open Props gives you a complete set of scales, already balanced against each other, which removes the tedious part of starting a design system without importing anyone's aesthetic.

The easing and animation properties are the standouts. Well chosen curves are hard to invent and immediately improve every transition in a project.

## How it sits alongside Tailwind

They overlap and can coexist. Tailwind's theme layer is itself custom properties now, so Open Props values can be mapped straight into it when you want its scales without leaving Tailwind.

For projects not using a utility framework at all, this is the shortest path to a coherent set of variables.

## Reach for it when

- you want a considered scale without adopting a framework
- the project is plain CSS with no build pipeline
- you need good easing curves and do not want to invent them

## Watch out for

- tokens only, so components and layout remain entirely yours
- importing the whole set adds a lot of unused custom properties, so take the subsets you need
- it overlaps with Tailwind's theme, so decide which one owns a value

## Get started

Install:

```sh
pnpm add open-props
```

---

aiarabicdev is a free directory of open source tools. No affiliate links, no sponsored placements.
New entries are announced at https://t.me/arabic_Intelligence