Loading video...

Video Failed to Load

There was a problem loading this video. This could be due to a temporary network issue or the video might be unavailable.

The new CLI and registry unlock advanced theming, including custom colors, animations, icons, dependencies, and even components With remote registry support, you can now give your apps a completely different look by running a simple command. Demo 📺

shadcn

237,564 subscribers

94,295 views • 2 years ago •via X (Twitter)

Science & Technology Education

Anya Rossi• Live Now

Private livecam show

10 Comments

shadcn2 years ago

Here's how you define a theme:

shadcn2 years ago

In the demo, we install two themes from the shadcn registry. IRL, you can install themes & components from anywhere — your own local (shared) registry, a third party registry or generated from llms such as @v0 I’m looking forward to see what this enables. (More soon)

Ansub2 years ago

bro comes to X, talks about what he shipped, leaves! keep at it 💪

Aykut2 years ago

I tried, looks cool! ✅

Parker Rex2 years ago

Ay thx. I made this before in my app and was total pita 🫓

0xyshv.eth2 years ago

Remote registry support is a game changer!

🦋 @lux.dev go follow me !!2 years ago

this is incredible

Joan Subirats Llaveria2 years ago

Please stop, I can't follow your rhythm!

jan2 years ago

when is this shipping, or has it already?

Fredkisss is on 🦋 blue sky 🦋2 years ago

Niiiiice !

Related Videos

1️⃣ - When a UI library gets popular, every app starts to look the same. How do we solve this? Introducing Styles. A new approach for shipping UI components. Start with Radix UI and Tailwind CSS. Add a style, including shapes, icons & animations. Apply your colors. ⬇️

1️⃣ - When a UI library gets popular, every app starts to look the same. How do we solve this? Introducing Styles. A new approach for shipping UI components. Start with Radix UI and Tailwind CSS. Add a style, including shapes, icons & animations. Apply your colors. ⬇️

shadcn

532,260 views • 3 years ago

Announcing Monorepo Support for the shadcn CLI We’ve made it easier to use shadcn/ui in monorepos. The CLI now understands your workspaces, installs components and dependencies in the right packages, and handles import resolution for you.

Announcing Monorepo Support for the shadcn CLI We’ve made it easier to use shadcn/ui in monorepos. The CLI now understands your workspaces, installs components and dependencies in the right packages, and handles import resolution for you.

shadcn

73,839 views • 1 year ago

Introducing soundcn - a shadcn registry with a collection of sounds. The beloved registry now has a refreshed UI, new fonts, new colors, a new layout, and sound customization 👇

Introducing soundcn - a shadcn registry with a collection of sounds. The beloved registry now has a refreshed UI, new fonts, new colors, a new layout, and sound customization 👇

KapishDima

24,016 views • 5 months ago

It’s here. Beautifully designed components built with Radix UI and Tailwind CSS. A collection of accessible and customizable components that you can copy and paste into your apps. Free. Open Source. And Next.js 13 Ready.

It’s here. Beautifully designed components built with Radix UI and Tailwind CSS. A collection of accessible and customizable components that you can copy and paste into your apps. Free. Open Source. And Next.js 13 Ready.

shadcn

667,681 views • 3 years ago

📸 The Animations & Poses Studio is officially LIVE on Say goodbye to tedious, frame-by-frame 3D animating. Now, you can instantly give your avatars body language, movement, and a whole lot of personality in just a few clicks. Check out the demo below to see how you can generate custom animations and movements for ANY 3D avatar, yes you can even bring your custom 3D files to the studio. Monetization of animations coming soon. Jump in and start creating, and be sure to tag us with your custom animations 👇

three.ws

43,784 views • 4 months ago

We’ve made discovering and adding registries easier. In this demo, we add two registries and ask shadcn/mcp to combine code from both. The form from blocks registry uses Radix, our app uses Base UI, but thanks to the shared abstraction (plus some CLI magic), it just works.

We’ve made discovering and adding registries easier. In this demo, we add two registries and ask shadcn/mcp to combine code from both. The form from blocks registry uses Radix, our app uses Base UI, but thanks to the shared abstraction (plus some CLI magic), it just works.

shadcn

68,734 views • 8 months ago

Introducing v0 by Vercel - v0 generates custom components on the fly that you can copy and paste into your existing codebase. Need a component? Just Ask - Jared Palmer Mariana Castilho Guillermo Rauch Malte Ubl almonk and the team at Vercel

Introducing v0 by Vercel - v0 generates custom components on the fly that you can copy and paste into your existing codebase. Need a component? Just Ask - Jared Palmer Mariana Castilho Guillermo Rauch Malte Ubl almonk and the team at Vercel

shadcn

737,455 views • 3 years ago

Do all shadcn/ui apps look the same? No. They don't have to. Think of shadcn/ui as a coloring template - it provides the outlines & structure. Black & white. A starting point. You get to fill it with your own unique colors and styles. And it's really easy. Here's an example:

