PyColorsUI
v1 · stable baselineDocs-firstGitHub

A minimal UI systembuilt to ship SaaS.

PyColors UI is a documentation-first design system built on semantic tokens and Radix primitives — now including advanced interactions and data UI foundations for real product screens.

PyColors UI is the minimal foundation powering Templates and SaaS Starters.

Explore the docsBrowse componentsBrowse templates
Current version
v1.1.0
Docs format
Preview → Usage → Code → Props
Release cadence
Weekly releases
Getting startedComponentsChangelogRoadmapTemplatesLicense

Highlights

A focused baseline for building product UIs with predictable patterns.

Advanced interactions included

Dialog, sheet, dropdown menus, tabs, and toasts — accessible Radix primitives with consistent API and docs.

Data UI foundations

Tables, pagination, empty states, and skeletons — the baseline you need for dashboards and CRUD screens.

Docs that don’t waste time

Preview → Usage → Code → Props + practical guides for forms and async UI states.

Who it’s for

Built for people shipping real interfaces: SaaS apps, dashboards, and marketing sites.

Get started
SaaS products

Dashboards, settings, billing pages, CRUD flows — with predictable UI density and tokens.

Data-heavy dashboards

Tables, filters, pagination, empty states, and system feedback — without fighting your UI foundation.

Marketing sites

Landing pages that stay consistent with your app UI — typography, spacing, tokens, and components.

Quick start

Clone the repo, run docs locally, and start copying components.

Fast path: open docs → copy a component → ship a screen.

Node 18+PNPM recommendedDocs-first workflow
Start from a component
terminal
GitHub
git clone https://github.com/pycolors-io/pycolors-ui.git
cd pycolors-ui
pnpm install
pnpm dev
Then open http://localhost:3000

What’s in v1

Advanced interactions + data UI foundations — documented, consistent, extensible.

See all components
Dialog

Accessible modal primitives built on Radix UI.

v1.1
Open docs →
Sheet

Slide-over panels for filters, actions, and contextual UI.

v1.1
Open docs →
Dropdown Menu

Groups, submenus, checkboxes/radios, shortcuts.

v1.1
Open docs →
Tabs

Segmented navigation with size variants and theming.

v1.1
Open docs →
Toast

Minimal, accessible notifications with variants.

v1.1
Open docs →
Table

Composable data table primitives + empty/loading states.

v1.1
Open docs →
Pagination

Stateless pagination UI primitives (UI-only).

v1.1
Open docs →
Skeleton

Loading placeholders that preserve layout.

v1.1
Open docs →
Empty State

Clear empty UI with optional actions and guidance.

v1.1
Open docs →
Password Input

Accessible show/hide toggle for auth flows.

v1.1
Open docs →
Next up: Blocks library + premium Templates — tracked in Roadmap.

Start here

Build your first screen with PyColors UI today.

Public roadmapChangelog updatesOpen-source repo
Read the docsTemplatesView repository

Building in public. Shipping weekly.