Next.js boilerplate + design system + AI rules
Ship a SaaS that looks designed
One system across Figma, code, and your Cursor / Claude Code.
Wired on day one
Auth, payments, database and email connected out of the box.
One system, zero drift
Figma, code and AI rules never fall out of sync.
AI-native by design
Cursor and Claude Code ship UI that already matches.
The problem
AI tools ship features. They don’t ship taste.
Prompt a feature and you get working code — with default fonts, arbitrary spacing, and a blue button that matches nothing. Every screen drifts a little further from the last.
Same dashboard, same data. The only difference is a system the code actually follows. Drag to compare.
One system, three surfaces
Design, code, and AI rules describe the same thing
const buttonVariants = cva( "inline-flex items-center justify-center rounded-md", { variants: { variant: { default: "bg-primary text-primary-foreground", // violet fill -> signature gradient on hover gradient: "bg-primary hover:bg-[image:var(--gradient-signal)]", }, }, },)# ButtonsPrimary calls-to-action use: <Button variant="gradient"> Never hardcode colors. Use semantic tokens only: bg-primary, text-primary-foreground, bg-card, border-border, text-muted-foreground Radius: buttons + inputs = rounded-md (8px).Built with a few prompts
What you can ship with just a few prompts
What’s inside
A working product, not a component dump
Ship a SaaS that looks designed
48,120
2,340
3.2%
Plan & billing
Ship
€199 · one-time
Payment method
Customers
Create your account
15 wired screens
Landing, dashboard, settings, billing, CRUD, and auth — routed and ready.
Sign in
Auth · Clerk
Sign-in, sign-up, and protected routes wired in.
Payments · Stripe
Checkout and the billing screen, one-time and subscription.
Email · Resend
Transactional templates that match the system.
Figma source
The full library, variables mapped 1:1 to the tokens.
model Subscription {
id String @id @default(cuid())
plan Plan
status Status @default(active)
userId String
createdAt DateTime @default(now())
}Database · Prisma
Typed models for users, subscriptions, and content.
Rules + prompt library
Cursor & Claude Code rules, plus prompts that ship on-brand UI.
Lifetime updates
Buy once. Every new screen and template is yours.
The AI layer
Your AI tools inherit the system
› Add a team members table with an invite button
read .cursor/rules/design-system.mdc
read .cursor/rules/screens.mdc
+ src/app/team/page.tsx
+ uses <DataTable>, <Button variant="gradient">
Composed from existing primitives. Tokens only. No new colors.
✓ Done — matches the system.
Team
Members
Pricing
Buy once. Ship on brand forever.
One-time payments, no subscription. Launch pricing runs for the first 72 hours.
GliaKit UI
The design system, open to everyone.
- Full token set + variables
- Core components in Figma
- Light + dark foundations
Pro
The code system, without the wiring.
- Next.js + shadcn/ui boilerplate
- All 15 screens, styled
- Rules files + prompt library
- Figma source included
Ship
Launch priceEverything, wired and ready to deploy.
- Everything in Pro
- Auth (Clerk) + Payments (Stripe)
- Prisma models + Resend emails
- Lifetime updates
- Priority support
Ship + Studio
€1,499Custom-themed to your brand by the designer who built the system. 3 slots per month.
Who built this
Dejan Veljanoski
Product designer · UI Forge
I built GliaKit because I was tired of AI tools shipping features that looked nothing like the product around them. I use this exact system to ship my own work — Laffari and client products — and now it's the thing I reach for first.
FAQ
Questions, answered
Still unsure? Reach out at hello@uiforge.design.
Ready when you are
Stop shipping default UI.
Ship designed.
The boilerplate, the design system, and the rules your AI tools need — one purchase, yours forever.