S
shadcnstore
/
shadcn-dashboard-landing-template
/
blocks
Files
Code
Info
App 1 - Dashboard
app-1
Simple dashboard layout with sidebar navigation and stats
App 2 - Task Board
app-2
Kanban-style task board with drag-and-drop functionality
App 3 - Messages
app-3
Conversation list, grouped message thread, disciplined autoscroll, typing state, and responsive composer
App 4 - File Manager
app-4
Grid and list file manager with shared selection, bulk actions, search, and preview sheet
App 5 - Issue Tracker
app-5
Grouped keyboard-first issue list with inline status editing, selection, and detail sheet
App 6 - Settings
app-6
A settings suite with account, notification-matrix and team panels that keep unsaved work across tabs
App 7 - Patient Intake
app-7
A persisted, branching patient-intake wizard with repeatable medication and allergy records
App 8 - Team Invites
app-8
A care-team invitation flow with paste-many email chips and permission previews
App 9 - Billing Statement
app-9
A print-ready medical statement with encounter lines, payer adjustments and a superbill variant
App Shell 1
app-shell-1
Responsive sidebar, breadcrumb header, workspace navigation, and calm application content frame
App Shell 2
app-shell-2
Collapsible icon rail with persistent state, accessible tooltips, mobile sheet, and reflowing content
App Shell 3
app-shell-3
Two-level top navigation with workspace context, scrollable sub-navigation, and centered content
App Shell 4
app-shell-4
Multi-tenant workspace shell with switcher, persisted nested navigation, breadcrumb context, and command seam
App Shell 5
app-shell-5
Resizable list, detail, and inspector panes with keyboard selection and a designed mobile stack
Banner 1
banner-1
A dismissible announcement bar that remembers the choice
Banner 2
banner-2
A promo banner with a live countdown and copyable discount code
Banner 3
banner-3
A cookie consent bar with a granular preferences dialog
Banner 4
banner-4
A delayed, scroll-gated floating announcement card with a shadow-bloom spring entrance and a data-switched avatar-pill variant
Banner 5
banner-5
A token-only site alert system — sticky strip, page banners and inline banners — matching notification-5\'s severity map
Bento Grid 1
bento-grid-1
A destination bento with a filter row and a top-rated tile
Bento Grid 10
bento-grid-10
A bento where every card holds a piece of the product and the pointer finishes the sentence: a note lands on a frame, a version stack fans out, a grade wipes, a link copies, an approval stamps
Bento Grid 11
bento-grid-11
A current-account bento where every tile works: a metal card that tilts and catches the light, a balance that counts itself in, two ledger lanes that pause under the pointer, a transfer that really runs its four steps, and a freeze switch that goes and frosts the card
Bento Grid 12
bento-grid-12
A ticketing bento for one night in a 198-seat room: a seating plan that fills seat by seat as the sale runs, orders pushing into a live feed, a split-flap board turning over the tour dates, a grained gig poster with light crossing it, and the first four minutes of the on-sale replayed as a histogram
Bento Grid 2
bento-grid-2
A comprehensive dashboard component showcase featuring deployment analytics, team activity, performance metrics, and integrations - perfect for SaaS applications
Bento Grid 3
bento-grid-3
A professional bento grid highlighting services, client testimonials, and business achievements
Bento Grid 4
bento-grid-4
A six-column travel bento pairing one large destination tile with smaller ones
Bento Grid 5
bento-grid-5
A centre-weighted bento for an AI product, built around one WebGL body of warped noise that churns and turns toward the pointer
Bento Grid 6
bento-grid-6
A left-heavy bento for a developer platform, driven by one token-bucket simulation that feeds a rolling rate-limit graph and a live throughput counter in a separate tile
Bento Grid 7
bento-grid-7
A retail bento built around a full-width collection rail you can throw, with real momentum on a native scroller so keyboard, touch and zoom all keep working
Bento Grid 8
bento-grid-8
An analytics bento whose only motion is other people: live cursors walking hand-placed routes across one overlay spanning the whole board, with the data left still
Bento Grid 9
bento-grid-9
A careers bento built around a full-height wall of faces tipped in 3D and scrolling on three unsynchronised columns, with published salary bands and a timed hiring process beside it
Blog Section 1
blog-section-1
A clean three-card layout with image placeholders, categories, titles and call-to-action links
Blog Section 2
blog-section-2
A grid of recent blog posts with images, titles, authors, and tags
Blog Section 3
blog-section-3
A horizontal scrollable stories grid with gradient borders and avatars
Blog Section 4
blog-section-4
A responsive grid layout featuring news cards with images, titles, and metadata
Calendar 1
calendar-1
A month calendar application with a sidebar, filterable calendars and a day detail sheet
Calendar 2
calendar-2
A week time grid with positioned events and a mobile agenda fallback
Calendar 3
calendar-3
A studio class booking flow with timezone-aware slots, waitlist and a directional date-change transition
Calendar 4
calendar-4
A rooms-by-hour resource timeline with overlap lane-splitting, a real now-line and a designed mobile layout
Calendar 5
calendar-5
A grouped agenda list with a derived attendance streak strip, composed filters and sticky day headers
Calendar 6
calendar-6
A front-desk studio switcher that swaps the day\'s class list, with live capacity badges and a working join-waitlist action
Calendar 7
calendar-7
A four-question studio intake that assembles a computed recommended week
Calendar 8
calendar-8
A plain month grid with a selected-day list — no shell, no filters, no dialogs
Category Filter 1
category-filter-1
A horizontal filter bar with dropdowns and active filter display
Category Filter 2
category-filter-2
A sidebar filter with expandable categories and subcategories
Category Filter 3
category-filter-3
A comprehensive filter sidebar with toggle-based selection and real-time results
Category Filter 4
category-filter-4
A mobile-first filter drawer with a live, settling result count and applied-filter chips that stay visible after it closes
Category Filter 5
category-filter-5
A faceted search with correct exclude-own-facet counting, options that disable in place at zero, and a computed, recoverable no-results suggestion
Changelog 1
changelog-1
An editorial release timeline with version anchors and copyable links
Changelog 2
changelog-2
A dense changelog with type filters, month grouping and expandable rows
Changelog 3
changelog-3
Scroll-stacked releases that hand over one at a time, each pairing its version panel with what changed and why
Changelog 4
changelog-4
A plain release list with a date rail and every line tagged added, improved or fixed
Chart 1
chart-1
Clean and simple bar and line chart displaying monthly sales volume and conversion rate trends with dual y-axis visualization
Chart 2
chart-2
Modern combined bar and line chart showing revenue performance vs targets with growth percentage trends, featuring interactive time period filters and comprehensive metrics dashboard
Chart 3
chart-3
Comprehensive analytics dashboard chart with product sales and volume metrics, featuring trend indicators and recent activity tracking
Chart 4
chart-4
Interactive financial dashboard with tabbed navigation showing Income (area chart), Expenses (radial chart), and Profit (bar chart) with real-time metrics
Chart 5
chart-5
Time-based earnings dashboard with interactive time period tabs (1d, 5d, 1m, 6m, 1y) and area chart visualization with recent activity tracking
Chart 6
chart-6
Radial progress chart dashboard showcasing company performance metrics with department breakdown and visitor statistics
Checkout Form 1
checkout-form-1
A clean and straightforward checkout form with essential fields
Checkout Form 2
checkout-form-2
A comprehensive single-page checkout with order summary and secure payment
Checkout Form 3
checkout-form-3
A guided multi-step checkout process with progress indicator and validation
Checkout Form 4
checkout-form-4
A checkout form with collections of presets
Checkout Form 5
checkout-form-5
An order confirmation page with a fulfilment timeline, line items and totals
Checkout Form 6
checkout-form-6
A checkout with an async address combobox, delivery tags, a date range picker, phone with OTP verification and currency-formatted totals
Comparison 1
comparison-1
An us-versus-alternatives table that becomes cards on mobile
Comparison 2
comparison-2
A plan feature matrix whose lit column follows the pointer, with a billing switch, sticky plan headers and a mobile plan picker
Comparison 3
comparison-3
An in-app change-plan screen: drawn tier marks, offer captions and struck list prices on cards above a feature matrix that upgrades and downgrades for real
Contact Form 1
contact-section-1
Clean and minimal contact form with essential fields
Contact Form 2
contact-section-2
Contact form alongside company information cards
Contact Form 3
contact-section-3
Contact form with location map and office details
Contact Form 4
contact-section-4
Two-column layout with form and contact details
Contact Form 5
contact-section-5
Contact section with frequently asked questions
Contact Form 6
contact-section-6
Contact form with team member cards and social links
CTA Section 1
cta-section-1
A single-line call to action with a live badge and two actions
CTA Section 10
cta-section-10
Clean and elegant CTA perfect for any business website
CTA Section 11
cta-section-11
Enterprise CTA with an animated perspective grid floor and mono display headline
CTA Section 12
cta-section-12
Payments infrastructure CTA with an animated routing grid, dual actions and a metric row
CTA Section 13
cta-section-13
Global expansion CTA with a configurable WebGL wave field and inline email capture
CTA Section 2
cta-section-2
A community subscribe card with an inline email field and avatar proof
CTA Section 3
cta-section-3
A split call to action with documentation and tutorial links beside the primary button
CTA Section 4
cta-section-4
A centred call to action with two buttons and no-credit-card reassurance
CTA Section 5
cta-section-5
Modern enterprise CTA with feature showcase cards
CTA Section 6
cta-section-6
Engaging newsletter signup with perks showcase and social proof elements
CTA Section 7
cta-section-7
High-impact productivity CTA with gradient buttons and trust indicators
CTA Section 8
cta-section-8
Interactive team showcase with hover effects and gradient text elements
CTA Section 9
cta-section-9
Split layout CTA with organized resource links and image hover animations
Datatable 1
datatable-1
Comprehensive user management table with search, filters, pagination, and action dropdowns. Includes user avatars, roles, login status, and two-factor authentication badges
Datatable 2
datatable-2
Advanced user records table with statistics cards, role icons, plan details, and status management. Features filter dropdowns, bulk actions, and comprehensive pagination
Datatable 3
datatable-3
Product inventory management table with images, SKU tracking, quantity badges, star ratings, and status indicators. Includes stock alerts and product actions
Datatable 4
datatable-4
Modern orders datatable with analytics cards, command palette (⌘K), tabs navigation, bulk actions, column visibility control, and real-time order tracking. Features multi-filter system, sortable columns, payment methods, priority levels, and comprehensive status workflow management.
Datatable 5
datatable-5
URL-synced server-state table with saved views, async states, faceted filters, and record details
Error Page 1
error-page-1
A centred 404 page with an illustration, a home link and a contact action
Error Page 2
error-page-2
A split 404 page with the brand mark, an illustration and a single home action
Error Page 3
error-page-3
Interactive 404 page with search and help options
Error Page 4
error-page-4
Maintenance page with countdown and progress tracking
FAQ Block 1
faq-block-1
A bordered single-column accordion with multiple items openable at once
FAQ Block 2
faq-block-2
A single-open accordion with an underline trigger style and a two-paragraph intro
FAQ Block 3
faq-block-3
A borderless, two-column accordion layout for a longer question set
FAQ Block 4
faq-block-4
A card-style accordion with a search field affordance, for the functional search variant see faq-block-5
FAQ Block 5
faq-block-5
A functional FAQ search that highlights matches inside answers, composes with categories and emits FAQPage schema
Feature 1
feature-1
A four-up feature grid of icon cards under a badge heading, closing on a call to action
Feature 10
feature-10
A mixed-width feature board pairing metric cards with data-table and dashboard previews
Feature 11
feature-11
Scroll-pinned feature reel that dissolves one photograph into the next beside a numbered step rail
Feature 12
feature-12
Scroll-stacked benefit cards that pin in turn, each pairing a live mini interface with a proof checklist
Feature 2
feature-2
A two-column feature list paired with an image and no card chrome
Feature 3
feature-3
A dual-image feature layout with four benefit rows beside the photography
Feature 4
feature-4
Feature section with 2x3 grid layout and clean card design
Feature 5
feature-5
A three-card feature section on a dot-pattern surface
Feature 6
feature-6
Card-based feature section with decorative grid backgrounds
Feature 7
feature-7
Feature section with dual image showcase and feature grid
Feature 8
feature-8
A split feature section pairing four capability rows with a dashboard image and two actions
Feature 9
feature-9
A six-item feature grid arranged over two images without cards
Footer Section 1
footer-section-1
A footer with an inline email capture beside three columns of links
Footer Section 2
footer-section-2
A half-image footer carrying a postal address, phone and email beside the link columns
Footer Section 3
footer-section-3
A six-column footer that leads with the newsletter form and follows with four link columns
Footer Section 4
footer-section-4
A five-column footer with quick links, resources, legal and a get-in-touch column
Footer Section 5
footer-section-5
A footer on a soft gradient with an address block, contact lines and a stay-updated form
Footer Section 6
footer-section-6
A minimal two-row footer with top navigation, a language menu and city links
Footer Section 7
footer-section-7
A three-column footer pairing contact details and link groups with a subscribe form
Forgot Password Page 1
forgot-password-page-1
A four-step reset covering email, one-time code, new password and confirmation
Forgot Password Page 2
forgot-password-page-2
Simple password reset form with email confirmation
Forgot Password Page 3
forgot-password-page-3
Multi-step password reset with verification code
Forgot Password Page 4
forgot-password-page-4
A four-step reset with labelled fields and a resend-code action
Forgot Password Page 5
forgot-password-page-5
A modern two-column forgot password page with illustration
Forgot Password Page 6
forgot-password-page-6
A split-screen reset across the email, code, new password and success states
Hero Section 1
hero-section-1
A split hero with a badge, an avatar group and a trusted-by line under the call to action
Hero Section 10
hero-section-10
A fitness app hero on a full-bleed running photo printed as a halftone, with a pointer-led reveal lens
Hero Section 11
hero-section-11
A showcase hero whose three rows of work drift in alternating directions on a tilted plane that straightens as you scroll
Hero Section 12
hero-section-12
A product-launch hero under a drifting WebGL aurora, with a browser-framed screenshot and a stat row
Hero Section 13
hero-section-13
A split hero on a node web that links itself and leans toward the cursor, beside a live signal console
Hero Section 14
hero-section-14
A waitlist hero lit by counter-rotating beams, with a sheened headline, inline email capture and a wordmark marquee
Hero Section 2
hero-section-2
A split hero built around a fixed-ratio media card for a product image or video
Hero Section 3
hero-section-3
A centred hero with a dashboard preview above a logo row of named customers
Hero Section 4
hero-section-4
A hero that carries four headline metrics as cards directly under the call to action
Hero Section 5
hero-section-5
A hero with its own navigation bar, avatar proof and a full-bleed destination image
Hero Section 6
hero-section-6
A search-led hero with tabs and location, type and price-range selects over an image grid
Hero Section 7
hero-section-7
An AI product hero with a token-derived gradient and a looping chat demo
Hero Section 8
hero-section-8
An editorial property hero whose photograph grades from midday to dusk across a draggable seam
Hero Section 9
hero-section-9
A centred hero in an inset panel, with the stages of an authorisation fanned in 3D and dragged by hand
Listing 1
listing-1
A three-up service listing with category badges and a get-started action
Listing 2
listing-2
A category listing that scrolls horizontally through destination cards
Listing 3
listing-3
A two-column course listing with instructor avatars and category labels
Listing 4
listing-4
A three-up course listing with a category badge on each card
Listing 5
listing-5
A property listing with bed, bath and area counts and a view-details action
Listing 6
listing-6
A category carousel with a progress indicator across twelve subject cards
Login Page 1
login-page-1
A card login with remember-me, a forgot-password link and three social buttons
Login Page 2
login-page-2
Clean and simple login form with social authentication
Login Page 3
login-page-3
Split-screen login with background image and enhanced UX
Login Page 4
login-page-4
A labelled card login with social buttons placed above the email and password fields
Login Page 5
login-page-5
A modern two-column login page with illustration
Login Page 6
login-page-6
A split-screen login with the card on one side and a product panel on the other
Logo Cloud 1
logo-cloud-1
Showcases ShadcnStore compatibility with popular technologies and development frameworks
Logo Cloud 2
logo-cloud-2
Customer testimonials and success metrics highlighting ShadcnStore component benefits
Logo Cloud 3
logo-cloud-3
Professional showcase featuring industry leaders who use ShadcnStore components
Logo Cloud 4
logo-cloud-4
Enterprise-focused showcase highlighting ShadcnStore components for large-scale applications
Logo Cloud 5
logo-cloud-5
Community-focused showcase featuring ShadcnStore partner companies and ecosystem growth
Navbar 1
navbar-1
A clean marketing navbar with a sheet menu on mobile
Navbar 2
navbar-2
A mega-menu navbar with grouped flyouts and a featured card
Navbar 3
navbar-3
A scroll-aware navbar that condenses into a floating pill
Navbar 4
navbar-4
A storefront navbar with live search, avatar account menu, animated cart badge, and a product grid demo
Navbar 5
navbar-5
A documentation-site header with a collapsing secondary row, breadcrumb promotion, ⌘K search and version switching
Order History 1
order-history-1
An order table with item thumbnails, dates, quantity, price and an invoice download
Order History 2
order-history-2
An order list grouped by status, with tracking and details actions per order
Order History 3
order-history-3
A tabbed order history with a date-range filter, invoices, reorder and review actions
Order History 4
order-history-4
A detailed table view for managing orders with sorting and pagination
Order History 5
order-history-5
A single-order detail page with a fulfillment timeline, per-shipment items, address and payment summary, and returns, reorder and invoice actions
Pricing Section 1
pricing-section-1
A three-tier pricing grid with a popular badge and a feature list per plan
Pricing Section 2
pricing-section-2
A three-tier pricing grid with a raised middle plan and per-plan feature lists
Pricing Section 3
pricing-section-3
A three-tier pricing grid with a monthly and annual billing switch
Pricing Section 4
pricing-section-4
A clean and modern pricing section with a focus on features and benefits
Pricing Section 5
pricing-section-5
Two-tier pricing layout with Personal vs Team plans and comprehensive features grid
Pricing Section 6
pricing-section-6
Comprehensive 4-tier pricing with Free, Personal, Teams, and Enterprise plans
Pricing Section 7
pricing-section-7
A usage-based pricing calculator with live totals and volume tiers
Pricing Section 8
pricing-section-8
Scroll-stacked plans that hand over one at a time, each pairing its price panel with who it is for and what it does not do
Product Listing Card 1
product-card-1
A deals grid of product cards with an add-to-cart action on each
Product Listing Card 2
product-card-2
A three-up product grid carrying image, name and price only
Product Listing Card 3
product-card-3
A product grid with low-stock badges and a view-similar action
Product Listing Card 4
product-card-4
A product carousel and grid combination across twelve items
Product Listing Card 5
product-card-5
Table-style product listing with comparison and sorting features
Product Category Card 1
product-category-1
A four-up category grid of subjects with a view-all action
Product Category Card 2
product-category-2
Image-based category cards with overlay text and trending badges
Product Category Card 3
product-category-3
A seven-column category strip of small image tiles
Product Category Card 4
product-category-4
A category grid with icon avatars and item-count badges
Product Category Card 5
product-category-5
Detailed category list with icons, subcategories, and search functionality
Product Category Card 6
product-category-6
A curated category layout with status badges such as trending and featured
Product Category Card 7
product-category-7
A three-up category grid badged for new arrivals, best sellers and sale
Product Overview 1
product-overview-1
A product page with an image carousel, a size grid and colour swatches
Product Overview 2
product-overview-2
A product page with a thumbnail carousel, a size guide link and a delivery threshold
Product Overview 3
product-overview-3
A furniture product page with colour options, delivery choice, lead-time note and recently viewed
Product Overview 4
product-overview-4
A product page with financing, a quantity select, a postcode delivery check and returns detail
Product Overview 5
product-overview-5
A product page with tabbed overview and specifications plus a gallery dialog
Product Overview 6
product-overview-6
A quick view dialog with an image gallery, variant selection and add to cart
Product Overview 7
product-overview-7
A product story whose pinned panel swaps to the section being read, with buy controls above the argument for them
Product Review & Ratings 1
review-rating-1
A paginated review list with reactions and a write-a-review form
Product Review & Ratings 2
review-rating-2
A rating summary with a per-star distribution above a review carousel
Product Review & Ratings 3
review-rating-3
A review list with a rating filter, distribution bars and pagination
Product Review & Ratings 4
review-rating-4
A review section with per-category ratings, sort controls and a load-more action
Product Review & Ratings 5
review-rating-5
Simple review list with rating distribution and helpful voting
Roadmap 1
roadmap-1
A three-column Now, Next and Later board that publishes order rather than dates
Shopping Cart 1
shopping-cart-1
A more detailed cart summary with multiple items and discounts
Shopping Cart 2
shopping-cart-2
A clean and modern cart with promo codes and shipping info
Shopping Cart 3
shopping-cart-3
A simple cart summary with item list and total
Shopping Cart 4
shopping-cart-4
A collapsible cart sidebar with progress tracking and quick checkout
Shopping Cart 5
shopping-cart-5
A cart and wishlist combo where moving an item between lists animates the row traveling, with stock warnings, price-drop badges and separate empty states
Signup Page 1
signup-page-1
A card signup with social options and terms and privacy links under the button
Signup Page 2
signup-page-2
Multi-step signup form with progress tracking
Signup Page 3
signup-page-3
Simple signup form with social authentication options
Signup Page 4
signup-page-4
A labelled card signup with a confirm-password field and social options
Signup Page 5
signup-page-5
A modern two-column signup page with illustration
Signup Page 6
signup-page-6
A split-screen signup with the card beside a product panel
Signup Page 7
signup-page-7
A multi-step signup wizard with blocking per-step validation and a review step
Statistic 1
statistic-1
Modern statistics grid with progress indicators and performance metrics
Statistic 2
statistic-2
Side-by-side layout showcasing company metrics and growth statistics
Statistic 3
statistic-3
Comprehensive platform statistics with trend indicators and progress bars
Statistic 4
statistic-4
A four-metric growth grid with year-over-year context and a closing call to action
Statistic 5
statistic-5
Comprehensive business dashboard with summary cards and detailed analytics
Statistic 6
statistic-6
Clean metrics grid displaying key performance indicators
Statistic 7
statistic-7
An analytics board pairing sales by category and recent transactions with four summary figures
Statistic 8
statistic-8
A sales analytics section with a monthly revenue table, top customers and performance figures
Storefront Hero Section 1
storefront-hero-1
A storefront hero pairing a collection banner with buyable product cards
Storefront Hero Section 10
storefront-hero-10
An interiors hero with an oversized headline the product photo sits on, cursor-parallax price and spec cards, and a press marquee
Storefront Hero Section 11
storefront-hero-11
A sneaker drop hero laid out as a centred poster, with a pointer-scattered particle field, a live countdown and colourway thumbnails that recolour the whole frame
Storefront Hero Section 12
storefront-hero-12
An editorial skincare hero: a full-width headline over three columns, with a numbered routine list and a product stage lit by WebGL caustics
Storefront Hero Section 13
storefront-hero-13
A bento storefront hero whose tiles are crossed by one travelling light, with a featured product alongside dispatch, returns and rating facts
Storefront Hero Section 2
storefront-hero-2
A storefront hero with a search field and a trending product carousel
Storefront Hero Section 3
storefront-hero-3
A storefront hero with a full header, search suggestions and a help panel
Storefront Hero Section 4
storefront-hero-4
A storefront hero under a promo bar, with language, location and category menus
Storefront Hero Section 5
storefront-hero-5
Elegant hero section with category navigation and featured deals
Storefront Hero Section 6
storefront-hero-6
Clean layout highlighting featured products with hover effects
Storefront Hero Section 7
storefront-hero-7
Premium hero section with winter theme and featured products
Storefront Hero Section 8
storefront-hero-8
Modern tech store hero with featured products and countdown timer
Storefront Hero Section 9
storefront-hero-9
An editorial fashion hero whose photograph ripples like cloth under the pointer, with a look picker that cross-fades the shot
Team Profile 1
team-1
An agent grid whose cards carry listing counts, languages and a profile link
Team Profile 2
team-2
A four-up agent grid with listed-property counts under each portrait
Team Profile 3
team-3
A twelve-column team carousel with avatars, roles and a view-all action
Team Profile 4
team-4
A four-up team grid carrying a portrait, a name and a role and nothing more
Team Profile 5
team-5
An instructor grid whose cards pair the avatar with course and student counts
Team Profile 6
team-6
A four-up profile grid with full-bleed portraits and role captions
Team Profile 7
team-7
A three-up agent grid with call and email actions on every card
Team Profile 8
team-8
A four-up corporate team grid with a role badge on each portrait
Team Profile 9
team-9
An executive team layout pairing portraits with location, experience and project counts
Testimonial 1
testimonial-1
A quote carousel with an avatar, a role and a short headline per review
Testimonial 10
testimonial-10
Draggable proof board of real tweets, Slack messages, emails and reviews, each keeping its own chrome
Testimonial 2
testimonial-2
A hero testimonial layout with featured testimonial and supporting cards
Testimonial 3
testimonial-3
A grid-based testimonial wall showcasing customer feedback
Testimonial 4
testimonial-4
A two-column testimonial carousel with a photograph and a dialog for the full quote
Testimonial 5
testimonial-5
A three-column testimonial carousel above satisfaction, rating and uptime figures
Testimonial 6
testimonial-6
A twelve-column testimonial mosaic built from mixed-width quote cards
Testimonial 7
testimonial-7
A student testimonial carousel carrying an avatar, a role and a rating per card
Testimonial 8
testimonial-8
A borderless testimonial wall under a badge heading, with a load-more action
Testimonial 9
testimonial-9
A testimonial carousel sized for course and training pages, with arrows and avatars
Timeline 1
timeline-1
A public Now/Next/Later roadmap board with vote chips
Verify 1
verify-1
Two-factor code entry with resend cooldown, backup codes and lockout
Verify 2
verify-2
Email verification covering check-inbox, verified and expired states
Verify 3
verify-3
Passkey sign-in with a biometric ring, magic-link fallback and an unsupported-browser layout
Verify 4
verify-4
Patient SMS verification end to end: country entry, a draining cooldown ring, voice fallback and lockout
Verify 5
verify-5
Insurance card capture with an extraction reveal, confidence flags, eligibility results and actionable rejections
Verify 6
verify-6
Split-screen identity check: code entry beside the booking it protects, with a guest testimonial
Waitlist 1
waitlist-1
A single-screen waitlist page that returns a position in line
Waitlist 2
waitlist-2
A launch countdown page that converts itself on launch day
Waitlist 3
waitlist-3
A working referral waitlist with a counting position, real share links, a settling leaderboard and honest tier progress
Waitlist 4
waitlist-4
A segmented partner-code gate with per-segment local validation, a reserved rejection shake and a request-access fallback
Widget 1
widget-1
Comprehensive analytics dashboard with product sales and volume metrics, featuring trend indicators and recent activity tracking
Widget 2
widget-2
A market-trends widget with a channel list and a per-item actions menu
Widget 3
widget-3
An active-task widget with assignee avatars, stage labels and progress per task
Widget 4
widget-4
A top-performers widget listing companies with sector labels and change figures
Widget 5
widget-5
Social media channels overview widget with progress bars, metrics display, and interactive area chart showing engagement trends
Widget 6
widget-6
Side-by-side product comparison widget displaying top products by sales and volume with percentage changes, icons, and metrics
Widget 7
widget-7
Token consumption against quota with a trend line, per-model breakdown and estimated cost
Select a component to view its code
Click on any item in the sidebar to get started
Select a component to view its information
App 1 - Dashboard
app-1
Simple dashboard layout with sidebar navigation and stats
App 2 - Task Board
app-2
Kanban-style task board with drag-and-drop functionality
App 3 - Messages
app-3
Conversation list, grouped message thread, disciplined autoscroll, typing state, and responsive composer
App 4 - File Manager
app-4
Grid and list file manager with shared selection, bulk actions, search, and preview sheet
App 5 - Issue Tracker
app-5
Grouped keyboard-first issue list with inline status editing, selection, and detail sheet
App 6 - Settings
app-6
A settings suite with account, notification-matrix and team panels that keep unsaved work across tabs
App 7 - Patient Intake
app-7
A persisted, branching patient-intake wizard with repeatable medication and allergy records
App 8 - Team Invites
app-8
A care-team invitation flow with paste-many email chips and permission previews
App 9 - Billing Statement
app-9
A print-ready medical statement with encounter lines, payer adjustments and a superbill variant
App Shell 1
app-shell-1
Responsive sidebar, breadcrumb header, workspace navigation, and calm application content frame
App Shell 2
app-shell-2
Collapsible icon rail with persistent state, accessible tooltips, mobile sheet, and reflowing content
App Shell 3
app-shell-3
Two-level top navigation with workspace context, scrollable sub-navigation, and centered content
App Shell 4
app-shell-4
Multi-tenant workspace shell with switcher, persisted nested navigation, breadcrumb context, and command seam
App Shell 5
app-shell-5
Resizable list, detail, and inspector panes with keyboard selection and a designed mobile stack
Banner 1
banner-1
A dismissible announcement bar that remembers the choice
Banner 2
banner-2
A promo banner with a live countdown and copyable discount code
Banner 3
banner-3
A cookie consent bar with a granular preferences dialog
Banner 4
banner-4
A delayed, scroll-gated floating announcement card with a shadow-bloom spring entrance and a data-switched avatar-pill variant
Banner 5
banner-5
A token-only site alert system — sticky strip, page banners and inline banners — matching notification-5\'s severity map
Bento Grid 1
bento-grid-1
A destination bento with a filter row and a top-rated tile
Bento Grid 10
bento-grid-10
A bento where every card holds a piece of the product and the pointer finishes the sentence: a note lands on a frame, a version stack fans out, a grade wipes, a link copies, an approval stamps
Bento Grid 11
bento-grid-11
A current-account bento where every tile works: a metal card that tilts and catches the light, a balance that counts itself in, two ledger lanes that pause under the pointer, a transfer that really runs its four steps, and a freeze switch that goes and frosts the card
Bento Grid 12
bento-grid-12
A ticketing bento for one night in a 198-seat room: a seating plan that fills seat by seat as the sale runs, orders pushing into a live feed, a split-flap board turning over the tour dates, a grained gig poster with light crossing it, and the first four minutes of the on-sale replayed as a histogram
Bento Grid 2
bento-grid-2
A comprehensive dashboard component showcase featuring deployment analytics, team activity, performance metrics, and integrations - perfect for SaaS applications
Bento Grid 3
bento-grid-3
A professional bento grid highlighting services, client testimonials, and business achievements
Bento Grid 4
bento-grid-4
A six-column travel bento pairing one large destination tile with smaller ones
Bento Grid 5
bento-grid-5
A centre-weighted bento for an AI product, built around one WebGL body of warped noise that churns and turns toward the pointer
Bento Grid 6
bento-grid-6
A left-heavy bento for a developer platform, driven by one token-bucket simulation that feeds a rolling rate-limit graph and a live throughput counter in a separate tile
Bento Grid 7
bento-grid-7
A retail bento built around a full-width collection rail you can throw, with real momentum on a native scroller so keyboard, touch and zoom all keep working
Bento Grid 8
bento-grid-8
An analytics bento whose only motion is other people: live cursors walking hand-placed routes across one overlay spanning the whole board, with the data left still
Bento Grid 9
bento-grid-9
A careers bento built around a full-height wall of faces tipped in 3D and scrolling on three unsynchronised columns, with published salary bands and a timed hiring process beside it
Blog Section 1
blog-section-1
A clean three-card layout with image placeholders, categories, titles and call-to-action links
Blog Section 2
blog-section-2
A grid of recent blog posts with images, titles, authors, and tags
Blog Section 3
blog-section-3
A horizontal scrollable stories grid with gradient borders and avatars
Blog Section 4
blog-section-4
A responsive grid layout featuring news cards with images, titles, and metadata
Calendar 1
calendar-1
A month calendar application with a sidebar, filterable calendars and a day detail sheet
Calendar 2
calendar-2
A week time grid with positioned events and a mobile agenda fallback
Calendar 3
calendar-3
A studio class booking flow with timezone-aware slots, waitlist and a directional date-change transition
Calendar 4
calendar-4
A rooms-by-hour resource timeline with overlap lane-splitting, a real now-line and a designed mobile layout
Calendar 5
calendar-5
A grouped agenda list with a derived attendance streak strip, composed filters and sticky day headers
Calendar 6
calendar-6
A front-desk studio switcher that swaps the day\'s class list, with live capacity badges and a working join-waitlist action
Calendar 7
calendar-7
A four-question studio intake that assembles a computed recommended week
Calendar 8
calendar-8
A plain month grid with a selected-day list — no shell, no filters, no dialogs
Category Filter 1
category-filter-1
A horizontal filter bar with dropdowns and active filter display
Category Filter 2
category-filter-2
A sidebar filter with expandable categories and subcategories
Category Filter 3
category-filter-3
A comprehensive filter sidebar with toggle-based selection and real-time results
Category Filter 4
category-filter-4
A mobile-first filter drawer with a live, settling result count and applied-filter chips that stay visible after it closes
Category Filter 5
category-filter-5
A faceted search with correct exclude-own-facet counting, options that disable in place at zero, and a computed, recoverable no-results suggestion
Changelog 1
changelog-1
An editorial release timeline with version anchors and copyable links
Changelog 2
changelog-2
A dense changelog with type filters, month grouping and expandable rows
Changelog 3
changelog-3
Scroll-stacked releases that hand over one at a time, each pairing its version panel with what changed and why
Changelog 4
changelog-4
A plain release list with a date rail and every line tagged added, improved or fixed
Chart 1
chart-1
Clean and simple bar and line chart displaying monthly sales volume and conversion rate trends with dual y-axis visualization
Chart 2
chart-2
Modern combined bar and line chart showing revenue performance vs targets with growth percentage trends, featuring interactive time period filters and comprehensive metrics dashboard
Chart 3
chart-3
Comprehensive analytics dashboard chart with product sales and volume metrics, featuring trend indicators and recent activity tracking
Chart 4
chart-4
Interactive financial dashboard with tabbed navigation showing Income (area chart), Expenses (radial chart), and Profit (bar chart) with real-time metrics
Chart 5
chart-5
Time-based earnings dashboard with interactive time period tabs (1d, 5d, 1m, 6m, 1y) and area chart visualization with recent activity tracking
Chart 6
chart-6
Radial progress chart dashboard showcasing company performance metrics with department breakdown and visitor statistics
Checkout Form 1
checkout-form-1
A clean and straightforward checkout form with essential fields
Checkout Form 2
checkout-form-2
A comprehensive single-page checkout with order summary and secure payment
Checkout Form 3
checkout-form-3
A guided multi-step checkout process with progress indicator and validation
Checkout Form 4
checkout-form-4
A checkout form with collections of presets
Checkout Form 5
checkout-form-5
An order confirmation page with a fulfilment timeline, line items and totals
Checkout Form 6
checkout-form-6
A checkout with an async address combobox, delivery tags, a date range picker, phone with OTP verification and currency-formatted totals
Comparison 1
comparison-1
An us-versus-alternatives table that becomes cards on mobile
Comparison 2
comparison-2
A plan feature matrix whose lit column follows the pointer, with a billing switch, sticky plan headers and a mobile plan picker
Comparison 3
comparison-3
An in-app change-plan screen: drawn tier marks, offer captions and struck list prices on cards above a feature matrix that upgrades and downgrades for real
Contact Form 1
contact-section-1
Clean and minimal contact form with essential fields
Contact Form 2
contact-section-2
Contact form alongside company information cards
Contact Form 3
contact-section-3
Contact form with location map and office details
Contact Form 4
contact-section-4
Two-column layout with form and contact details
Contact Form 5
contact-section-5
Contact section with frequently asked questions
Contact Form 6
contact-section-6
Contact form with team member cards and social links
CTA Section 1
cta-section-1
A single-line call to action with a live badge and two actions
CTA Section 10
cta-section-10
Clean and elegant CTA perfect for any business website
CTA Section 11
cta-section-11
Enterprise CTA with an animated perspective grid floor and mono display headline
CTA Section 12
cta-section-12
Payments infrastructure CTA with an animated routing grid, dual actions and a metric row
CTA Section 13
cta-section-13
Global expansion CTA with a configurable WebGL wave field and inline email capture
CTA Section 2
cta-section-2
A community subscribe card with an inline email field and avatar proof
CTA Section 3
cta-section-3
A split call to action with documentation and tutorial links beside the primary button
CTA Section 4
cta-section-4
A centred call to action with two buttons and no-credit-card reassurance
CTA Section 5
cta-section-5
Modern enterprise CTA with feature showcase cards
CTA Section 6
cta-section-6
Engaging newsletter signup with perks showcase and social proof elements
CTA Section 7
cta-section-7
High-impact productivity CTA with gradient buttons and trust indicators
CTA Section 8
cta-section-8
Interactive team showcase with hover effects and gradient text elements
CTA Section 9
cta-section-9
Split layout CTA with organized resource links and image hover animations
Datatable 1
datatable-1
Comprehensive user management table with search, filters, pagination, and action dropdowns. Includes user avatars, roles, login status, and two-factor authentication badges
Datatable 2
datatable-2
Advanced user records table with statistics cards, role icons, plan details, and status management. Features filter dropdowns, bulk actions, and comprehensive pagination
Datatable 3
datatable-3
Product inventory management table with images, SKU tracking, quantity badges, star ratings, and status indicators. Includes stock alerts and product actions
Datatable 4
datatable-4
Modern orders datatable with analytics cards, command palette (⌘K), tabs navigation, bulk actions, column visibility control, and real-time order tracking. Features multi-filter system, sortable columns, payment methods, priority levels, and comprehensive status workflow management.
Datatable 5
datatable-5
URL-synced server-state table with saved views, async states, faceted filters, and record details
Error Page 1
error-page-1
A centred 404 page with an illustration, a home link and a contact action
Error Page 2
error-page-2
A split 404 page with the brand mark, an illustration and a single home action
Error Page 3
error-page-3
Interactive 404 page with search and help options
Error Page 4
error-page-4
Maintenance page with countdown and progress tracking
FAQ Block 1
faq-block-1
A bordered single-column accordion with multiple items openable at once
FAQ Block 2
faq-block-2
A single-open accordion with an underline trigger style and a two-paragraph intro
FAQ Block 3
faq-block-3
A borderless, two-column accordion layout for a longer question set
FAQ Block 4
faq-block-4
A card-style accordion with a search field affordance, for the functional search variant see faq-block-5
FAQ Block 5
faq-block-5
A functional FAQ search that highlights matches inside answers, composes with categories and emits FAQPage schema
Feature 1
feature-1
A four-up feature grid of icon cards under a badge heading, closing on a call to action
Feature 10
feature-10
A mixed-width feature board pairing metric cards with data-table and dashboard previews
Feature 11
feature-11
Scroll-pinned feature reel that dissolves one photograph into the next beside a numbered step rail
Feature 12
feature-12
Scroll-stacked benefit cards that pin in turn, each pairing a live mini interface with a proof checklist
Feature 2
feature-2
A two-column feature list paired with an image and no card chrome
Feature 3
feature-3
A dual-image feature layout with four benefit rows beside the photography
Feature 4
feature-4
Feature section with 2x3 grid layout and clean card design
Feature 5
feature-5
A three-card feature section on a dot-pattern surface
Feature 6
feature-6
Card-based feature section with decorative grid backgrounds
Feature 7
feature-7
Feature section with dual image showcase and feature grid
Feature 8
feature-8
A split feature section pairing four capability rows with a dashboard image and two actions
Feature 9
feature-9
A six-item feature grid arranged over two images without cards
Footer Section 1
footer-section-1
A footer with an inline email capture beside three columns of links
Footer Section 2
footer-section-2
A half-image footer carrying a postal address, phone and email beside the link columns
Footer Section 3
footer-section-3
A six-column footer that leads with the newsletter form and follows with four link columns
Footer Section 4
footer-section-4
A five-column footer with quick links, resources, legal and a get-in-touch column
Footer Section 5
footer-section-5
A footer on a soft gradient with an address block, contact lines and a stay-updated form
Footer Section 6
footer-section-6
A minimal two-row footer with top navigation, a language menu and city links
Footer Section 7
footer-section-7
A three-column footer pairing contact details and link groups with a subscribe form
Forgot Password Page 1
forgot-password-page-1
A four-step reset covering email, one-time code, new password and confirmation
Forgot Password Page 2
forgot-password-page-2
Simple password reset form with email confirmation
Forgot Password Page 3
forgot-password-page-3
Multi-step password reset with verification code
Forgot Password Page 4
forgot-password-page-4
A four-step reset with labelled fields and a resend-code action
Forgot Password Page 5
forgot-password-page-5
A modern two-column forgot password page with illustration
Forgot Password Page 6
forgot-password-page-6
A split-screen reset across the email, code, new password and success states
Hero Section 1
hero-section-1
A split hero with a badge, an avatar group and a trusted-by line under the call to action
Hero Section 10
hero-section-10
A fitness app hero on a full-bleed running photo printed as a halftone, with a pointer-led reveal lens
Hero Section 11
hero-section-11
A showcase hero whose three rows of work drift in alternating directions on a tilted plane that straightens as you scroll
Hero Section 12
hero-section-12
A product-launch hero under a drifting WebGL aurora, with a browser-framed screenshot and a stat row
Hero Section 13
hero-section-13
A split hero on a node web that links itself and leans toward the cursor, beside a live signal console
Hero Section 14
hero-section-14
A waitlist hero lit by counter-rotating beams, with a sheened headline, inline email capture and a wordmark marquee
Hero Section 2
hero-section-2
A split hero built around a fixed-ratio media card for a product image or video
Hero Section 3
hero-section-3
A centred hero with a dashboard preview above a logo row of named customers
Hero Section 4
hero-section-4
A hero that carries four headline metrics as cards directly under the call to action
Hero Section 5
hero-section-5
A hero with its own navigation bar, avatar proof and a full-bleed destination image
Hero Section 6
hero-section-6
A search-led hero with tabs and location, type and price-range selects over an image grid
Hero Section 7
hero-section-7
An AI product hero with a token-derived gradient and a looping chat demo
Hero Section 8
hero-section-8
An editorial property hero whose photograph grades from midday to dusk across a draggable seam
Hero Section 9
hero-section-9
A centred hero in an inset panel, with the stages of an authorisation fanned in 3D and dragged by hand
Listing 1
listing-1
A three-up service listing with category badges and a get-started action
Listing 2
listing-2
A category listing that scrolls horizontally through destination cards
Listing 3
listing-3
A two-column course listing with instructor avatars and category labels
Listing 4
listing-4
A three-up course listing with a category badge on each card
Listing 5
listing-5
A property listing with bed, bath and area counts and a view-details action
Listing 6
listing-6
A category carousel with a progress indicator across twelve subject cards
Login Page 1
login-page-1
A card login with remember-me, a forgot-password link and three social buttons
Login Page 2
login-page-2
Clean and simple login form with social authentication
Login Page 3
login-page-3
Split-screen login with background image and enhanced UX
Login Page 4
login-page-4
A labelled card login with social buttons placed above the email and password fields
Login Page 5
login-page-5
A modern two-column login page with illustration
Login Page 6
login-page-6
A split-screen login with the card on one side and a product panel on the other
Logo Cloud 1
logo-cloud-1
Showcases ShadcnStore compatibility with popular technologies and development frameworks
Logo Cloud 2
logo-cloud-2
Customer testimonials and success metrics highlighting ShadcnStore component benefits
Logo Cloud 3
logo-cloud-3
Professional showcase featuring industry leaders who use ShadcnStore components
Logo Cloud 4
logo-cloud-4
Enterprise-focused showcase highlighting ShadcnStore components for large-scale applications
Logo Cloud 5
logo-cloud-5
Community-focused showcase featuring ShadcnStore partner companies and ecosystem growth
Navbar 1
navbar-1
A clean marketing navbar with a sheet menu on mobile
Navbar 2
navbar-2
A mega-menu navbar with grouped flyouts and a featured card
Navbar 3
navbar-3
A scroll-aware navbar that condenses into a floating pill
Navbar 4
navbar-4
A storefront navbar with live search, avatar account menu, animated cart badge, and a product grid demo
Navbar 5
navbar-5
A documentation-site header with a collapsing secondary row, breadcrumb promotion, ⌘K search and version switching
Order History 1
order-history-1
An order table with item thumbnails, dates, quantity, price and an invoice download
Order History 2
order-history-2
An order list grouped by status, with tracking and details actions per order
Order History 3
order-history-3
A tabbed order history with a date-range filter, invoices, reorder and review actions
Order History 4
order-history-4
A detailed table view for managing orders with sorting and pagination
Order History 5
order-history-5
A single-order detail page with a fulfillment timeline, per-shipment items, address and payment summary, and returns, reorder and invoice actions
Pricing Section 1
pricing-section-1
A three-tier pricing grid with a popular badge and a feature list per plan
Pricing Section 2
pricing-section-2
A three-tier pricing grid with a raised middle plan and per-plan feature lists
Pricing Section 3
pricing-section-3
A three-tier pricing grid with a monthly and annual billing switch
Pricing Section 4
pricing-section-4
A clean and modern pricing section with a focus on features and benefits
Pricing Section 5
pricing-section-5
Two-tier pricing layout with Personal vs Team plans and comprehensive features grid
Pricing Section 6
pricing-section-6
Comprehensive 4-tier pricing with Free, Personal, Teams, and Enterprise plans
Pricing Section 7
pricing-section-7
A usage-based pricing calculator with live totals and volume tiers
Pricing Section 8
pricing-section-8
Scroll-stacked plans that hand over one at a time, each pairing its price panel with who it is for and what it does not do
Product Listing Card 1
product-card-1
A deals grid of product cards with an add-to-cart action on each
Product Listing Card 2
product-card-2
A three-up product grid carrying image, name and price only
Product Listing Card 3
product-card-3
A product grid with low-stock badges and a view-similar action
Product Listing Card 4
product-card-4
A product carousel and grid combination across twelve items
Product Listing Card 5
product-card-5
Table-style product listing with comparison and sorting features
Product Category Card 1
product-category-1
A four-up category grid of subjects with a view-all action
Product Category Card 2
product-category-2
Image-based category cards with overlay text and trending badges
Product Category Card 3
product-category-3
A seven-column category strip of small image tiles
Product Category Card 4
product-category-4
A category grid with icon avatars and item-count badges
Product Category Card 5
product-category-5
Detailed category list with icons, subcategories, and search functionality
Product Category Card 6
product-category-6
A curated category layout with status badges such as trending and featured
Product Category Card 7
product-category-7
A three-up category grid badged for new arrivals, best sellers and sale
Product Overview 1
product-overview-1
A product page with an image carousel, a size grid and colour swatches
Product Overview 2
product-overview-2
A product page with a thumbnail carousel, a size guide link and a delivery threshold
Product Overview 3
product-overview-3
A furniture product page with colour options, delivery choice, lead-time note and recently viewed
Product Overview 4
product-overview-4
A product page with financing, a quantity select, a postcode delivery check and returns detail
Product Overview 5
product-overview-5
A product page with tabbed overview and specifications plus a gallery dialog
Product Overview 6
product-overview-6
A quick view dialog with an image gallery, variant selection and add to cart
Product Overview 7
product-overview-7
A product story whose pinned panel swaps to the section being read, with buy controls above the argument for them
Product Review & Ratings 1
review-rating-1
A paginated review list with reactions and a write-a-review form
Product Review & Ratings 2
review-rating-2
A rating summary with a per-star distribution above a review carousel
Product Review & Ratings 3
review-rating-3
A review list with a rating filter, distribution bars and pagination
Product Review & Ratings 4
review-rating-4
A review section with per-category ratings, sort controls and a load-more action
Product Review & Ratings 5
review-rating-5
Simple review list with rating distribution and helpful voting
Roadmap 1
roadmap-1
A three-column Now, Next and Later board that publishes order rather than dates
Shopping Cart 1
shopping-cart-1
A more detailed cart summary with multiple items and discounts
Shopping Cart 2
shopping-cart-2
A clean and modern cart with promo codes and shipping info
Shopping Cart 3
shopping-cart-3
A simple cart summary with item list and total
Shopping Cart 4
shopping-cart-4
A collapsible cart sidebar with progress tracking and quick checkout
Shopping Cart 5
shopping-cart-5
A cart and wishlist combo where moving an item between lists animates the row traveling, with stock warnings, price-drop badges and separate empty states
Signup Page 1
signup-page-1
A card signup with social options and terms and privacy links under the button
Signup Page 2
signup-page-2
Multi-step signup form with progress tracking
Signup Page 3
signup-page-3
Simple signup form with social authentication options
Signup Page 4
signup-page-4
A labelled card signup with a confirm-password field and social options
Signup Page 5
signup-page-5
A modern two-column signup page with illustration
Signup Page 6
signup-page-6
A split-screen signup with the card beside a product panel
Signup Page 7
signup-page-7
A multi-step signup wizard with blocking per-step validation and a review step
Statistic 1
statistic-1
Modern statistics grid with progress indicators and performance metrics
Statistic 2
statistic-2
Side-by-side layout showcasing company metrics and growth statistics
Statistic 3
statistic-3
Comprehensive platform statistics with trend indicators and progress bars
Statistic 4
statistic-4
A four-metric growth grid with year-over-year context and a closing call to action
Statistic 5
statistic-5
Comprehensive business dashboard with summary cards and detailed analytics
Statistic 6
statistic-6
Clean metrics grid displaying key performance indicators
Statistic 7
statistic-7
An analytics board pairing sales by category and recent transactions with four summary figures
Statistic 8
statistic-8
A sales analytics section with a monthly revenue table, top customers and performance figures
Storefront Hero Section 1
storefront-hero-1
A storefront hero pairing a collection banner with buyable product cards
Storefront Hero Section 10
storefront-hero-10
An interiors hero with an oversized headline the product photo sits on, cursor-parallax price and spec cards, and a press marquee
Storefront Hero Section 11
storefront-hero-11
A sneaker drop hero laid out as a centred poster, with a pointer-scattered particle field, a live countdown and colourway thumbnails that recolour the whole frame
Storefront Hero Section 12
storefront-hero-12
An editorial skincare hero: a full-width headline over three columns, with a numbered routine list and a product stage lit by WebGL caustics
Storefront Hero Section 13
storefront-hero-13
A bento storefront hero whose tiles are crossed by one travelling light, with a featured product alongside dispatch, returns and rating facts
Storefront Hero Section 2
storefront-hero-2
A storefront hero with a search field and a trending product carousel
Storefront Hero Section 3
storefront-hero-3
A storefront hero with a full header, search suggestions and a help panel
Storefront Hero Section 4
storefront-hero-4
A storefront hero under a promo bar, with language, location and category menus
Storefront Hero Section 5
storefront-hero-5
Elegant hero section with category navigation and featured deals
Storefront Hero Section 6
storefront-hero-6
Clean layout highlighting featured products with hover effects
Storefront Hero Section 7
storefront-hero-7
Premium hero section with winter theme and featured products
Storefront Hero Section 8
storefront-hero-8
Modern tech store hero with featured products and countdown timer
Storefront Hero Section 9
storefront-hero-9
An editorial fashion hero whose photograph ripples like cloth under the pointer, with a look picker that cross-fades the shot
Team Profile 1
team-1
An agent grid whose cards carry listing counts, languages and a profile link
Team Profile 2
team-2
A four-up agent grid with listed-property counts under each portrait
Team Profile 3
team-3
A twelve-column team carousel with avatars, roles and a view-all action
Team Profile 4
team-4
A four-up team grid carrying a portrait, a name and a role and nothing more
Team Profile 5
team-5
An instructor grid whose cards pair the avatar with course and student counts
Team Profile 6
team-6
A four-up profile grid with full-bleed portraits and role captions
Team Profile 7
team-7
A three-up agent grid with call and email actions on every card
Team Profile 8
team-8
A four-up corporate team grid with a role badge on each portrait
Team Profile 9
team-9
An executive team layout pairing portraits with location, experience and project counts
Testimonial 1
testimonial-1
A quote carousel with an avatar, a role and a short headline per review
Testimonial 10
testimonial-10
Draggable proof board of real tweets, Slack messages, emails and reviews, each keeping its own chrome
Testimonial 2
testimonial-2
A hero testimonial layout with featured testimonial and supporting cards
Testimonial 3
testimonial-3
A grid-based testimonial wall showcasing customer feedback
Testimonial 4
testimonial-4
A two-column testimonial carousel with a photograph and a dialog for the full quote
Testimonial 5
testimonial-5
A three-column testimonial carousel above satisfaction, rating and uptime figures
Testimonial 6
testimonial-6
A twelve-column testimonial mosaic built from mixed-width quote cards
Testimonial 7
testimonial-7
A student testimonial carousel carrying an avatar, a role and a rating per card
Testimonial 8
testimonial-8
A borderless testimonial wall under a badge heading, with a load-more action
Testimonial 9
testimonial-9
A testimonial carousel sized for course and training pages, with arrows and avatars
Timeline 1
timeline-1
A public Now/Next/Later roadmap board with vote chips
Verify 1
verify-1
Two-factor code entry with resend cooldown, backup codes and lockout
Verify 2
verify-2
Email verification covering check-inbox, verified and expired states
Verify 3
verify-3
Passkey sign-in with a biometric ring, magic-link fallback and an unsupported-browser layout
Verify 4
verify-4
Patient SMS verification end to end: country entry, a draining cooldown ring, voice fallback and lockout
Verify 5
verify-5
Insurance card capture with an extraction reveal, confidence flags, eligibility results and actionable rejections
Verify 6
verify-6
Split-screen identity check: code entry beside the booking it protects, with a guest testimonial
Waitlist 1
waitlist-1
A single-screen waitlist page that returns a position in line
Waitlist 2
waitlist-2
A launch countdown page that converts itself on launch day
Waitlist 3
waitlist-3
A working referral waitlist with a counting position, real share links, a settling leaderboard and honest tier progress
Waitlist 4
waitlist-4
A segmented partner-code gate with per-segment local validation, a reserved rejection shake and a request-access fallback
Widget 1
widget-1
Comprehensive analytics dashboard with product sales and volume metrics, featuring trend indicators and recent activity tracking
Widget 2
widget-2
A market-trends widget with a channel list and a per-item actions menu
Widget 3
widget-3
An active-task widget with assignee avatars, stage labels and progress per task
Widget 4
widget-4
A top-performers widget listing companies with sector labels and change figures
Widget 5
widget-5
Social media channels overview widget with progress bars, metrics display, and interactive area chart showing engagement trends
Widget 6
widget-6
Side-by-side product comparison widget displaying top products by sales and volume with percentage changes, icons, and metrics
Widget 7
widget-7
Token consumption against quota with a trend line, per-model breakdown and estimated cost
Select a component to view its code
Click on any item in the sidebar to get started
Select a component to view its information