Do all shadcn/ui apps look the same? No. They don't have to. Think of shadcn/ui as a coloring template - it provides the outlines & structure. Black & white. A starting point. You get to fill it with your own unique colors and styles. And it's really easy. Here's an example:

shadcn

392,806 views • 1 year ago

Vite's new plugin registry is live! 🎉 Browse Vite ⚡, Rolldown, and Rollup plugins from the Vite team and the community. Filter by version compatibility to find plugins that work with your setup. And if you are a maintainer, you can add your plugin easily too

Vite's new plugin registry is live! 🎉 Browse Vite ⚡, Rolldown, and Rollup plugins from the Vite team and the community. Filter by version compatibility to find plugins that work with your setup. And if you are a maintainer, you can add your plugin easily too

VoidZero

24,460 views • 6 months ago

Introducing Amicro, A curated library of premium micro-transitions and interaction components for React. Now you can add beautiful micro-interactions and seamless transitions to your website with just one CLI command ✨ Open source. Try it:

Introducing Amicro, A curated library of premium micro-transitions and interaction components for React. Now you can add beautiful micro-interactions and seamless transitions to your website with just one CLI command ✨ Open source. Try it:

Kiyotaka

199,670 views • 2 months ago

UI/UX Designers, this might be the new favourite library for micro-interactions. Amicro gives you access to a curated beautifully crafted open-source collection of premium micro-transitions and interaction components for React, making it easy to add polished animations and seamless experiences to websites, dashboards, and web apps. You can install everything with just one CLI command. Bookmarks it for later 💜

UI/UX Designers, this might be the new favourite library for micro-interactions. Amicro gives you access to a curated beautifully crafted open-source collection of premium micro-transitions and interaction components for React, making it easy to add polished animations and seamless experiences to websites, dashboards, and web apps. You can install everything with just one CLI command. Bookmarks it for later 💜

Abraham John 🦄🦓

27,048 views • 2 months ago

Today we're releasing a new set of components for building chat interfaces. We've taken the patterns we build every day, rethought the abstractions behind them, and turned them into components you can compose and customize. We're starting with the conversation layer: streaming, scrolling, messages, bubbles, attachments, and markers.

Today we're releasing a new set of components for building chat interfaces. We've taken the patterns we build every day, rethought the abstractions behind them, and turned them into components you can compose and customize. We're starting with the conversation layer: streaming, scrolling, messages, bubbles, attachments, and markers.

shadcn

956,653 views • 3 months ago

🎉DeepAgent With Databases - GOD MODE ACTIVATED! 🎉 Extremely excited to launch DeepAgent Pro with database and custom domain support With DeepAgent, you can - build apps with database support - host the app on your custom domain! - create fancy powerpoints - create storyboards and apps with the new ChatGPT image-gen - connect to Gmail, Jira, Slack, and G-Drive to automate work Watch DeepAgent one-shot a website and database creation in a minute. You can also host it using your favorite custom domain!

🎉DeepAgent With Databases - GOD MODE ACTIVATED! 🎉 Extremely excited to launch DeepAgent Pro with database and custom domain support With DeepAgent, you can - build apps with database support - host the app on your custom domain! - create fancy powerpoints - create storyboards and apps with the new ChatGPT image-gen - connect to Gmail, Jira, Slack, and G-Drive to automate work Watch DeepAgent one-shot a website and database creation in a minute. You can also host it using your favorite custom domain!

Bindu Reddy

19,456 views • 1 year ago

To get translucent menus right, we had to manually test components over different gradients & colors, checking visuals & accessibility. Now multiply that by 5 component types across 5 styles in both light and dark modes. It's a lot of work. Work that, for now, AI can't do.

To get translucent menus right, we had to manually test components over different gradients & colors, checking visuals & accessibility. Now multiply that by 5 component types across 5 styles in both light and dark modes. It's a lot of work. Work that, for now, AI can't do.

shadcn

92,675 views • 6 months ago

Want to see your screens in dark mode or different colors with just a click? 🎨 Theming is now enabled for new projects in Experimental (Gemini 2.5 Pro) mode. Instantly swap primary colors, fonts, and corner radiuses. Apply a dark mode theme to a single screen or your entire flow with SHIFT+Click. Use copy+paste to see multiple versions side by side. Perfect for quickly exploring new brand styles and modes. (Note: theming is not backwards compatible with existing experimental projects)

Stitch by Google

28,068 views • 1 year ago

The new Open in v0 lets you take your components to v0 for prompting. My new workflow is component to v0 to editor. You can try it now on

The new Open in v0 lets you take your components to v0 for prompting. My new workflow is component to v0 to editor. You can try it now on

shadcn

173,352 views • 2 years ago

💡 We just published a canary release of Expo DOM components ("use dom") so you can try it early and give us feedback for SDK 52! Demo app has MDX and shadcn UI with the new charts components ↓

💡 We just published a canary release of Expo DOM components ("use dom") so you can try it early and give us feedback for SDK 52! Demo app has MDX and shadcn UI with the new charts components ↓

Evan Bacon 🥓

115,799 views • 2 years ago