@tailwind-admin

Free, open-source admin dashboard template built with Tailwind CSS, shadcn/ui, and Radix primitives. Supports Next.js, React, Vue, Angular 21, and TanStack Start. Pre-designed pages include Dashboard, Login, Register, User Profile, Tables, Charts (via ApexCharts), and Error pages. Offers sidebar, topbar, and responsive layouts with dark mode. Iconify icons included. MIT license. Use for: bootstrapping SaaS dashboards, CRM panels, internal admin tools, or analytics interfaces across multiple frontend frameworks without starting from a blank page.

102 components pro available vue shadcn-cli MIT

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

Install this registry

shadcn (npm) npx shadcn@latest add https://tailwind-admin.com/r/registry.json

pnpm pnpm dlx shadcn@latest add https://tailwind-admin.com/r/registry.json

bun bunx shadcn@latest add https://tailwind-admin.com/r/registry.json

fetch registry curl -s https://tailwind-admin.com/r/registry.json

Components

102 total

download-banner component

A banner component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/download-banner.json

empty-banner component

A banner component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/empty-banner.json

error-banner component

A banner component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/error-banner.json

greeting-banner component

A banner component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/greeting-banner.json

mutual-banner component

A banner component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/mutual-banner.json

notification-banner component

A banner component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/notification-banner.json

welcome-banner component

A banner component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/welcome-banner.json

best-selling-product component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/best-selling-product.json

top-cards component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/top-cards.json

blog-cards component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/blog-cards.json

feed-cards component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/feed-cards.json

gift-cards component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/gift-cards.json

music-cards component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/music-cards.json

payment-gateways component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/payment-gateways.json

poll-of-week component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/poll-of-week.json

poll-result component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/poll-result.json

products-cards component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/products-cards.json

profile-cards component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/profile-cards.json

recent-comments component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/recent-comments.json

recent-messages component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/recent-messages.json

recent-transaction component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/recent-transaction.json

review-cards component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/review-cards.json

settings-card component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/settings-card.json

social-card component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/social-card.json

social-cards component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/social-cards.json

social-post component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/social-post.json

task-list component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/task-list.json

upcomming-activities component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/upcomming-activities.json

user-cards component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/user-cards.json

user-info-card component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/user-info-card.json

user-profile-card component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/user-profile-card.json

login-1 component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/login-1.json

login-2 component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/login-2.json

login-3 component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/login-3.json

login-4 component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/login-4.json

signup-1 component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/signup-1.json

signup-2 component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/signup-2.json

signup-3 component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/signup-3.json

signup-4 component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/signup-4.json

otp-1 component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/otp-1.json

otp-2 component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/otp-2.json

otp-3 component

A Card component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/otp-3.json

current-value-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/current-value-chart.json

current-year-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/current-year-chart.json

customers-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/customers-chart.json

earned-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/earned-chart.json

expnace-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/expnace-chart.json

followers-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/followers-chart.json

income-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/income-chart.json

monthly-earning-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/monthly-earning-chart.json

most-visited-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/most-visited-chart.json

page-impression-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/page-impression-chart.json

projects-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/projects-chart.json

revenue-updates-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/revenue-updates-chart.json

sales-overview-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/sales-overview-chart.json

total-earnigs-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/total-earnigs-chart.json

views-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/views-chart.json

weekly-stats-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/weekly-stats-chart.json

yarly-breakup-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/yarly-breakup-chart.json

yearly-sales-chart component

A Chart component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/yearly-sales-chart.json

bell-notify-button component

A Button component with optional code display for UI blocks.

npx shadcn@latest add https://tailwind-admin.com/r/bell-notify-button.json

glitch-button component

A Button component with glitch animation effect.

npx shadcn@latest add https://tailwind-admin.com/r/glitch-button.json

glow-link-button component

A Button component with glow effect on hover.

npx shadcn@latest add https://tailwind-admin.com/r/glow-link-button.json

heart-like-button component

A Button component with heart animation for like functionality.

npx shadcn@latest add https://tailwind-admin.com/r/heart-like-button.json

hover-lift-button component

A Button component that lifts on hover.

npx shadcn@latest add https://tailwind-admin.com/r/hover-lift-button.json

liquid-fill-button component

A Button component with liquid fill animation on hover.

npx shadcn@latest add https://tailwind-admin.com/r/liquid-fill-button.json

ripple-effect-button component

A Button component with ripple effect animation on hover.

npx shadcn@latest add https://tailwind-admin.com/r/ripple-effect-button.json

shine-effect-button component

A Button component with shine effect animation on hover.

npx shadcn@latest add https://tailwind-admin.com/r/shine-effect-button.json

magnetic-button component

A Button component with magnetic effect animation on hover.

npx shadcn@latest add https://tailwind-admin.com/r/magnetic-button.json

