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.

Introducing Shadcn theme generator 🥳 I wanted to create a custom theme generator for and today I’ve released it in beta. Explore freely on an infinite canvas, tweak theme settings, save, share, or apply them directly to your codebase. There might be bugs or missing parts. I’m open to... show more

Toby

4,972 subscribers

18,001 views • 2 months ago •via X (Twitter)

Anya Rossi• Live Now

Private livecam show

0 Comments

No comments available

Comments from the original post will appear here

Related Videos

I work with shadcn/ui every day. I design with it, I build with it, and I see a lot of projects built with it. And honestly? Many of them look the same. Or worse - they look broken. Colors that clash. Fonts that don't pair. Dark modes that feel like an afterthought. The components themselves are great. The theming that people or AI make? Not so much. So I built a tool to fix that. I just launched my shadcn theme generator that will allow you to ship beautiful shadcn/ui themes in just 3-4 clicks. What it does: - Creates your entire color palette from 1 color (your hex or any tailwind color) - Works for light and dark theme - Only includes fonts that actually look good in UI - Font pairings I curated myself - Works for any project - landing page, dashboard, store - Has a color contast checker for the entire palette Too lazy? Just use random theme feature Done? Copy and paste the CSS to your global.css file or import to our Figma kit.

I work with shadcn/ui every day. I design with it, I build with it, and I see a lot of projects built with it. And honestly? Many of them look the same. Or worse - they look broken. Colors that clash. Fonts that don't pair. Dark modes that feel like an afterthought. The components themselves are great. The theming that people or AI make? Not so much. So I built a tool to fix that. I just launched my shadcn theme generator that will allow you to ship beautiful shadcn/ui themes in just 3-4 clicks. What it does: - Creates your entire color palette from 1 color (your hex or any tailwind color) - Works for light and dark theme - Only includes fonts that actually look good in UI - Font pairings I curated myself - Works for any project - landing page, dashboard, store - Has a color contast checker for the entire palette Too lazy? Just use random theme feature Done? Copy and paste the CSS to your global.css file or import to our Figma kit.

Matt

77,669 views • 3 months ago

Make Edge your own with Theme Generator. Now available on desktop.

Make Edge your own with Theme Generator. Now available on desktop.

Microsoft Edge

3,803,580 views • 2 years ago

🎨 Design freely with Agent 4. - Design while the agent builds. - Explore multiple UI variants on an infinite canvas. - Make precise UI edits that you can apply directly to your app.

🎨 Design freely with Agent 4. - Design while the agent builds. - Explore multiple UI variants on an infinite canvas. - Make precise UI edits that you can apply directly to your app.

Replit ⠕

184,057 views • 2 months ago

Such a good theme song ⚙️ Generator Rex premiered 15 years ago, today!

Such a good theme song ⚙️ Generator Rex premiered 15 years ago, today!

Ben 10 News

22,781 views • 1 year ago

HUGE wins for Liquid themes now in Dev Preview!! 🆕 New Settings UI 🆕 Metaobject Settings 🆕 Dynamic Sources for Theme Blocks These are coming to GA soon, but we wanted to get these into your hands ASAP so we can iterate and polish based on your feedback. DMs are open!

HUGE wins for Liquid themes now in Dev Preview!! 🆕 New Settings UI 🆕 Metaobject Settings 🆕 Dynamic Sources for Theme Blocks These are coming to GA soon, but we wanted to get these into your hands ASAP so we can iterate and polish based on your feedback. DMs are open!

Ben Sehl

47,353 views • 1 year ago

Introducing Veil a shadcn ui marketing blocks kit for building super simple websites. - registry ready - light and dark theme supported - open in v0 👇

Introducing Veil a shadcn ui marketing blocks kit for building super simple websites. - registry ready - light and dark theme supported - open in v0 👇

Méschac Irung

99,576 views • 4 months ago

Introducing Design Mode on v0: • Quickly tweak your generation — copy, typography, layout, colors, styling, and more • Preview changes and save when ready • No need to spend credits or wait for an LLM • Tailwind and shadcn native

Introducing Design Mode on v0: • Quickly tweak your generation — copy, typography, layout, colors, styling, and more • Preview changes and save when ready • No need to spend credits or wait for an LLM • Tailwind and shadcn native

v0

561,540 views • 1 year ago

introducing Live Previews for YOUR website in tweakcn customize your shadcn site's theme in real-time by simply adding a script tag. no need to go back and forth when testing themes!

introducing Live Previews for YOUR website in tweakcn customize your shadcn site's theme in real-time by simply adding a script tag. no need to go back and forth when testing themes!

Sahaj

91,427 views • 8 months ago

We’ve brought shadcn/create into our Figma toolkit. With our Figma to shadcn/ui plugin, you can tailor the component library just like you do in shadcn/create - directly in Figma. Adjust base and theme colors, radii, fonts, and icon sets in seconds.

