A production-shaped SaaS starter — even before backend.

This starter ships the UX surface that makes a SaaS feel real: navigation, states, tables, dialogs, settings, billing entrypoints, and auth flows — ready to wire when you’re ready.

Open live demo Read docs

Pro planned (wired auth + billing + more blocks).

Quality gates

a11y defaults, clear states, stable layouts, safe destructive flows.

B2B-ready surface

Members + invitations, settings tabs, billing overview, portal entrypoint.

Wire later

Plug your backend (NestJS/Prisma), Stripe portal, and auth provider when ready.

What’s included

Core pages and patterns that make a starter feel like a real SaaS.

Dashboard

KPI cards with trend indicators + quick actions + credible layout.

Demo

Open

Projects

Table + row actions + rename/delete dialogs + empty/loading states.

Data

Open

Admin

Members + invitations. Resend/cancel actions. B2B readiness.

B2B

Open

Billing

Plan overview + invoices table + portal entrypoint (mock).

Monetization

Open

Settings

Tabs + forms (disabled) + danger zone. Product-like feel.

Surface

Open

Auth

Flow

Open

Why it’s different

Short version here. Deep dive on pycolors.io.

Production patterns

The starter includes interaction contracts, not just components.

• Tables: loading/empty states, row actions, safe destructive flows
• Forms: labels, helper text, error slots, disabled/coming next
• Navigation: stable layout, active route logic, predictable IA

Design system first

Tokens + consistent UI primitives, ready for a pro layer.

• Tokens + theming: consistent spacing, radii, colors
• a11y defaults: aria, focus states, keyboard-friendly overlays
• Reusable states: Skeleton, EmptyState, TableLoading

Quickstart

Clone and run in minutes.

pnpm install
pnpm dev

Want the full guide, architecture notes, and release checklist?

Read docs on pycolors.io