heartbeat-effect-button component

A Button component with heartbeat effect animation on hover.

npx shadcn@latest add https://tailwind-admin.com/r/heartbeat-effect-button.json

matrix-rain-button component

A Button component with matrix rain animation effect.

npx shadcn@latest add https://tailwind-admin.com/r/matrix-rain-button.json

playful-wiggle-button component

A Button component with playful wiggle animation.

npx shadcn@latest add https://tailwind-admin.com/r/playful-wiggle-button.json

shiny-button component

A Button component with shiny effect animation.

npx shadcn@latest add https://tailwind-admin.com/r/shiny-button.json

star-favourite-button component

A Button component with star animation for favourite functionality.

npx shadcn@latest add https://tailwind-admin.com/r/star-favourite-button.json

tap-pop-button component

A Button component with tap and pop animation effect.

npx shadcn@latest add https://tailwind-admin.com/r/tap-pop-button.json

action-tracking-motion component

A Card component with action tracking animation.

npx shadcn@latest add https://tailwind-admin.com/r/action-tracking-motion.json

alert-card-motion component

A Card component with alert animation.

npx shadcn@latest add https://tailwind-admin.com/r/alert-card-motion.json

animate-border-card-motion component

A Card component with animated border effect.

npx shadcn@latest add https://tailwind-admin.com/r/animate-border-card-motion.json

card-circle-motion component

A Card component with circle reveal animation.

npx shadcn@latest add https://tailwind-admin.com/r/card-circle-motion.json

card-lift-motion component

A Card component with lift animation on hover.

npx shadcn@latest add https://tailwind-admin.com/r/card-lift-motion.json

expandable-card-motion component

A Card component that expands on click.

npx shadcn@latest add https://tailwind-admin.com/r/expandable-card-motion.json

flip-card-motion component

A Card component with flip animation.

npx shadcn@latest add https://tailwind-admin.com/r/flip-card-motion.json

image-comparison-motion component

A component for comparing two images with a slider.

npx shadcn@latest add https://tailwind-admin.com/r/image-comparison-motion.json

insight-card-motion component

A Card component displaying insights with animation.

npx shadcn@latest add https://tailwind-admin.com/r/insight-card-motion.json

message-card-motion component

A Card component displaying messages with animation.

npx shadcn@latest add https://tailwind-admin.com/r/message-card-motion.json

three-d-card-motion component

A Card component with 3D hover effect.

npx shadcn@latest add https://tailwind-admin.com/r/three-d-card-motion.json

file-upload-motion component

A file upload component with drag and drop animation.

npx shadcn@latest add https://tailwind-admin.com/r/file-upload-motion.json

input-form-motion component

An input form component with spotlight effect.

npx shadcn@latest add https://tailwind-admin.com/r/input-form-motion.json

input-placeholder-motion component

An input form component with spotlight effect.

npx shadcn@latest add https://tailwind-admin.com/r/input-placeholder-motion.json

link-preview component

An preview link component with spotlight effect.

npx shadcn@latest add https://tailwind-admin.com/r/link-preview.json

animated-list-motion component

A list component with staggered animation.

npx shadcn@latest add https://tailwind-admin.com/r/animated-list-motion.json

dot-loader-motion component

A dot loader component with animation.

npx shadcn@latest add https://tailwind-admin.com/r/dot-loader-motion.json

elastic-slider-motion component

A slider component with elastic animation.

npx shadcn@latest add https://tailwind-admin.com/r/elastic-slider-motion.json

animated-text-background-motion component

A text component with animated gradient background.

npx shadcn@latest add https://tailwind-admin.com/r/animated-text-background-motion.json

text-roller-motion component

A text component that rolls through a list of words.

npx shadcn@latest add https://tailwind-admin.com/r/text-roller-motion.json

shiny-text-motion component

A text component that shines.

npx shadcn@latest add https://tailwind-admin.com/r/shiny-text-motion.json

text-shimmer-motion component

A text component with shimmer effect.

npx shadcn@latest add https://tailwind-admin.com/r/text-shimmer-motion.json

typing-animation-motion component

A text component with typing animation.

npx shadcn@latest add https://tailwind-admin.com/r/typing-animation-motion.json

animate-table-motion component

A table component with row animation.

npx shadcn@latest add https://tailwind-admin.com/r/animate-table-motion.json

animated-tab-motion component

A tab component with animated selection.

npx shadcn@latest add https://tailwind-admin.com/r/animated-tab-motion.json

transition-tab-motion component

A tab component with transition effects.

npx shadcn@latest add https://tailwind-admin.com/r/transition-tab-motion.json

animated-tooltip-motion component

A tooltip component with animated selection.

npx shadcn@latest add https://tailwind-admin.com/r/animated-tooltip-motion.json