@delta

A modern shadcn/ui registry by Patrick Prunty covering AI and media-rich interface components: streaming LLM chat widget, zoomable images, swipeable card deck, Mapbox map pointer, QR code generator, OTP input, code block, admonition/callout, scroll-fade effect, tabs, product card, and X (Twitter) card. Also includes dashboard and landing-page section blocks. Built with React and Tailwind CSS; v0-compatible. Free and MIT-licensed. Use for: adding a curated set of AI chat, media display, and map components to a shadcn project in one registry pull.

93 components react shadcn-cli MIT

website ↗ github ↗ registry ↗ agent brief (.md) ↗

Install this registry

shadcn (npm) npx shadcn@latest add https://deltacomponents.dev/r/registry.json

pnpm pnpm dlx shadcn@latest add https://deltacomponents.dev/r/registry.json

bun bunx shadcn@latest add https://deltacomponents.dev/r/registry.json

fetch registry curl -s https://deltacomponents.dev/r/registry.json

Components

93 total

index style

npx shadcn@latest add https://deltacomponents.dev/r/index.json

style style

npx shadcn@latest add https://deltacomponents.dev/r/style.json

input-otp ui

npx shadcn@latest add https://deltacomponents.dev/r/input-otp.json

navigation-menu ui

npx shadcn@latest add https://deltacomponents.dev/r/navigation-menu.json

code-block-icons ui

npx shadcn@latest add https://deltacomponents.dev/r/code-block-icons.json

code-block ui

npx shadcn@latest add https://deltacomponents.dev/r/code-block.json

copy-button ui

npx shadcn@latest add https://deltacomponents.dev/r/copy-button.json

cambio-image ui

npx shadcn@latest add https://deltacomponents.dev/r/cambio-image.json

card-deck ui

npx shadcn@latest add https://deltacomponents.dev/r/card-deck.json

admonition ui

npx shadcn@latest add https://deltacomponents.dev/r/admonition.json

x-scrollable ui

npx shadcn@latest add https://deltacomponents.dev/r/x-scrollable.json

scroll-fade-effect ui

npx shadcn@latest add https://deltacomponents.dev/r/scroll-fade-effect.json

tabs ui

npx shadcn@latest add https://deltacomponents.dev/r/tabs.json

qrcode ui

npx shadcn@latest add https://deltacomponents.dev/r/qrcode.json

chat ui

npx shadcn@latest add https://deltacomponents.dev/r/chat.json

mapbox-pointer ui

npx shadcn@latest add https://deltacomponents.dev/r/mapbox-pointer.json

x-card ui

npx shadcn@latest add https://deltacomponents.dev/r/x-card.json

marquee ui

npx shadcn@latest add https://deltacomponents.dev/r/marquee.json

product-card ui

npx shadcn@latest add https://deltacomponents.dev/r/product-card.json

ai-chat-sidebar block

A collapsible sidebar component for AI chat applications

npx shadcn@latest add https://deltacomponents.dev/r/ai-chat-sidebar.json

testimonials block

Customer testimonials grid

npx shadcn@latest add https://deltacomponents.dev/r/testimonials.json

interactive-feature-showcase block

InteractiveFeatureShowcase block

npx shadcn@latest add https://deltacomponents.dev/r/interactive-feature-showcase.json

chatbot-window block

Resizable AI chatbot interface with collapsible sidebar

npx shadcn@latest add https://deltacomponents.dev/r/chatbot-window.json

bottom-mobile-nav block

BottomMobileNav block

npx shadcn@latest add https://deltacomponents.dev/r/bottom-mobile-nav.json

mapbox-grid-block block

Three-column grid showcasing global locations with Mapbox maps

npx shadcn@latest add https://deltacomponents.dev/r/mapbox-grid-block.json

admin-inset-layout block

Admin dashboard layout with inset sidebar

npx shadcn@latest add https://deltacomponents.dev/r/admin-inset-layout.json

saas-header-layout block

SaaS header layout with navigation menu

npx shadcn@latest add https://deltacomponents.dev/r/saas-header-layout.json

saas-dashboard block

