Tessera UI

An open-source React library of 48 accessible parts, themed with plain CSS variables.

Open source

React

Accessibility

Tessera UI component library tiles

Client

Open source

My role

Creator and maintainer

Timeline

Since 2023

Year

2023

The challenge

The challenge

Most component libraries make you choose between accessible and themeable. I wanted both, without a build step or a configuration file the size of a novel.

The approach

The approach

Each part is styled with plain CSS variables and tested with a screen reader before it is merged. The documentation is the playground, so every example on the page is the real component.

The outcome

The outcome

Tessera has 48 parts, 3,100 stars and contributors in eleven countries. It won best developer tool at the Lowlands Design Awards in 2024.

Accessible parts

48

Stars on GitHub

3.1k

Countries contributing

11

Next project

Pollen

Pollen air quality widgets
Mai Soriano

I usually reply within a day

Booking November

Have a product that needs both halves of the brain?

I take on two projects a quarter. The next opening is in November, and the first call is always free.

Create a free website with Framer, the website builder loved by startups, designers and agencies.