Back
2024 · Project

carioca/ui

Dense, keyboard-first components for dashboards.

RoleDesigner · Engineer
StatusActive · v0.9.0
LicenseMIT
Stars540
carioca/ui

Overview

Why this exists

I spent three years building internal tools. shadcn/ui is great, but it's tuned for marketing sites — generous padding, large hit targets, optimistic color contrast. Dashboards need the opposite: dense rows, keyboard navigation, a palette that survives being stared at for 12 hours.

carioca/ui is what I wish I'd had on day one.

How it works

Radix primitives under the hood, Tailwind utilities on top, and a set of overrides that tighten spacing, shrink hit targets where a keyboard user wouldn't miss them, and pin a neutral-greige palette that doesn't fight with chart colors.

Every component ships with a keyboard-first story: focus rings, Home/End navigation on lists, and Esc that actually dismisses the right thing.

Stack

Tech stack

Reactcore
Radix Primitivesbehavior
Tailwind CSSstyling
TypeScriptstrict
Storybookdocs

Metrics

By the numbers

540
GitHub stars
32
Components
100%
Keyboard covered
0
Runtime deps

Changelog

Milestones

Related

Other work