SaaS dashboard with inset sidebar and navigation

npx shadcn@latest add https://deltacomponents.dev/r/saas-dashboard.json

auth-form block

Authentication form with SSO, email, passkey, and SAML options

npx shadcn@latest add https://deltacomponents.dev/r/auth-form.json

use-mobile hook

npx shadcn@latest add https://deltacomponents.dev/r/use-mobile.json

input-otp-demo example

npx shadcn@latest add https://deltacomponents.dev/r/input-otp-demo.json

input-otp-pill-demo example

npx shadcn@latest add https://deltacomponents.dev/r/input-otp-pill-demo.json

input-otp-separator-demo example

npx shadcn@latest add https://deltacomponents.dev/r/input-otp-separator-demo.json

input-otp-form-demo example

npx shadcn@latest add https://deltacomponents.dev/r/input-otp-form-demo.json

product-card-demo example

npx shadcn@latest add https://deltacomponents.dev/r/product-card-demo.json

product-card-inner-demo example

npx shadcn@latest add https://deltacomponents.dev/r/product-card-inner-demo.json

product-card-custom-demo example

npx shadcn@latest add https://deltacomponents.dev/r/product-card-custom-demo.json

product-card-size-demo example

npx shadcn@latest add https://deltacomponents.dev/r/product-card-size-demo.json

product-card-grid-demo example

npx shadcn@latest add https://deltacomponents.dev/r/product-card-grid-demo.json

navigation-menu-demo example

npx shadcn@latest add https://deltacomponents.dev/r/navigation-menu-demo.json

x-card-demo example

npx shadcn@latest add https://deltacomponents.dev/r/x-card-demo.json

x-card-basic-demo example

npx shadcn@latest add https://deltacomponents.dev/r/x-card-basic-demo.json

x-card-interactive-demo example

npx shadcn@latest add https://deltacomponents.dev/r/x-card-interactive-demo.json

marquee-stacked-demo example

npx shadcn@latest add https://deltacomponents.dev/r/marquee-stacked-demo.json

marquee-cards-demo example

npx shadcn@latest add https://deltacomponents.dev/r/marquee-cards-demo.json

marquee-demo example

npx shadcn@latest add https://deltacomponents.dev/r/marquee-demo.json

mapbox-pointer-demo example

npx shadcn@latest add https://deltacomponents.dev/r/mapbox-pointer-demo.json

mapbox-pointer-style-demo example

npx shadcn@latest add https://deltacomponents.dev/r/mapbox-pointer-style-demo.json

mapbox-pointer-theme-demo example

npx shadcn@latest add https://deltacomponents.dev/r/mapbox-pointer-theme-demo.json

chat-demo example

npx shadcn@latest add https://deltacomponents.dev/r/chat-demo.json

chat-previous-messages-demo example

npx shadcn@latest add https://deltacomponents.dev/r/chat-previous-messages-demo.json

chat-simple-demo example

npx shadcn@latest add https://deltacomponents.dev/r/chat-simple-demo.json

code-block-demo example

npx shadcn@latest add https://deltacomponents.dev/r/code-block-demo.json

code-block-package-demo example

npx shadcn@latest add https://deltacomponents.dev/r/code-block-package-demo.json

code-block-theme-demo example

npx shadcn@latest add https://deltacomponents.dev/r/code-block-theme-demo.json

code-block-interactive-demo example

npx shadcn@latest add https://deltacomponents.dev/r/code-block-interactive-demo.json

code-block-markdown-string-demo example

npx shadcn@latest add https://deltacomponents.dev/r/code-block-markdown-string-demo.json

code-block-npx-markdown-demo example

npx shadcn@latest add https://deltacomponents.dev/r/code-block-npx-markdown-demo.json

code-block-package-manager-demo example

npx shadcn@latest add https://deltacomponents.dev/r/code-block-package-manager-demo.json

code-block-python-demo example

npx shadcn@latest add https://deltacomponents.dev/r/code-block-python-demo.json

code-block-json-demo example

npx shadcn@latest add https://deltacomponents.dev/r/code-block-json-demo.json

