Blank 3 is the Blank design language as React code: the look of the Blank Figma kit, rebuilt as components and blocks for React 19 and Tailwind CSS v4 in shadcn conventions. Blank 3 Pro is its paid half, 58 blocks and 36 components on top of the free MIT core. You get plain TSX files to copy into a project and edit.
Version 3.0.1 gives the whole library one monochrome look: ink on neutral greys, pill controls on one height scale, hairline surfaces, Geist type and small micro-interactions. Colour is left for status, data and your brand.
Blocks
- 37 marketing sections: 3 navbars, 4 heroes, 2 logo rows, 3 feature sections, 8 bento sections, 2 stats rows, 3 testimonial sections, 2 pricing sections, 2 FAQs, 2 CTAs, newsletter, contact, blog, changelog and 2 footers
- 21 app screens: 8 dashboards, 2 sign-in pages, sign-up, OTP verification, settings, billing, team, kanban, inbox, AI chat, onboarding, empty states and a data table
Six of the dashboards are new in 3.0.1: product analytics, banking, deployments, an AI console, a store admin and a sales pipeline.
Components
- 21 animated bento cards built from Blank components: command palette, inbox, gauge, deploy pipeline, approvals, payments, system health, AI prompt, plans and more
- A drag-and-drop kanban, a TanStack data grid and a revenue card
- Motion pieces: morphing dialog, morph surface, dynamic island, floating panel, glide menu, text rotate and scroll text reveal
- Marketing pieces: floating navbar, hero video dialog, preview card slideshow, product card and task card
The download also has the free core: 106 components (every shadcn primitive with shadcn's names and props, plus form controls, animations and device mockups) and 5 starter blocks.
One knob for your brand
Colour comes from two layers. The palette holds raw values, and semantic roles point at palette steps, once for light and once for dark. Components use only the roles, so you retheme the whole library by editing them. The brand variable is the one colour knob: focus rings, checked, selected and active states follow it. Pick it in the theme configurator on useblank.design and copy the CSS. Every animation respects prefers-reduced-motion.
In the download
- A Next.js starter with every component, demo and block installed and a gallery to browse them (pnpm i, then pnpm dev)
- shadcn-compatible registry files for installing single items with the shadcn CLI
- A README with setup for new and existing projects, plus LICENSE, THIRD_PARTY_NOTICES and CHANGELOG
Before you buy
Every Pro block and component runs live on useblank.design. Blocks switch between desktop, tablet and mobile widths and both themes. The free core is MIT on the public @blank registry, so you can try Blank in your own project first.
You need React 19 and Tailwind CSS v4. The components don't import from Next.js. This pack has no Figma file; the Blank 2.7 Figma kit is a separate product.
Use Blank 3 Pro in your own and client projects. Don't resell or share the source, or put it in kits or templates you sell.
