Blocks
All 28 block components โ pre-built, composable sections for building pages.
Navigation
Headers, footers, and navigation patterns.
SimpleNav
Horizontal nav bar with logo and links.
Nav
Full navigation with dropdowns, auth state, theme toggle, and avatar menu.
PublicNav
Simplified nav used by generated apps. Includes about, pricing, contact, and auth links.
TopBar
Dashboard header with breadcrumbs and avatar menu for authenticated layouts.
Footer
Simple footer with logo, copyright, and optional links.
PublicFooter
Footer used by generated apps with nav links.
BackLink
Back navigation link with arrow icon.
CookieBanner
GDPR cookie consent banner with accept/decline buttons.
We use cookies to improve your experience. Privacy Policy
Hero Sections
Landing page hero patterns.
Hero
Centered hero with title, logo, tagline, description, and CTA buttons.
FloatingHero
Hero with floating/gradient background effect.
Floating Hero
A hero with a subtle floating effect.
Content Sections
Page sections for features, stories, and CTAs.
Blurb
Page title with description intro.
Page Title
A brief description of what this page is about.
Story
Narrative section with image support.
Our Story
This is the first paragraph of our story. And this is the second paragraph with more details about how we got here.
Features
Grid of feature cards with icons.
Fast
Lightning fast performance
Secure
Built with security in mind
Global
Deploy anywhere in the world
StripedSections
Alternating background sections.
Section One
First section content.
Section Two
Second section content with alternating background.
CTA
Call-to-action section.
Team
Team member grid.
Meet the Team
Alice
Developer
Full-stack engineer
Bob
Designer
UI/UX specialist
Services
Service cards with icons and descriptions.
Web Development
Custom websites built to your needs.
CalloutGrid
Grid of callout items with icons.
Feature One
Description of feature one
Feature Two
Description of feature two
CalloutNumbered
Numbered steps.
How It Works
Plan
Define the scope
Build
Develop the solution
Launch
Deploy to production
EmojiList
List with emoji icons.
hello@example.com
Location
San Francisco, CA
CalloutFAQ
FAQ section with accordion.
FAQ
PricingCards
Pricing comparison cards for free/pro tiers.
- Unlimited workspaces
- Priority support
- Advanced analytics
- Custom domains
Auth & Account
Login, signup, profile, and account management.
LoginForm
Card-based login form with email/password.
Don't have an account? Sign up
SignupForm
Card-based signup form with email, name, password, confirm.
Already have an account? Sign in
ProfilePage
User profile with avatar, info, and settings link.
AccountPage
Account settings with profile edit, security, and info cards.
Account
Password changes coming soon.
User ID: demo
AvatarMenu
Dropdown triggered by user avatar โ account link and sign out.
CartDrawer
Slide-out shopping cart with item list, quantity controls, and checkout button.