code-block-expand-demo example

npx shadcn@latest add https://deltacomponents.dev/r/code-block-expand-demo.json

cambio-image-demo example

npx shadcn@latest add https://deltacomponents.dev/r/cambio-image-demo.json

cambio-image-grid-demo example

npx shadcn@latest add https://deltacomponents.dev/r/cambio-image-grid-demo.json

cambio-image-dismiss-on-scroll-demo example

npx shadcn@latest add https://deltacomponents.dev/r/cambio-image-dismiss-on-scroll-demo.json

cambio-image-motion-preset-demo example

npx shadcn@latest add https://deltacomponents.dev/r/cambio-image-motion-preset-demo.json

cambio-image-icons-expand-demo example

npx shadcn@latest add https://deltacomponents.dev/r/cambio-image-icons-expand-demo.json

cambio-image-close-button-demo example

npx shadcn@latest add https://deltacomponents.dev/r/cambio-image-close-button-demo.json

qrcode-demo example

npx shadcn@latest add https://deltacomponents.dev/r/qrcode-demo.json

qrcode-purple-dots-demo example

npx shadcn@latest add https://deltacomponents.dev/r/qrcode-purple-dots-demo.json

qrcode-demo-interactive example

npx shadcn@latest add https://deltacomponents.dev/r/qrcode-demo-interactive.json

qrcode-logo-demo example

npx shadcn@latest add https://deltacomponents.dev/r/qrcode-logo-demo.json

card-deck-demo example

npx shadcn@latest add https://deltacomponents.dev/r/card-deck-demo.json

card-deck-demo-interactive example

npx shadcn@latest add https://deltacomponents.dev/r/card-deck-demo-interactive.json

admonition-demo example

npx shadcn@latest add https://deltacomponents.dev/r/admonition-demo.json

admonition-demo-interactive example

npx shadcn@latest add https://deltacomponents.dev/r/admonition-demo-interactive.json

admonition-custom-icon-demo example

npx shadcn@latest add https://deltacomponents.dev/r/admonition-custom-icon-demo.json

admonition-dismissible-demo example

npx shadcn@latest add https://deltacomponents.dev/r/admonition-dismissible-demo.json

admonition-actions-demo example

npx shadcn@latest add https://deltacomponents.dev/r/admonition-actions-demo.json

admonition-collapsible-demo example

npx shadcn@latest add https://deltacomponents.dev/r/admonition-collapsible-demo.json

tabs-demo example

npx shadcn@latest add https://deltacomponents.dev/r/tabs-demo.json

tabs-background-demo example

npx shadcn@latest add https://deltacomponents.dev/r/tabs-background-demo.json

tabs-no-background-demo example

npx shadcn@latest add https://deltacomponents.dev/r/tabs-no-background-demo.json

tabs-sizes-demo example

npx shadcn@latest add https://deltacomponents.dev/r/tabs-sizes-demo.json

tabs-with-icons-demo example

npx shadcn@latest add https://deltacomponents.dev/r/tabs-with-icons-demo.json

tabs-entrance-animation-demo example

npx shadcn@latest add https://deltacomponents.dev/r/tabs-entrance-animation-demo.json

tabs-in-scroll-area-demo example

npx shadcn@latest add https://deltacomponents.dev/r/tabs-in-scroll-area-demo.json

card-deck-yugioh-demo example

npx shadcn@latest add https://deltacomponents.dev/r/card-deck-yugioh-demo.json

card-deck-balatro-demo example

npx shadcn@latest add https://deltacomponents.dev/r/card-deck-balatro-demo.json

chat-shimmer-demo example

npx shadcn@latest add https://deltacomponents.dev/r/chat-shimmer-demo.json

chat-reasoning-demo example

npx shadcn@latest add https://deltacomponents.dev/r/chat-reasoning-demo.json

scroll-fade-effect-demo example

npx shadcn@latest add https://deltacomponents.dev/r/scroll-fade-effect-demo.json

scroll-fade-effect-slider-demo example

npx shadcn@latest add https://deltacomponents.dev/r/scroll-fade-effect-slider-demo.json