We’ve brought shadcn/create into our Figma toolkit. With our Figma to shadcn/ui plugin, you can tailor the component library just like you do in shadcn/create - directly in Figma. Adjust base and theme colors, radii, fonts, and icon sets in seconds.

Matt

10,553 views • 4 months ago

These guys are awesome! Tried to do a "battle-theme" or a overall "theme"

These guys are awesome! Tried to do a "battle-theme" or a overall "theme"

giga

112,837 views • 9 months ago

Today, we’re introducing Ideogram Canvas, an infinite creative board for organizing, generating, editing, and combining images. Bring your face or brand visuals to Ideogram Canvas and use industry-leading Magic Fill and Extend to blend them with creative, AI-generated content.

Ideogram

520,607 views • 1 year ago

Is your app theme still just "default"? That's the real horror! 😱 Learn how to stitch together a custom theme using the Theme widget. Get a technical walkthrough on customizing your app's colorScheme and textTheme in this previous #WidgetOfTheWeek. #ThrowbackThursday

Is your app theme still just "default"? That's the real horror! 😱 Learn how to stitch together a custom theme using the Theme widget. Get a technical walkthrough on customizing your app's colorScheme and textTheme in this previous #WidgetOfTheWeek. #ThrowbackThursday

Flutter

12,806 views • 7 months ago

Introducing shadcn/create – Build your own shadcn/ui Customize Everything. Pick your component library, icons, base color, theme, fonts and build something that doesn’t look like everything else. Now available for Next.js, Vite, TanStack Start and v0.

Introducing shadcn/create – Build your own shadcn/ui Customize Everything. Pick your component library, icons, base color, theme, fonts and build something that doesn’t look like everything else. Now available for Next.js, Vite, TanStack Start and v0.

shadcn

1,127,114 views • 6 months ago

My matsu-theme for shadcn is now live! I also started working on a dedicated Figma kit for this theme. Preview and install with CLI ⬇️

My matsu-theme for shadcn is now live! I also started working on a dedicated Figma kit for this theme. Preview and install with CLI ⬇️

Matt

56,840 views • 1 year ago

LEAKED: Shopify might stop allowing the sale of premium themes in the future. Our store looks custom-code, but it’s just the %100 FREE Dawn theme + ready-to-use sections. We built the entire store in under 10 minutes. Just drag-and-drop these ready-to-use sections into your theme and customize them directly in the editor. Comment “READY” and I’ll show you how to do it. (must be following so I can DM you)

LEAKED: Shopify might stop allowing the sale of premium themes in the future. Our store looks custom-code, but it’s just the %100 FREE Dawn theme + ready-to-use sections. We built the entire store in under 10 minutes. Just drag-and-drop these ready-to-use sections into your theme and customize them directly in the editor. Comment “READY” and I’ll show you how to do it. (must be following so I can DM you)

Donald

17,522 views • 4 months ago

LEAKED: Shopify might stop allowing the sale of premium themes in the future. Our store looks custom-code, but it’s just the %100 FREE Dawn theme + ready-to-use sections. We built the entire store in under 10 minutes. Just drag-and-drop these ready-to-use sections into your theme and customize them directly in the editor. Comment “SUN” and I’ll show you how to do it. (must be following so I can DM you)

LEAKED: Shopify might stop allowing the sale of premium themes in the future. Our store looks custom-code, but it’s just the %100 FREE Dawn theme + ready-to-use sections. We built the entire store in under 10 minutes. Just drag-and-drop these ready-to-use sections into your theme and customize them directly in the editor. Comment “SUN” and I’ll show you how to do it. (must be following so I can DM you)

George

24,020 views • 5 months ago

Themes for v0 • Create your own theme from a prompt • Modify individual design tokens • Switch between themes on generations • Use shadcn built-in themes

Themes for v0 • Create your own theme from a prompt • Modify individual design tokens • Switch between themes on generations • Use shadcn built-in themes

Vercel

134,166 views • 1 year ago

Introducing MagicPath, an infinite canvas to create, refine, and explore with AI. Create beautiful components and functional apps, while providing production ready code. Available today, free, for everyone. The Cursor moment for design is here.

Introducing MagicPath, an infinite canvas to create, refine, and explore with AI. Create beautiful components and functional apps, while providing production ready code. Available today, free, for everyone. The Cursor moment for design is here.

Pietro Schirano

1,879,738 views • 1 year ago

Introducing the SVG Pattern Generator ✨ 200 compatible SVG patterns and a web app to combine them into infinite variations. ↓

Introducing the SVG Pattern Generator ✨ 200 compatible SVG patterns and a web app to combine them into infinite variations. ↓

Nucleo Icons

77,235 views • 18 days ago