v0.8 — early adopter window open

A design system,
a running app,
and a deploy.

naina generates a complete design system, wires it into a production-ready template, and deploys it to infrastructure you own. It ships with the documentation a team needs to keep building from day one.

See how it works
~5 minto first running app Full docsshipped in every export Your infradeploy with Kamal over SSH
01 — Handoff

Every export ships with the documentation a team needs to take it from here.

naina doesn't hand you a codebase and walk away. It hands you a codebase and the map to keep building it.

Open your exported project in any editor. The stack, the tokens, the conventions, and what "done" looks like are all written down — because naina wrote it all down for you.

README.md
Conventions, commands, and guardrails at the project root.
knowledge.md
What this product is, who it's for, and why each decision was made.
design-system.md
Tokens, scale, grid, and component rules to follow.
architecture.md
Routes, packages, deploy flow, and every seam worth knowing.
02 · How it works

From a short description to a running product.

Step 01 — Describe

Name, industry, four action colors, one font.

A three-step wizard. naina reads your brand personality and tone and picks sensible defaults for everything else.

name · acme.co
industry · fintech
actions ·
font · Geist
Step 02 — Evaluate

A live app assembles. Tweak anything, see it immediately.

Colors, typography, spacing, components, and pages are editable visually — or through a web console with guardrails that keep you in the system.

primary · oklch(seed-0)
scale · 1.125 → 1.2
grid · 80rem · standard
✓ updated 14 elements
Step 03 — Deploy

Ship to a VPS you own with Kamal.

Not a prototype. A complete application running on your infrastructure — a slim Go backend plus native Web Components, deployable over SSH.

$ kamal deploy
→ build · push · release
→ https://acme.co ● live
03 — Design system

Actions, not shades — colors organized by what they do.

Primary action
seed-0
Secondary action
seed-1
Tertiary action
seed-2
Delete action
seed-3
10 neutrals · derived from primary hueL 18 → 97.5
12345678910
Why OKLch? Perceptually uniform lightness, predictable brightness across hues, wider-than-sRGB gamut, and stable hue while you dim. One control changes intent across the whole system.
04 — Typography

A type scale that fits the viewport.

h1size 6Ship the real thing
h2size 5From idea to product
h3size 4A governed process
h4size 3Pre-styled, responsive
h5size 2Mapped to defaults
h6size 1Add smaller or larger steps any time
psize 0Clamped between the smallest and widest viewports — no media queries.
spansize −2— caption, label, footnote
Narrow viewport
320 px
Scale factors
1.125 → 1.2
Wide viewport
1440 px
05 · Grid

One centered grid, three escape hatches.

Standard80rem · default width for all content
Wide-1+ 2rem · for emphasis and feature rows
Wide-2+ 4rem · for wider canvases and galleries
Full100% · for when content demands more
full100%
wide-2+ 4rem
wide-1+ 2rem
standard80rem
standard80rem
wide-1 (emphasis)+ 2rem
standard80rem
content flows at standard by default child rows stay responsive automatically nested grids work the same way
06 — Components
06

The system builds the components — not the other way around.

Nav · header
brandDocsSystemStart
Hero · section
Ship the real thingnew
A headline, a promise, one CTA.
Cards · feature
OKLchcolors
Clamptype
Gridlayout
Kamaldeploy
Article · layout
2026 · Dispatch #04
The end of the handoff
Editors, engineers, and ops working from the same artifact means fewer drifts.
Gallery · images
CTA · section
Ready to ship?
One command away.
Start building
Footer · site
© naina
2026
product
system
docs
github
status
legal
07 · Stack

A standard stack that outlives the hype.

Go · chi Web Components Plain CSS Rails 8 · soon
Go
Go + chi router
A small, fast HTTP backend. Low memory, low cost, boring in the best way.
available
</>
Native Web Components
Real custom elements. No framework in the browser, no build step, no churn.
available
CSS
Plain modern CSS
OKLch, custom properties, container queries, clamp(). No pre-processor, no runtime.
available
DB
Reliable, well-known database
SQLite or Postgres. Migrations handled. Pick the one you already trust.
available
Rb
Rails 8 · other targets
Other backend flavors are coming. Same design system, same output contract.
coming soon
$ naina deploy — section 08 Deploy

Dockerized. Shipped with Kamal.

Container

Docker, out of the box

A single slim image. The same artifact in dev, staging, and production. No surprises at 2 a.m.

Release

Kamal over SSH

Config, push, release. Minimal yaml. Zero-downtime rollouts to any cheap Linux box.

Runtime

Your infrastructure, your rules

Small Go binary, tiny frontend payload. Runs comfortably on a single modest VPS — no lock-in, no platform tax.

09 · Why

Current tools focus too much on how to deliver.

The only two things that matter are customer experience and business profitability.
→ 01AI tools generate code but rarely ship clean production apps.
→ 02Fragmentation across design, code, and deploy means handovers and wasted time.
→ 03Free-form prompting leads to inconsistency and unnecessary complexity.
→ 04Most outputs are prototypes that die instead of becoming long-term products.
→ 05Talent is wasted on boilerplate and coordination instead of real problems.

Describe your product.
Get the real thing.

A complete running application. Clean code. Deployed to infrastructure you own. No prototypes, no drift, no handoff — in the time it takes to brief a designer.