Blog
Guides that take you from search to install: Host APIs and BYOK, App Router setup, tokens, branding, and how AtroUI compares to other kits. Then open the registry and add components with the shadcn CLI.
Latest
AtroUI is MIT. You install with the shadcn CLI, the source lands in your repo, and Host APIs use your keys. We pick defaults so the first hour is usable. After that, change whatever you want.
Read post →Naive dark mode crushes designed light palettes. Adaptive Theme Switch builds an OKLCH night companion from your light tokens so muted copy still reads. Own the files. Not a theme engine.
AtroUI launch workflow: one ProjectBrief carries Scope Chat and Project Planner into the OG workspace. Own the UI. Preview without keys. Bring your own Host API keys for AI.
@atroui merged into the official shadcn/ui registry directory. What changed, what did not, and how to install without a manual registry URL.
How atroui.com loads a heavy WebGL hero: opaque gate, real progress, shader warm-up underneath, one fade into the finished room. Why piecemeal UI while Three.js boots feels broken.
What shipped in the AtroUI indie site kit: narrow chrome, command menu, changelog, countdown, personal hero, and more. Plus Home Crafts, Feature Grid, and Logo Cloud. How to install and where it sits vs studio Blocks.
How AtroUI Host APIs work: thin Next.js routes, hardened handlers in atroui/api/*, BYOK for forms and AI tools, install modes, rate limits, and what you still own in production.
A detailed look at migrating AtroUI from a classic npm UI package to a shadcn-compatible registry: ownership, updates, Host APIs, and how to migrate an existing app.
AtroUI is a dark-first React / Next.js component catalog. Add it with the shadcn CLI - source lands in your repo. Production sections, brand chrome, editable CONTENT.
Add AtroUI with the shadcn CLI: init, then add @atroui/home-hero. Listed in the official directory. Components land in your repo with editable CONTENT.
How AtroUI’s dark-first tokens work: black canvas, brand blue #0b7bff, glass surfaces, Outfit, and how to override them in atroui/globals.css.
Override AtroUI logo text, SEO defaults, and mail chrome with getBrand() or NEXT_PUBLIC_SITE_*. Keep demo content under content/ separate.
Both use the shadcn CLI. AtroUI ships production sections and brand chrome; shadcn/ui-style kits optimize for blank-slate primitives.
Why Next.js needs transpilePackages for TypeScript UI libraries like AtroUI, common Turbopack errors, and how to fix a fresh App Router install.
Wire dark mode for AtroUI registry components: class strategy, default dark, and tokens so dark-first styles actually apply.
Light-first dark mode is a retrofit. Dark-first tokens, surfaces, and type (like AtroUI) stay coherent as product UIs grow.
Practical lessons from shipping AtroUI: shadcn registry for consumers, peers, CSS entrypoints, and keeping demo content off the public path.
Want the next major slice in your inbox? AtroUI updates. Prefer the catalog? Read the docs or own the UI.