Skip to content

React components for app interfaces

Accessible, animated and themed. The source lands in your app, ready to edit.

npx @taimatsu/paneui@latest init

One install, and it already looks like this

Press anything. Then change the accent or the corners: every card reads the same tokens.

0SMLXL
New project
You can change these later.
Update available
A newer version is ready.
Requests
18.2%
1.28M
Last 7 days
Active users
Active users by month
NewReturning
May12k6k
Jun17k7k
Jul18k10k
Aug23k11k
Sep24k14k
Oct29k15k
Notify me
Storage
Upload
x
Backups
x
Suggestions
Inbox
Calendar
New file⌘N
Settings
Profile
Preferences⌘,
Deploy to production?Build 248 from main. Makes changes.
  • Run the tests, Done
  • Check bundle size, Done
  • Write release notes, Done
October 2026
S
M
T
W
T
F
S
Can you check the release before I ship?
Tests pass. One step needs your OK.
Usage
DayWeekMonth
38.4k+21%

Built for apps people keep open all day

Each component is a file the CLI copies into your project, drawn in your theme and usable from the keyboard.

Fig 1Own the code
components/ui/button.tsxtsx
components/ui/button.tsx

Copied in, and yours to edit

Nothing hides in a package. Read any line, change it, keep it in your repo.

Fig 2Keys
src
app.tsx
theme.css
package.json
↑↓←→
arrows · enter · type to jump

Keyboard first

Trees, menus and grids take the arrow keys. Motion stops for reduced motion.

Fig 3Icons
RoundedEmoji
two styles · one set of names

Icons on the same grid

Swap one file and every icon in the app follows.

Fig 4Theme

This page follows it too.

light · dark · system

Dark mode built in

Every token has a dark value. The switch repaints with a reveal.

Fig 5Corners
--radius8px
MikaDesign
Storage
x
3 new
outer = inner + padding

Concentric corners

Nested surfaces work out their own radius, at every preset.

Fig 6Agents
skills/paneui-design

Rules your agent can read

A design skill ships with the library, so generated code keeps the style.

Six accents, light and dark

Pick one and the whole site follows. The same values ship with your theme.

Frequently asked questions