Never build another component twice.
215+ free components with one API on web and native — the open-source library your AI agent reads like docs and ships with. Stop hand-coding the same button for the hundredth time. Own the code.
Built for the stack — and the agents — you already use.
215+ cross-platform components, a live Storybook, and AI configs your coding agent reads like docs. Drop OTF in and Claude, Cursor, or Copilot compose real screens from day one — web and native, one API.
— Components
Composable, not opinionated
220+ production-ready components built on Radix primitives. Drop them in, restyle them, own the code.
Gantt
Project timeline visualizer with drag handles
Kanban
Sortable, accessible kanban board
Code Block
Syntax highlighted code with copy
Color Picker
Composable color picker with eye-dropper
Calendar
Full-featured event calendar
Data Table
Powerful data table with sort + filter
Tags
Multi-select tag input
Tree
Recursive file tree component
QR Code
Customizable QR code generator
Video Player
Custom controls + chapters
Image Crop
Drag-to-crop image utility
Rating
Star rating with half steps
Comparison
Before / after image slider
Rich Editor
Rich text editor on Tiptap
Marquee
Infinite scrolling row
— Compatibility
Drops into the stack you already run.
One registry. React, Next.js, Expo, Remix, Astro. Built on Radix + Tailwind, wired for Hono and Drizzle. Install one package — no migration, no lock-in.
CVAshadcn/ui
Better Auth↑ one registry — the same component API renders on web and native.
— The vibe-coding cost trap
Every prompt rebuilds the same button. You pay for all of them.
Lovable, Bolt, v0, Replit and Rork bill per generation. As your app grows, the agent keeps rewriting components it already wrote — and half come back broken. The cost scales with every iteration; the code never lands.
Metered regeneration
Every screen, every retry, every "fix this" is billed. Your spend tracks your retries — not your progress.
Rebuilt, not reused
Sandboxed agents can't read your repo, so they rebuild from the template each session — overwriting your edits and breaking what worked.
You never own it
The code stays in their walled garden. Custom domain, eject, extend with your own agent? Pay more — or start over.
— OTF flips it
Buy the kit once, own the source. The first 80% — auth, database, billing, the entire component layer — is paid for and battle-tested. Claude, Cursor and Codex read the included CLAUDE.md + conventions + tested prompts and extend real code instead of regenerating it.
Fewer tokens. Working screens. Code you keep.
— Why OTF
Built for builders who ship.
Custom domain in 90 sec
One command wires Railway custom domain + Cloudflare DNS + free email forwarding + auto-renewing TLS. Most kit shops drop you at the README. We ship you to production.
Every AI tool
Ships with CLAUDE.md, .cursorrules, and 20+ tested prompts. Cursor, Claude, Lovable, Bolt — your AI hits the ground running.
Composable
Built with Radix primitives. Mix, match, extend without forking the source.
Accessible
ARIA-compliant out of the box. Keyboard nav, focus rings, screen readers — all covered.
Themable
Tailwind v4 + CSS variables. 5 palettes: Slate, Warm, Cosmic, Terminal, and Custom.
TypeScript-first
Strict TS across the stack. Zero `any`, full inference, generics where they matter — your IDE catches bugs before runtime.
Zero runtime
Components copied into your codebase. No package bloat, no version lock-in.
Open Source
MIT licensed SDK. Read the code, fork it, contribute back — no strings attached.
— Pricing
Simple, honest pricing.
Free SDK forever. $9 landing templates, $99 full-stack kits, or everything in one bundle — pay once, no subscriptions.
Everything you need to build beautiful UIs.
- 220+ UI components
- 5 design themes (dark + light)
- Full TypeScript source
- MIT license
- AI configs (Cursor, Claude, Lovable)
- Community support
One premium single-page marketing site. Frontend-only, deploys static.
- Vite 6 + React 19 + Tailwind v4
- WebGL hero + 5-palette theme switcher
- Real imagery, fully responsive
- AI configs (CLAUDE.md + .cursorrules)
- Builds static — deploy to Cloudflare Pages
- Commercial use — one client project
Every full-stack kit + all 15 landing templates. Save $283.
- OTF Fitness Kit (Expo + React Native)
- OTF SaaS Dashboard Kit (Vite + Hono)
- OTF Booking Kit · Cadence (Expo + Supabase)
- All 15 landing-page templates
- Auth, payments, Postgres — all wired
- AI configs for Cursor, Claude & Lovable
- AI prompts library (40+ tested)
- Future kits, templates + updates included
All kit licenses are per-developer, commercial use included. Full pricing details →
— Loved by developers
What builders are saying
Trusted by engineers and indie hackers shipping faster with OTF components and kits.
“I'm in love with OTF. Feels like the missing parts of shadcn/ui — every component slots in like it was always there.”
“OTF components are a game changer. The Kanban and App Shell are unreal — no other library ships these with this polish.”
“Opened the kit in Cursor and it just worked. The CLAUDE.md meant my AI understood the whole codebase before I typed a single prompt.”
— FAQ
Frequently asked questions
Quick answers on the SDK, the kits, the $9 landing templates, licensing, and AI tools.
Built by engineers from Intuit · Walmart
Crafted for builders who ship.
Production-ready kits built by engineers who've scaled apps at Intuit and Walmart. Not tutorial code — real conventions, real deploy scripts, tested AI prompts included.