Docs
Introduction
Ballmac UI is a collection of polished React and Tailwind CSS components, blocks and templates: desktop-style app surfaces, living backgrounds, text effects, device frames and AI interfaces, distributed as a shadcn registry.
You don't install Ballmac UI as a package. You add the components you need with the shadcn CLI, and the source lands in your project, ready to read and change. Your AI coding agent can do the same through the Ballmac MCP server (@ballmac/mcp) or the shadcn MCP server.
What makes it different
- Native-app polish. Ballmac builds native apps, and brings the same care for springs, depth and hairlines to the web: app windows, docks, a live notch, menus and notifications that work in any product.
- One design language. Primitives, effects, AI interfaces and developer components share tokens, spacing, focus states and motion curves, and follow your theme in light and dark mode.
- Effects with manners. Globes, beams and particles pause off-screen, stop for reduced motion and keep your page accessible.
- No collisions. Everything installs into
components/ballmac, so it never overwrites your shadcn/ui files. Dependencies are declared honestly and checked on every build. - Made for AI agents. Every item carries a description, when to use it, when not to, what it composes with, and keyboard notes, available through MCP and llms.txt.
- Verified installs. Each release installs every item into a fresh Next.js app, then type-checks and builds it.
Free and Pro
Every component, block, template and theme is free and MIT licensed. Ballmac UI Pro adds 150 premium blocks, two complete starter apps and the Figma tokens, delivered through a private registry with a licence key. Set up Pro.
Requirements
- React 19 and Tailwind CSS v4
- A project set up with
shadcn init(it createscomponents.jsonandlib/utils)
Next: install your first component, or connect your AI agent. Stuck, or found a bug? Contact support, or open an issue on GitHub.