You don't need another button. You need the screen.
Base UI (Angular) at base-ui.net shipped cookbooks, Angular 22 signal forms, Open in StackBlitz, and a Pro data table with selection, resize, and server paging. Here's what is free, what is Pro, and what you can try this weekend.
Component libraries are very good at selling you a button. They are less good at the Tuesday afternoon where you need a settings form, an invoice table that talks to an API, or a chat page that can stream a reply.
That stitching work is where weeks go. Base UI (Angular) at base-ui.net aimed the latest work there: five cookbooks that assemble real screens, a data table that can page on the server, Angular 22 signal forms on the same inputs you already use, and Open in StackBlitz so you can try a snippet without installing anything.
Angular’s signal forms guide is the API the signal-forms cookbook follows (form(), [formField], schema validation). StackBlitz is the in-browser playground behind Open in StackBlitz on the docs site. Colorlib’s March 2026 Angular UI roundup cites 17% of professional developers using Angular (Colorlib). The copy-in model is also what shadcn/ui calls “AI-Ready”: “Open Code for LLMs to read, understand, and improve.”
The distribution model is unchanged. npx base-ui-cli add still copies source into your repo. There is still no Base UI package in node_modules. Free is still the primitives and every form block. Pro is still the screens and the heavy widgets.
What changed is how fast you can go from "I have a card" to "I have a page."
Try it without installing
Playgrounds on the docs site — and Getting started — have Open in StackBlitz. You get a runnable Angular snippet with the component already copied in. Useful when you want to see a combobox or a table before you commit a CLI install to a real app.
npx base-ui-cli init --yes
npx base-ui-cli add button card dialog --yes
That is still the whole free-tier on-ramp. Tailwind CSS 4, no custom theme file, color="primary" maps to blue-*.
Five cookbooks (the shareable part)
Cookbooks are assembled screens, not another catalog of primitives. Each one is a page you can open, copy, and strip for parts:
| Cookbook | What it proves | Tier mix |
|---|---|---|
| Account settings form | Input groups, combobox, tags, toggle, save | Free |
| Dialog + form (CVA) | DialogService, ngModel on composite controls, typed close result |
Free |
| Invoice table | Selection, column resize, server page/sort | Pro data-table |
| AI chat page | Message list, streaming reply, tool-call row, prompt | Mix |
| Angular signal forms | form() + [formField] on Base UI inputs, schema validation, submit() |
Free |
The settings and dialog recipes are the honest free-tier pitch: you already have the controls; the missing piece was a screen that wires them. The invoice recipe is the honest Pro pitch: a data table you would otherwise spend a week on.
Data table v2 (Pro)
base-data-table is no longer a client-only demo grid. It still does sort, page, stripes, borders, loading skeletons, and empty states. It now also does the ops-dashboard jobs:
- Row selection — checkbox column,
[(selected)],rowKey - Column resize — drag the header edge; lock a column with
resizable: false - Server page/sort — set
serverSide, pass the current page indata, the full count intotalItems, listen to(pageChange)/(sortChange) - Virtualize — window a large
dataarray in a fixed-height viewport
<base-data-table
selectable
resizable
serverSide
pageable
sortable
[columns]="columns"
[data]="page"
[totalItems]="total"
[(selected)]="selectedIds"
(pageChange)="load($event)"
(sortChange)="load($event)">
</base-data-table>
Install: npx base-ui-cli add data-table (license key required). Walkthrough: the invoice table cookbook. Live API: Data Table.
Signal forms on the same inputs
Angular 22's form() / [formField] path works on Base UI inputs because those controls are ordinary CVA / native elements — not a parallel forms universe. The signal forms cookbook is the recipe: schema validation and submit() without rewriting your field components.
If your app is still on ngModel or reactive forms, nothing broke. The cookbooks show both styles on purpose.
What is free, what is Pro (the line that does not move)
Free (119 items): every primitive (button, card, dialog, hover card, menubar, input, currency, tabs, toast, …), all 19 form blocks (login, signup, checkout, billing, wizard, …), every directive, service, pipe, and utility, 390 icons. No account. No trial clock.
Pro (89 items, $99 once): pre-composed page layouts (dashboard, kanban, inbox, file manager, …), marketing and content blocks, media and social widgets, the unified base-shell, and the heavy widgets — including data-table, rich text editor, file upload, command palette.
The line is still "did we design an entire screen or a week-long widget for you," not "did we cripple the button." You can ship a production dashboard on free. Plenty of people do. The free-tier dashboard article is the long version; there is a live demo.
Pro is worth it when a layout or the data table would save you a week. Inventory: What $99 actually buys.
Full applications (Motif storefront + Motif Admin) are a separate product on top of Pro — templates.
For coding agents, not just humans
The same catalog is published for agents: llms.txt, llms-full.txt, and docs/ai/components.md. Free-tier MCP (base-ui-mcp) can list, search, and add free components. Setup: Getting started — AI agents.
The CLI remains the installer. MCP wraps it. Pro installs still go through BASE_UI_LICENSE_KEY.
This weekend
- Open a cookbook: base-ui.net/cookbooks.
- Hit Open in StackBlitz on a playground if you do not want a local project yet.
- If you do:
npx base-ui-cli init --yesand add three free components. - If the invoice table is the thing you were going to build anyway: that is the Pro buy.
No Base UI runtime in node_modules. The source you add is yours to edit. diff / update still exist for when upstream moves.
npx base-ui-cli init --yes
Frequently asked questions
Same wording as the canonical FAQ.
npx base-ui-cli init → configure Tailwind v4 → npx base-ui-cli add card → done in minutes. Cookbooks and StackBlitz starters at /cookbooks/ and /getting-started/.
Yes — data-table is a Pro component (server paging, sorting, selection). A free composed ops table pattern is shown in the templates.
27 form controls implement ControlValueAccessor, including mention-input and file-upload.
Start with the free tier
All primitives, all 19 form blocks, and 390 icons — no account, no licence key.
Get started