@bundui
A curated collection of 200+ handcrafted UI components and blocks built with Tailwind CSS, Motion (Framer Motion), and shadcn/ui. Categories span marketing (hero sections, navbars, newsletters, bento grids, pricing), e-commerce (shopping carts, checkout forms), real-estate property listings, dashboard UI, base components, text effects, animated/motion components, and decorative backgrounds. Free and MIT-licensed. Use for: enriching a shadcn project with animated marketing, e-commerce, and dashboard blocks in a single registry.
Install this registry
npx shadcn@latest add https://bundui.io/r/registry.json pnpm dlx shadcn@latest add https://bundui.io/r/registry.json bunx shadcn@latest add https://bundui.io/r/registry.json curl -s https://bundui.io/r/registry.json Components
217 totalA vertically stacked set of interactive headings that each reveal a section of content.
npx shadcn@latest add https://bundui.io/r/accordion-default.json A vertically stacked set of interactive headings that each reveal a section of content.
npx shadcn@latest add https://bundui.io/r/accordion-collapsible.json A vertically stacked set of interactive headings that each reveal a section of content.
npx shadcn@latest add https://bundui.io/r/accordion-with-plus-icon.json Displays a callout for user attention.
npx shadcn@latest add https://bundui.io/r/alert-default.json Displays a callout for user attention.
npx shadcn@latest add https://bundui.io/r/alert-with-icon.json Displays a callout for user attention.
npx shadcn@latest add https://bundui.io/r/alert-with-title.json Displays a callout for user attention.
npx shadcn@latest add https://bundui.io/r/alert-with-action-button.json Displays a callout for user attention.
npx shadcn@latest add https://bundui.io/r/alert-with-dismiss.json Displays a callout for user attention.
npx shadcn@latest add https://bundui.io/r/alert-success.json Displays a callout for user attention.
npx shadcn@latest add https://bundui.io/r/alert-warning.json Displays a callout for user attention.
npx shadcn@latest add https://bundui.io/r/alert-danger.json A modal dialog that interrupts the user with important content and expects a response.
npx shadcn@latest add https://bundui.io/r/alert-dialog.json An image element with fallbacks for representing the user.
npx shadcn@latest add https://bundui.io/r/avatar-default.json An image element with fallbacks for representing the user.
npx shadcn@latest add https://bundui.io/r/avatar-fallback-only.json An image element with fallbacks for representing the user.
npx shadcn@latest add https://bundui.io/r/avatar-with-status-indicator.json An image element with fallbacks for representing the user.
npx shadcn@latest add https://bundui.io/r/avatar-avatar-group.json An image element with fallbacks for representing the user.
npx shadcn@latest add https://bundui.io/r/avatar-sizes.json Displays a badge or status indicator.
npx shadcn@latest add https://bundui.io/r/badge-default.json Displays a badge or status indicator.
npx shadcn@latest add https://bundui.io/r/badge-secondary.json Displays a badge or status indicator.
npx shadcn@latest add https://bundui.io/r/badge-destructive.json Displays a badge or status indicator.
npx shadcn@latest add https://bundui.io/r/badge-outline.json Displays a badge or status indicator.
npx shadcn@latest add https://bundui.io/r/badge-indicator.json Displays a badge or status indicator.
npx shadcn@latest add https://bundui.io/r/badge-with-icon.json Displays a badge or status indicator.
npx shadcn@latest add https://bundui.io/r/badge-with-dismiss.json Displays a breadcrumb navigation.
npx shadcn@latest add https://bundui.io/r/breadcrumb-default.json Displays a breadcrumb navigation.
npx shadcn@latest add https://bundui.io/r/breadcrumb-with-icon.json Displays a breadcrumb navigation.
npx shadcn@latest add https://bundui.io/r/breadcrumb-with-dropdown.json Displays a button or a component that looks like a button.
npx shadcn@latest add https://bundui.io/r/button-default.json Displays a button or a component that looks like a button.
npx shadcn@latest add https://bundui.io/r/button-secondary.json Displays a button or a component that looks like a button.
npx shadcn@latest add https://bundui.io/r/button-destructive.json Displays a button or a component that looks like a button.
npx shadcn@latest add https://bundui.io/r/button-outline.json Displays a button or a component that looks like a button.
npx shadcn@latest add https://bundui.io/r/button-ghost.json Displays a button or a component that looks like a button.
npx shadcn@latest add https://bundui.io/r/button-link.json Displays a button or a component that looks like a button.
npx shadcn@latest add https://bundui.io/r/button-with-icon.json Displays a button or a component that looks like a button.
npx shadcn@latest add https://bundui.io/r/button-only-icon.json Displays a button or a component that looks like a button.
npx shadcn@latest add https://bundui.io/r/button-icon-sizes.json Displays a button or a component that looks like a button.
npx shadcn@latest add https://bundui.io/r/button-sizes.json Displays a button or a component that looks like a button.
npx shadcn@latest add https://bundui.io/r/button-disabled.json Displays a button or a component that looks like a button.
npx shadcn@latest add https://bundui.io/r/button-loading.json Displays a button or a component that looks like a button.
npx shadcn@latest add https://bundui.io/r/button-loading-with-icon.json A date picker component with range and single date selection.
npx shadcn@latest add https://bundui.io/r/calendar.json Displays a card with header, content, and footer.
npx shadcn@latest add https://bundui.io/r/card-default.json Displays a card with header, content, and footer.
npx shadcn@latest add https://bundui.io/r/card-with-header.json Displays a card with header, content, and footer.
npx shadcn@latest add https://bundui.io/r/card-with-header-description.json Displays a card with header, content, and footer.
npx shadcn@latest add https://bundui.io/r/card-with-header-icon.json Displays a card with header, content, and footer.
npx shadcn@latest add https://bundui.io/r/card-with-action.json Displays a card with header, content, and footer.
npx shadcn@latest add https://bundui.io/r/card-with-footer.json Displays a card with header, content, and footer.
npx shadcn@latest add https://bundui.io/r/card-colored.json A carousel component for cycling through a series of content.
npx shadcn@latest add https://bundui.io/r/carousel-01.json A carousel component for cycling through a series of content.
npx shadcn@latest add https://bundui.io/r/carousel-02.json A carousel component for cycling through a series of content.
npx shadcn@latest add https://bundui.io/r/carousel-03.json Beautiful charts. Built using Recharts. Copy and paste into your apps.
npx shadcn@latest add https://bundui.io/r/chart.json A control that allows the user to toggle between checked and not checked.
npx shadcn@latest add https://bundui.io/r/checkbox.json Used to hide and show content with a smooth animation.
npx shadcn@latest add https://bundui.io/r/collapsible.json Combines a text input with a list of options.
npx shadcn@latest add https://bundui.io/r/combobox.json Fast, composable command palette component.
npx shadcn@latest add https://bundui.io/r/command.json Displays a menu to the user — triggered by a right click.
npx shadcn@latest add https://bundui.io/r/context-menu.json Display complex data in a table format with filtering, sorting and pagination.
npx shadcn@latest add https://bundui.io/r/data-table-01.json Display complex data in a table format with filtering, sorting and pagination.
npx shadcn@latest add https://bundui.io/r/data-table-02.json Display complex data in a table format with filtering, sorting and pagination.
npx shadcn@latest add https://bundui.io/r/data-table-03.json A styled date picker component built using calendar.
npx shadcn@latest add https://bundui.io/r/date-picker.json A window overlaid on either the primary window or another dialog window.
npx shadcn@latest add https://bundui.io/r/dialog.json A window overlaid on either the primary window or another dialog window.
npx shadcn@latest add https://bundui.io/r/divider-01.json A window overlaid on either the primary window or another dialog window.
npx shadcn@latest add https://bundui.io/r/divider-02.json A window overlaid on either the primary window or another dialog window.
npx shadcn@latest add https://bundui.io/r/divider-03.json A panel that slides out from the edge of the screen.
npx shadcn@latest add https://bundui.io/r/drawer.json Displays a menu to the user — triggered by a button.
npx shadcn@latest add https://bundui.io/r/dropdown-menu.json For sighted users to preview content available behind a link.
npx shadcn@latest add https://bundui.io/r/hover-card.json Displays a form input field or a component that looks like an input field.
npx shadcn@latest add https://bundui.io/r/input.json Accessible one-time password component with copy paste functionality.
npx shadcn@latest add https://bundui.io/r/input-otp.json Displays a menu bar with nested menus.
npx shadcn@latest add https://bundui.io/r/menubar.json A set of layered menu items—triggered by hover or click.
npx shadcn@latest add https://bundui.io/r/navigation-menu.json Pagination with page navigation, next and previous links.
npx shadcn@latest add https://bundui.io/r/pagination.json A pop-up element that appears next to a trigger element.
npx shadcn@latest add https://bundui.io/r/popover.json Displays an indicator showing the completion progress of a task.
npx shadcn@latest add https://bundui.io/r/progress.json A set of checkable buttons—only one can be selected at a time.
npx shadcn@latest add https://bundui.io/r/radio-group.json Displays a list of options for the user to pick from—triggered by a button.
npx shadcn@latest add https://bundui.io/r/select-01.json Displays a list of options for the user to pick from—triggered by a button.
npx shadcn@latest add https://bundui.io/r/select-02.json Displays a list of options for the user to pick from—triggered by a button.
npx shadcn@latest add https://bundui.io/r/select-03.json Displays a list of options for the user to pick from—triggered by a button.
npx shadcn@latest add https://bundui.io/r/select-04.json Displays a list of options for the user to pick from—triggered by a button.
npx shadcn@latest add https://bundui.io/r/select-05.json Extends the Dialog component to create panels that slide in from the edge of the screen.
npx shadcn@latest add https://bundui.io/r/sheet.json A composable, themeable and customizable sidebar component.
npx shadcn@latest add https://bundui.io/r/sidebar.json Displays a placeholder preview of your content before it loads.
npx shadcn@latest add https://bundui.io/r/skeleton.json An input where the user selects a value from within a given range.
npx shadcn@latest add https://bundui.io/r/slider.json A control that allows the user to toggle between checked and not checked.
npx shadcn@latest add https://bundui.io/r/switch.json A set of layered sections of content—known as tab panels—that are displayed one at a time.
npx shadcn@latest add https://bundui.io/r/tabs.json A set of two-state buttons that can be toggled on or off.
npx shadcn@latest add https://bundui.io/r/toggle-group.json A popup that displays information related to an element when hovered.
npx shadcn@latest add https://bundui.io/r/tooltip.json Explore beautifully crafted Tailwind CSS hero sections designed to deliver a powerful first impression with clarity and purpose. These layouts blend minimalist…
npx shadcn@latest add https://bundui.io/r/hero-sections-01.json Explore beautifully crafted Tailwind CSS hero sections designed to deliver a powerful first impression with clarity and purpose. These layouts blend minimalist…
npx shadcn@latest add https://bundui.io/r/hero-sections-02.json Explore beautifully crafted Tailwind CSS hero sections designed to deliver a powerful first impression with clarity and purpose. These layouts blend minimalist…
npx shadcn@latest add https://bundui.io/r/hero-sections-03.json Explore beautifully crafted Tailwind CSS hero sections designed to deliver a powerful first impression with clarity and purpose. These layouts blend minimalist…
npx shadcn@latest add https://bundui.io/r/hero-sections-04.json Explore beautifully crafted Tailwind CSS hero sections designed to deliver a powerful first impression with clarity and purpose. These layouts blend minimalist…
npx shadcn@latest add https://bundui.io/r/hero-sections-05.json Craft compelling Tailwind CSS CTA sections that guide users toward your key actions. These designs combine minimalist layouts, clear messaging, and prominent b…
npx shadcn@latest add https://bundui.io/r/cta-sections-01.json Craft compelling Tailwind CSS CTA sections that guide users toward your key actions. These designs combine minimalist layouts, clear messaging, and prominent b…
npx shadcn@latest add https://bundui.io/r/cta-sections-02.json Craft compelling Tailwind CSS CTA sections that guide users toward your key actions. These designs combine minimalist layouts, clear messaging, and prominent b…
npx shadcn@latest add https://bundui.io/r/cta-sections-03.json Craft compelling Tailwind CSS CTA sections that guide users toward your key actions. These designs combine minimalist layouts, clear messaging, and prominent b…
npx shadcn@latest add https://bundui.io/r/cta-sections-04.json Showcase your product or service plans with elegantly designed Tailwind CSS pricing sections. These layouts highlight features, pricing tiers, and value propos…
npx shadcn@latest add https://bundui.io/r/pricing-sections-01.json Showcase your product or service plans with elegantly designed Tailwind CSS pricing sections. These layouts highlight features, pricing tiers, and value propos…
npx shadcn@latest add https://bundui.io/r/pricing-sections-02.json Showcase your product or service plans with elegantly designed Tailwind CSS pricing sections. These layouts highlight features, pricing tiers, and value propos…
npx shadcn@latest add https://bundui.io/r/pricing-sections-03.json Engage and grow your audience with beautifully designed Tailwind CSS newsletter sections. These layouts combine clean forms, compelling copy, and subtle visual…
npx shadcn@latest add https://bundui.io/r/newsletter-sections.json Highlight customer experiences and build trust with elegantly designed Tailwind CSS testimonial sections. These layouts feature user quotes, ratings, and profi…
npx shadcn@latest add https://bundui.io/r/testimonials-01.json Highlight customer experiences and build trust with elegantly designed Tailwind CSS testimonial sections. These layouts feature user quotes, ratings, and profi…
npx shadcn@latest add https://bundui.io/r/testimonials-02.json Highlight customer experiences and build trust with elegantly designed Tailwind CSS testimonial sections. These layouts feature user quotes, ratings, and profi…
npx shadcn@latest add https://bundui.io/r/testimonials-03.json Showcase your articles and content in beautifully structured Tailwind CSS blog sections. These layouts combine clear headings, featured images, and engaging ex…
npx shadcn@latest add https://bundui.io/r/blog-sections-01.json Showcase your articles and content in beautifully structured Tailwind CSS blog sections. These layouts combine clear headings, featured images, and engaging ex…
npx shadcn@latest add https://bundui.io/r/blog-sections-02.json Showcase your team with elegantly designed Tailwind CSS team sections. Highlight member profiles, roles, and social links with clean layouts and subtle visuals…
npx shadcn@latest add https://bundui.io/r/team-sections-01.json Showcase your team with elegantly designed Tailwind CSS team sections. Highlight member profiles, roles, and social links with clean layouts and subtle visuals…
npx shadcn@latest add https://bundui.io/r/team-sections-02.json Highlight key metrics and performance figures with Tailwind CSS stats sections. These layouts showcase numbers, percentages, and visual indicators in a clean, …
npx shadcn@latest add https://bundui.io/r/stats-section-01.json Highlight key metrics and performance figures with Tailwind CSS stats sections. These layouts showcase numbers, percentages, and visual indicators in a clean, …
npx shadcn@latest add https://bundui.io/r/stats-section-02.json Showcase your product’s compatibility and connected services with Tailwind CSS integrations sections. These layouts feature logos, brief descriptions, and visu…
npx shadcn@latest add https://bundui.io/r/integrations.json Create polished, functional Tailwind CSS footer sections that organize links, contact info, and calls-to-action elegantly. These layouts provide clear navigati…
npx shadcn@latest add https://bundui.io/r/footers.json Highlight special offers, product launches, or key campaigns with Tailwind CSS promotional sections. These layouts combine bold visuals, concise messaging, and…
npx shadcn@latest add https://bundui.io/r/promotional-01.json Highlight special offers, product launches, or key campaigns with Tailwind CSS promotional sections. These layouts combine bold visuals, concise messaging, and…
npx shadcn@latest add https://bundui.io/r/promotional-02.json Showcase your product’s key features with elegantly designed Tailwind CSS feature sections. These layouts highlight benefits, functionalities, and unique selli…
npx shadcn@latest add https://bundui.io/r/feature-sections.json Facilitate communication with elegantly designed Tailwind CSS contact sections. These layouts combine clean forms, contact details, and subtle visuals to encou…
npx shadcn@latest add https://bundui.io/r/contact-sections.json Showcase your brand partnerships, clients, or featured companies with Tailwind CSS logo cloud sections. These layouts present logos in clean, organized, and vi…
npx shadcn@latest add https://bundui.io/r/logo-clouds-01.json Showcase your brand partnerships, clients, or featured companies with Tailwind CSS logo cloud sections. These layouts present logos in clean, organized, and vi…
npx shadcn@latest add https://bundui.io/r/logo-clouds-02.json Create clean, responsive navigation with Tailwind CSS navbar sections. These layouts provide intuitive menus, clear branding, and subtle interactions to guide …
npx shadcn@latest add https://bundui.io/r/navbars-01.json Create clean, responsive navigation with Tailwind CSS navbar sections. These layouts provide intuitive menus, clear branding, and subtle interactions to guide …
npx shadcn@latest add https://bundui.io/r/navbars-02.json Create clean, responsive navigation with Tailwind CSS navbar sections. These layouts provide intuitive menus, clear branding, and subtle interactions to guide …
npx shadcn@latest add https://bundui.io/r/navbars-03.json Create clean, responsive navigation with Tailwind CSS navbar sections. These layouts provide intuitive menus, clear branding, and subtle interactions to guide …
npx shadcn@latest add https://bundui.io/r/navbars-04.json Highlight promotions, announcements, or key messages with Tailwind CSS banner sections. These layouts combine bold visuals, concise copy, and strategic calls-t…
npx shadcn@latest add https://bundui.io/r/banners-01.json Highlight promotions, announcements, or key messages with Tailwind CSS banner sections. These layouts combine bold visuals, concise copy, and strategic calls-t…
npx shadcn@latest add https://bundui.io/r/banners-02.json Highlight promotions, announcements, or key messages with Tailwind CSS banner sections. These layouts combine bold visuals, concise copy, and strategic calls-t…
npx shadcn@latest add https://bundui.io/r/banners-03.json Ensure compliance and build trust with elegantly designed Tailwind CSS cookie consent sections. These layouts provide clear messaging, simple accept/reject opt…
npx shadcn@latest add https://bundui.io/r/cookie-consent-01.json Ensure compliance and build trust with elegantly designed Tailwind CSS cookie consent sections. These layouts provide clear messaging, simple accept/reject opt…
npx shadcn@latest add https://bundui.io/r/cookie-consent-02.json Ensure compliance and build trust with elegantly designed Tailwind CSS cookie consent sections. These layouts provide clear messaging, simple accept/reject opt…
npx shadcn@latest add https://bundui.io/r/cookie-consent-03.json Showcase detailed product information with Tailwind CSS e-commerce product detail sections. These layouts highlight images, descriptions, specifications, prici…
npx shadcn@latest add https://bundui.io/r/product-details.json Display products in clean and engaging Tailwind CSS product list sections. These layouts feature images, titles, prices, and brief descriptions, making browsin…
npx shadcn@latest add https://bundui.io/r/product-list-01.json Display products in clean and engaging Tailwind CSS product list sections. These layouts feature images, titles, prices, and brief descriptions, making browsin…
npx shadcn@latest add https://bundui.io/r/product-list-02.json Display products in clean and engaging Tailwind CSS product list sections. These layouts feature images, titles, prices, and brief descriptions, making browsin…
npx shadcn@latest add https://bundui.io/r/product-list-03.json Highlight product categories with visually engaging Tailwind CSS category preview sections. These layouts showcase images, titles, and brief descriptions to gu…
npx shadcn@latest add https://bundui.io/r/category-previews-01.json Highlight product categories with visually engaging Tailwind CSS category preview sections. These layouts showcase images, titles, and brief descriptions to gu…
npx shadcn@latest add https://bundui.io/r/category-previews-02.json Provide a seamless shopping experience with Tailwind CSS shopping cart sections. These layouts display selected products, quantities, prices, and total amounts…
npx shadcn@latest add https://bundui.io/r/shopping-carts-01.json Provide a seamless shopping experience with Tailwind CSS shopping cart sections. These layouts display selected products, quantities, prices, and total amounts…
npx shadcn@latest add https://bundui.io/r/shopping-carts-02.json Enable shoppers to quickly find products with Tailwind CSS category filter sections. These layouts provide checkboxes, dropdowns, and tags to refine searches, …
npx shadcn@latest add https://bundui.io/r/category-filters.json Allow shoppers to preview product details instantly with Tailwind CSS product quickview sections. These layouts showcase images, key features, pricing, and cal…
npx shadcn@latest add https://bundui.io/r/product-quickviews-01.json Allow shoppers to preview product details instantly with Tailwind CSS product quickview sections. These layouts showcase images, key features, pricing, and cal…
npx shadcn@latest add https://bundui.io/r/product-quickviews-02.json Showcase products elegantly with Tailwind CSS product card sections. These layouts combine images, titles, prices, and brief descriptions in visually appealing…
npx shadcn@latest add https://bundui.io/r/product-cards-01.json Showcase products elegantly with Tailwind CSS product card sections. These layouts combine images, titles, prices, and brief descriptions in visually appealing…
npx shadcn@latest add https://bundui.io/r/product-cards-02.json Showcase products elegantly with Tailwind CSS product card sections. These layouts combine images, titles, prices, and brief descriptions in visually appealing…
npx shadcn@latest add https://bundui.io/r/product-cards-03.json Showcase products elegantly with Tailwind CSS product card sections. These layouts combine images, titles, prices, and brief descriptions in visually appealing…
npx shadcn@latest add https://bundui.io/r/product-cards-04.json Showcase products elegantly with Tailwind CSS product card sections. These layouts combine images, titles, prices, and brief descriptions in visually appealing…
npx shadcn@latest add https://bundui.io/r/product-cards-05.json Showcase products elegantly with Tailwind CSS product card sections. These layouts combine images, titles, prices, and brief descriptions in visually appealing…
npx shadcn@latest add https://bundui.io/r/product-cards-06.json Showcase products elegantly with Tailwind CSS product card sections. These layouts combine images, titles, prices, and brief descriptions in visually appealing…
npx shadcn@latest add https://bundui.io/r/product-cards-07.json Create intuitive and responsive navigation for online stores with Tailwind CSS store navigation sections. These layouts feature menus, categories, and search o…
npx shadcn@latest add https://bundui.io/r/store-navigations.json “Highlight special offers, discounts, or limited-time deals with Tailwind CSS promo sections. These layouts combine bold visuals, concise messaging, and promin…
npx shadcn@latest add https://bundui.io/r/promo-sections-01.json “Highlight special offers, discounts, or limited-time deals with Tailwind CSS promo sections. These layouts combine bold visuals, concise messaging, and promin…
npx shadcn@latest add https://bundui.io/r/promo-sections-02.json Streamline the purchasing process with Tailwind CSS checkout form sections. These layouts feature organized fields, clear labels, and responsive design to ensu…
npx shadcn@latest add https://bundui.io/r/checkout-forms-01.json Streamline the purchasing process with Tailwind CSS checkout form sections. These layouts feature organized fields, clear labels, and responsive design to ensu…
npx shadcn@latest add https://bundui.io/r/checkout-forms-02.json Showcase authentic customer feedback with Tailwind CSS customer review sections. These layouts feature ratings, user comments, and profile visuals to build tru…
npx shadcn@latest add https://bundui.io/r/customer-reviews.json Provide clear and organized order details with Tailwind CSS order summary sections. These layouts display purchased items, quantities, prices, and totals in a …
npx shadcn@latest add https://bundui.io/r/order-summaries-01.json Provide clear and organized order details with Tailwind CSS order summary sections. These layouts display purchased items, quantities, prices, and totals in a …
npx shadcn@latest add https://bundui.io/r/order-summaries-02.json Design organized and intuitive dashboard experiences with Tailwind CSS page layouts. These sections combine sidebars, headers, content areas, and responsive gr…
npx shadcn@latest add https://bundui.io/r/page-layouts-01.json Design organized and intuitive dashboard experiences with Tailwind CSS page layouts. These sections combine sidebars, headers, content areas, and responsive gr…
npx shadcn@latest add https://bundui.io/r/page-layouts-02.json Design organized and intuitive dashboard experiences with Tailwind CSS page layouts. These sections combine sidebars, headers, content areas, and responsive gr…
npx shadcn@latest add https://bundui.io/r/page-layouts-03.json Create organized and accessible dashboard interfaces with Tailwind CSS sidebar layouts. These sections feature collapsible menus, clear navigation, and respons…
npx shadcn@latest add https://bundui.io/r/sidebar-layouts.json Display key metrics and performance indicators with Tailwind CSS stats cards. These layouts use clean typography, icons, and visual cues to make data easily di…
npx shadcn@latest add https://bundui.io/r/stat-cards-01.json Display key metrics and performance indicators with Tailwind CSS stats cards. These layouts use clean typography, icons, and visual cues to make data easily di…
npx shadcn@latest add https://bundui.io/r/stat-cards-02.json Display key metrics and performance indicators with Tailwind CSS stats cards. These layouts use clean typography, icons, and visual cues to make data easily di…
npx shadcn@latest add https://bundui.io/r/stat-cards-03.json Display key metrics and performance indicators with Tailwind CSS stats cards. These layouts use clean typography, icons, and visual cues to make data easily di…
npx shadcn@latest add https://bundui.io/r/stat-cards-04.json Display key metrics and performance indicators with Tailwind CSS stats cards. These layouts use clean typography, icons, and visual cues to make data easily di…
npx shadcn@latest add https://bundui.io/r/stat-cards-05.json Display key metrics and performance indicators with Tailwind CSS stats cards. These layouts use clean typography, icons, and visual cues to make data easily di…
npx shadcn@latest add https://bundui.io/r/stat-cards-06.json Display key metrics and performance indicators with Tailwind CSS stats cards. These layouts use clean typography, icons, and visual cues to make data easily di…
npx shadcn@latest add https://bundui.io/r/stat-cards-07.json Display key metrics and performance indicators with Tailwind CSS stats cards. These layouts use clean typography, icons, and visual cues to make data easily di…
npx shadcn@latest add https://bundui.io/r/stat-cards-08.json Organize and present data efficiently with Tailwind CSS dashboard tables. These layouts feature sortable columns, clean typography, and responsive design to ma…
npx shadcn@latest add https://bundui.io/r/tables.json Design clean and efficient dashboard forms with Tailwind CSS form layouts. These sections feature organized fields, clear labels, and responsive design to enha…
npx shadcn@latest add https://bundui.io/r/form-layouts-01.json Design clean and efficient dashboard forms with Tailwind CSS form layouts. These sections feature organized fields, clear labels, and responsive design to enha…
npx shadcn@latest add https://bundui.io/r/form-layouts-02.json Create secure and user-friendly sign-in experiences with Tailwind CSS sign-in forms. These layouts combine clear fields, prominent buttons, and subtle visual c…
npx shadcn@latest add https://bundui.io/r/sign-in-forms-01.json Create secure and user-friendly sign-in experiences with Tailwind CSS sign-in forms. These layouts combine clear fields, prominent buttons, and subtle visual c…
npx shadcn@latest add https://bundui.io/r/sign-in-forms-02.json Create secure and user-friendly sign-in experiences with Tailwind CSS sign-in forms. These layouts combine clear fields, prominent buttons, and subtle visual c…
npx shadcn@latest add https://bundui.io/r/sign-in-forms-03.json Present important content, alerts, or interactions elegantly with Tailwind CSS modal dialogs. These layouts use overlays, clear headings, and responsive design…
npx shadcn@latest add https://bundui.io/r/modal-dialogs-01.json Present important content, alerts, or interactions elegantly with Tailwind CSS modal dialogs. These layouts use overlays, clear headings, and responsive design…
npx shadcn@latest add https://bundui.io/r/modal-dialogs-02.json Present important content, alerts, or interactions elegantly with Tailwind CSS modal dialogs. These layouts use overlays, clear headings, and responsive design…
npx shadcn@latest add https://bundui.io/r/modal-dialogs-03.json Showcase available properties with Tailwind CSS property list sections. These layouts feature images, titles, prices, and brief details to help users browse op…
npx shadcn@latest add https://bundui.io/r/property-list-01.json Showcase available properties with Tailwind CSS property list sections. These layouts feature images, titles, prices, and brief details to help users browse op…
npx shadcn@latest add https://bundui.io/r/property-list-02.json Showcase detailed property information with Tailwind CSS property detail sections. These layouts highlight images, descriptions, features, pricing, and calls-t…
npx shadcn@latest add https://bundui.io/r/property-detail.json Enable users to quickly find properties with Tailwind CSS property filter sections. These layouts offer checkboxes, dropdowns, and tags to refine searches, imp…
npx shadcn@latest add https://bundui.io/r/property-filters.json Showcase your properties elegantly with Tailwind CSS property cards. These cards combine images, titles, prices, and brief details into visually appealing layo…
npx shadcn@latest add https://bundui.io/r/property-cards-01.json Showcase your properties elegantly with Tailwind CSS property cards. These cards combine images, titles, prices, and brief details into visually appealing layo…
npx shadcn@latest add https://bundui.io/r/property-cards-02.json Showcase your properties elegantly with Tailwind CSS property cards. These cards combine images, titles, prices, and brief details into visually appealing layo…
npx shadcn@latest add https://bundui.io/r/property-cards-03.json Showcase your properties elegantly with Tailwind CSS property cards. These cards combine images, titles, prices, and brief details into visually appealing layo…
npx shadcn@latest add https://bundui.io/r/property-cards-04.json Bring text to life by adding animations to letters or words.
npx shadcn@latest add https://bundui.io/r/animated-text.json Discover the allure of animated gradient text, a dynamic UI component that enhances user engagement with smooth color transitions.
npx shadcn@latest add https://bundui.io/r/animated-gradient-text.json A beautiful text transformation effect. The animation uses SVG filters and blur effects to create smooth transitions between words.
npx shadcn@latest add https://bundui.io/r/text-morph-animation.json Discover the allure of animated gradient text, a dynamic UI component that enhances user engagement with smooth color transitions. Built with Tailwind CSS and …
npx shadcn@latest add https://bundui.io/r/text-gradient-scroll.json Animated display of objects or images placed at regular intervals along a circular path. You can use this in integration sections, on pages that list your bran…
npx shadcn@latest add https://bundui.io/r/circle-path.json Experience smooth, fluid card navigation with natural drag interactions and beautiful animations.
npx shadcn@latest add https://bundui.io/r/flip-card.json A Magnetic Button is a UI component designed to enhance user interaction. When a user's cursor or touch input approaches the button, it subtly moves towards th…
npx shadcn@latest add https://bundui.io/r/magnetic-hover-effect-01.json A Magnetic Button is a UI component designed to enhance user interaction. When a user's cursor or touch input approaches the button, it subtly moves towards th…
npx shadcn@latest add https://bundui.io/r/magnetic-hover-effect-02.json Tilt Effect is an interactive component that creates a perspective effect by making buttons, cards or images respond to mouse movements.
npx shadcn@latest add https://bundui.io/r/tilt-effect.json Ripple effect is a modern animation component designed to enrich user interaction by creating a dynamic ripple effect when clicking on buttons or any HTML elem…
npx shadcn@latest add https://bundui.io/r/ripple-effect-01.json Ripple effect is a modern animation component designed to enrich user interaction by creating a dynamic ripple effect when clicking on buttons or any HTML elem…
npx shadcn@latest add https://bundui.io/r/ripple-effect-02.json Ripple effect is a modern animation component designed to enrich user interaction by creating a dynamic ripple effect when clicking on buttons or any HTML elem…
npx shadcn@latest add https://bundui.io/r/ripple-effect-03.json A cursor-trail animation that leaves small dots behind the mouse as it moves, with the dots fading out sequentially to create a snake-tail-like effect. Built w…
npx shadcn@latest add https://bundui.io/r/mouse-trail.json It's a visual effect that creates a moving beam or connection between user interface elements for dynamic visual emphasis. Tailwind is built with CSS, React, a…
npx shadcn@latest add https://bundui.io/r/animated-beam.json An animated tab is a ui component that switches between content panels with smooth animated transitions.
npx shadcn@latest add https://bundui.io/r/animated-tab.json An Animated Gradient Border is a decorative ui element that displays moving color gradients around a component’s edge.
npx shadcn@latest add https://bundui.io/r/animated-gradient-border.json Enhance user experience with count animation, dynamically animating numbers to draw attention to key data points.
npx shadcn@latest add https://bundui.io/r/counter-animation.json Use these Tailwind CSS hero section examples to showcase messaging, product images, and calls-to-action at the top of your site, featuring various styles and l…
npx shadcn@latest add https://bundui.io/r/floating-button.json Interactively compare two images with a draggable slider to reveal differences.
npx shadcn@latest add https://bundui.io/r/image-comparison.json The Interactive Image Slider is a dynamic, motion-driven gallery that reacts to mouse movement. As users move their cursor from left to right, stacked images s…
npx shadcn@latest add https://bundui.io/r/interactive-image-slider.json An interactive image reveal component where images appear and follow the cursor when hovering over any div element.
npx shadcn@latest add https://bundui.io/r/image-reveal.json Add dynamic movement to your UI with Marquee effect, ideal for highlighting important information with smooth, continuous scrolling. Built with Tailwind CSS an…
npx shadcn@latest add https://bundui.io/r/marquee-effect.json Parallax scrolling effect using overlapping cards.
npx shadcn@latest add https://bundui.io/r/parallax-cards.json The scroll progress bar adds a dynamic, interactive scrolling indicator, built with Motion and Tailwind CSS, enhancing user experience with smooth transitions.
npx shadcn@latest add https://bundui.io/r/scroll-progress-bar-01.json The scroll progress bar adds a dynamic, interactive scrolling indicator, built with Motion and Tailwind CSS, enhancing user experience with smooth transitions.
npx shadcn@latest add https://bundui.io/r/scroll-progress-bar-02.json A component that slides numbers.
npx shadcn@latest add https://bundui.io/r/sliding-number.json A countdown is a component that displays the remaining time until a specific event or deadline.
npx shadcn@latest add https://bundui.io/r/countdown.json Beautiful meteor shower animation background built with React and Canvas. Add dynamic falling meteors to your site with smooth, customizable visuals and minima…
npx shadcn@latest add https://bundui.io/r/meteor-shower-animation.json Enhance your website with the peaceful atmosphere of the Snowfall Animation Background. Create a captivating design with gently falling snowflakes for a serene…
npx shadcn@latest add https://bundui.io/r/snowfall-animation.json Add animated fireworks to your site background with this festive component. Perfect for celebrations. Built with Tailwind CSS and Framer Motion.
npx shadcn@latest add https://bundui.io/r/fireworks.json Floating Paths Background is a decorative background animation component that creates soft, looping path shapes floating across the screen.
npx shadcn@latest add https://bundui.io/r/floating-paths.json The Geometric Background component features a modern and sophisticated design, incorporating dynamic geometric shapes like triangles, squares, and polygons. Th…
npx shadcn@latest add https://bundui.io/r/fluid-particles.json A minimalist animated stars background component for React. It creates a smooth and subtle starfield animation behind your content, perfect for landing pages, …
npx shadcn@latest add https://bundui.io/r/stars.json