New update
Our Academy is now available! Master the Figma to shadcn/ui process with our short, on-point video tutorials
shadcn
design
Components
Pro Blocks
Plugin
Templates
Academy
Resources
Docs
Updates
Roadmap
Help & Contact
Pricing
Account
Pro Blocks
Page Headers
Page Headers
Header sections for displaying page titles and main actions - built with shadcn/ui.
View blocks
Preview in Figma
Preview
Docs
Page header with placeholders
page-header-1
npx shadcn@latest add "https://shadcndesign-pro-blocks.vercel.app/components?name=page-header-1&key=YOUR_LICENSE_KEY"
Get access in
Premium
Page header with breadcrumbs and actions
page-header-2
npx shadcn@latest add "https://shadcndesign-pro-blocks.vercel.app/components?name=page-header-2&key=YOUR_LICENSE_KEY"
Get access in
Premium
Page header with navigation links on top
page-header-3
npx shadcn@latest add "https://shadcndesign-pro-blocks.vercel.app/components?name=page-header-3&key=YOUR_LICENSE_KEY"
Get access in
Premium
Page header with breadcrumbs and search
page-header-4
npx shadcn@latest add "https://shadcndesign-pro-blocks.vercel.app/components?name=page-header-4&key=YOUR_LICENSE_KEY"
Get access in
Premium
Page header with action buttons
page-header-5
npx shadcn@latest add "https://shadcndesign-pro-blocks.vercel.app/components?name=page-header-5&key=YOUR_LICENSE_KEY"
Get access in
Premium
Page header with primary and secondary actions
page-header-6
npx shadcn@latest add "https://shadcndesign-pro-blocks.vercel.app/components?name=page-header-6&key=YOUR_LICENSE_KEY"
Get access in
Premium
Page header with navigation on the bottom
page-header-7
npx shadcn@latest add "https://shadcndesign-pro-blocks.vercel.app/components?name=page-header-7&key=YOUR_LICENSE_KEY"
Get access in
Premium
Page header with search, profile and buttons
page-header-8
npx shadcn@latest add "https://shadcndesign-pro-blocks.vercel.app/components?name=page-header-8&key=YOUR_LICENSE_KEY"
Get access in
Premium
Pro Blocks are now fully supported in Figma Sites, allowing you to create responsive websites directly within Figma's new website builder.
Get access to coded Pro Blocks in our
Premium Package
Buy now