cmlabsBase GuidelinecmlabsBase GuidelineEverything on this site is installable with one command via the cmlabs-ui CLI — a shadcn-style tool that copies real source files into your own project instead of adding a node_modules dependency.
No install step — npx fetches the latest version of cmlabs-ui and runs it directly.
npx cmlabs-ui add theme fonts base-button badge input textarea container basic-cardThat copies the design tokens, Satoshi font files, the base components, and one card template into your project in one shot. Every card pattern (content list, feed/article, dashboard, pricing/featured) is its own item too — see what else is available:
npx cmlabs-ui listPrefer to install one thing at a time, or only need part of this bundle:
1. Design tokens — colors, radius, gradients, shadows
npx cmlabs-ui add themeThen import it from your own globals.css: @import "./cmlabs-theme.css";
2. The Satoshi font
npx cmlabs-ui add fontsThen wire it up with next/font/local in your root layout — the CLI prints the exact snippet after it runs.
3. Components you actually need
npx cmlabs-ui add base-button
npx cmlabs-ui add dashboard-cardEach component pulls in its own dependency, utils (the cn() helper), automatically.
4. Install the npm packages it asks for
After copying files, the CLI prints exactly which npm packages each component needs, e.g.:
npm install clsx tailwind-merge class-variance-authorityNo CLI, no problem — every component page under Base Components and Components has a "Source Code" tab with a copy button. Copy the file contents into the path shown in its badge (e.g. app/components/ui/button.tsx) and install the same npm dependencies listed on that page.