Loading video...

Video Failed to Load

Go Home

Introducing Prism Templates ✨ Ready to use pages for your application built on shadcn and run on Next.js How it works: ◆ Go to Prism UI ◆ Download templates ◆ Run and edit your new website I have wanted to make something like this for everyone for a while,...

CodeHagen's profile picture

CodeHagen

9,325 subscribers

16,258 views • 1 year ago •via X (Twitter)

Science & TechnologyEducationArts
LIVE

Anya Rossi• Live Now

Private livecam show

12 Comments

CodeHagen's profile picture
CodeHagen1 year ago

Direct Link 🔗

Direct Mail for Mac's profile picture
Direct Mail for Mac2 years ago

Say hello to Direct Mail – the macOS app that makes crafting email newsletters a breeze! 🚀 Create, send, and engage effortlessly. #MacUsers #EmailMarketing

Alejandro Wurts's profile picture
Alejandro Wurts1 year ago

@shadcn @nextjs I think this would be lovely as shadcn blocks so that you can get the templates through the CLI.

CodeHagen's profile picture
CodeHagen1 year ago

@shadcn @nextjs 100% working on it ✨

Mahesh's profile picture
Mahesh1 year ago

@shadcn @nextjs I hope some AI builder tools pick this up.

CodeHagen's profile picture
CodeHagen1 year ago

@shadcn @nextjs Yes! ✨

Mr. Metrix's profile picture
Mr. Metrix1 year ago

@shadcn @nextjs Amazing work 🚀

CodeHagen's profile picture
CodeHagen1 year ago

@shadcn @nextjs Thanks ✨

Mason James.3.2-12b_q4_K_S's profile picture
Mason James.3.2-12b_q4_K_S1 year ago

@shadcn @nextjs This is SO SO good! Do you take requests?!? I have not found anything resembling a kanban board 😇

CodeHagen's profile picture
CodeHagen1 year ago

@shadcn @nextjs Thanks! And yes i do. Have been looking into a kanban board 👀

Tamil kans's profile picture
Tamil kans1 year ago

@shadcn @nextjs Amazing work

CodeHagen's profile picture
CodeHagen1 year ago

@shadcn @nextjs Thanks Tamil ✨

Related Videos

Introducing Prism UI ✨ A UI library built on top of shadcn components to create beautiful pages 🪄 Animated components that are build on shadcn, Tailwind CSS and framer motion. 100% Free and Open Source I have drawn inspiration from two main sources ◆ shadcn - The foundation and the 🐐 ◆ Steven Tey - The clean, modern UI/UX seen in dub has been a huge inspiration Tech Stack: Vercel shadcn Framer Tailwind CSS v0 Matt Perry (framer motion) This was my holiday project - Hope you like it 🖤 #opensource #buildinpublic
0:47

Introducing Prism UI ✨ A UI library built on top of shadcn components to create beautiful pages 🪄 Animated components that are build on shadcn, Tailwind CSS and framer motion. 100% Free and Open Source I have drawn inspiration from two main sources ◆ shadcn - The foundation and the 🐐 ◆ Steven Tey - The clean, modern UI/UX seen in dub has been a huge inspiration Tech Stack: Vercel shadcn Framer Tailwind CSS v0 Matt Perry (framer motion) This was my holiday project - Hope you like it 🖤 #opensource #buildinpublic

CodeHagen

241,425 views • 1 year ago

Introducing OpenStatus - an open source monitoring service to check your api/website, collaborated with 🦋 @thibaultouay.dev. ◆ Built with Next.js, Turso, for speed. ◆ Built with Tailwind CSS, shadcn ui for seemless components. →
1:38

Introducing OpenStatus - an open source monitoring service to check your api/website, collaborated with 🦋 @thibaultouay.dev. ◆ Built with Next.js, Turso, for speed. ◆ Built with Tailwind CSS, shadcn ui for seemless components. →

Maximilian Kaske 🏓

95,813 views • 2 years ago

Calendar built from scratch ↓ → Next.js hosted on Vercel → Tailwind CSS for styling → shadcn for beautiful and accessible components → nuqs for URL-based state management
0:26

Calendar built from scratch ↓ → Next.js hosted on Vercel → Tailwind CSS for styling → shadcn for beautiful and accessible components → nuqs for URL-based state management

João Melo

16,550 views • 1 year ago

Copy my dashboard - If you want ✨ Done with the dashboard for Propdock - Been using Cursor + v0 for almost the whole project. All components are from shadcn 🐐 ◆ Examples on how to use server actions ✨ ◆ Charts and stuff 📈 ◆ Feel free to copy it if you want 🔥 The project is Open-source so take what you want. Rest of the weekend im going to write issues for the community 🪄 Tech Stack: Vercel NextAuth.js Prisma Postgres shadcn Neon - Serverless Postgres Resend Tailwind CSS v0 #opensource #buildinpublic #proptech
0:57

Copy my dashboard - If you want ✨ Done with the dashboard for Propdock - Been using Cursor + v0 for almost the whole project. All components are from shadcn 🐐 ◆ Examples on how to use server actions ✨ ◆ Charts and stuff 📈 ◆ Feel free to copy it if you want 🔥 The project is Open-source so take what you want. Rest of the weekend im going to write issues for the community 🪄 Tech Stack: Vercel NextAuth.js Prisma Postgres shadcn Neon - Serverless Postgres Resend Tailwind CSS v0 #opensource #buildinpublic #proptech

CodeHagen

60,355 views • 1 year ago

Introducing HeseUI - Foundation components built on Base UI I created this project for personal use and rebranded it today. - Uses shadcn design system and registry - Built on growing base-ui - Responsive, optimized components - v0 supported Check it out below 👇
0:35

Introducing HeseUI - Foundation components built on Base UI I created this project for personal use and rebranded it today. - Uses shadcn design system and registry - Built on growing base-ui - Responsive, optimized components - v0 supported Check it out below 👇

preet

20,452 views • 9 months ago

Pages CMS 1.0.0 is finally (officially) out and it's running on Next.js (App Router). Thanks to Vercel, Turso, Drizzle ORM, Resend and shadcn (for the UI).
2:29

Pages CMS 1.0.0 is finally (officially) out and it's running on Next.js (App Router). Thanks to Vercel, Turso, Drizzle ORM, Resend and shadcn (for the UI).

Ronan Berder

22,699 views • 1 year ago

introducing 2 free (handmade) UI templates for you to use for your web applications built on top of shadcn ui & fully open source
0:24

introducing 2 free (handmade) UI templates for you to use for your web applications built on top of shadcn ui & fully open source

Micky

42,190 views • 1 month 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.
0:29

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

666,968 views • 3 years ago

We did it 🤯 Finally, you can see what is happening with your finances ⭐ UI needs a little bit of work, but I needed to share this with you all 🤩 ◆ Predictive Budgeting 🔮 ◆ Holdings Insight 💵 ◆ Spending Charts 📊 The open-source movement is the greatest thing I have ever been witness to ✨ Come join us 🚀 Tech-stack: Next.js Vercel Drizzle ORM Resend shadcn Tailwind CSS Supabase / Neon Postgres #buildinpublic #opensource #fintech
0:39

We did it 🤯 Finally, you can see what is happening with your finances ⭐ UI needs a little bit of work, but I needed to share this with you all 🤩 ◆ Predictive Budgeting 🔮 ◆ Holdings Insight 💵 ◆ Spending Charts 📊 The open-source movement is the greatest thing I have ever been witness to ✨ Come join us 🚀 Tech-stack: Next.js Vercel Drizzle ORM Resend shadcn Tailwind CSS Supabase / Neon Postgres #buildinpublic #opensource #fintech

CodeHagen

17,940 views • 2 years ago

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. ⬇️
0:25

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

531,717 views • 3 years ago

🚀 Ship in record time with the new Metronic! The all-in-one template kit for React Vite, Next.js, and vanilla JS - trusted by 117,000+ developers. Key Features: - 10 unique app layouts - RTL/Dark mode support - 1000+ UI elements - 40+ UI components - 120+ pages - 50+ Prebuilt UI blocks CRUDs/forms/flows - User Management app(next.js) - Store - Client concept - More concepts cooking... Tech Stack: - Tailwind CSS 4 - ReUI components - shadcn compatible - @reactjs19 with App Router - Vite ⚡ with React Router - Next.js 15.3 - Auth.js - Supabase Auth - Radix by WorkOS - TANSTACK Table & Query - Prisma Postgres ORM - PostgreSQL - Vanilla JS/TypeScript - KtUI components - Bootstrap 5 legacy version Live preview: Purchase link:
1:31

🚀 Ship in record time with the new Metronic! The all-in-one template kit for React Vite, Next.js, and vanilla JS - trusted by 117,000+ developers. Key Features: - 10 unique app layouts - RTL/Dark mode support - 1000+ UI elements - 40+ UI components - 120+ pages - 50+ Prebuilt UI blocks CRUDs/forms/flows - User Management app(next.js) - Store - Client concept - More concepts cooking... Tech Stack: - Tailwind CSS 4 - ReUI components - shadcn compatible - @reactjs19 with App Router - Vite ⚡ with React Router - Next.js 15.3 - Auth.js - Supabase Auth - Radix by WorkOS - TANSTACK Table & Query - Prisma Postgres ORM - PostgreSQL - Vanilla JS/TypeScript - KtUI components - Bootstrap 5 legacy version Live preview: Purchase link:

KeenThemes Market

12,692 views • 1 year ago

text-to-svg/icon Figma plugin built with Next.js, shadcn UI, and Tailwind CSS + Replicate API! It's open source, and I hope it helps anyone looking to build their own plugin! 🤠 Github:
0:40

text-to-svg/icon Figma plugin built with Next.js, shadcn UI, and Tailwind CSS + Replicate API! It's open source, and I hope it helps anyone looking to build their own plugin! 🤠 Github:

Lichin Lin

25,157 views • 1 year ago

Introduction HagenKit - the next OSS boilerplate ✨ And its free for everyone 🤯 Launch your new project in 2 minutes – from clicking the button to live preview ✨ Techstack: 🌐 App: Next.js ☁️ Hosting: Vercel 🎨 UI: shadcn 🗂️ ORM: Prisma 🛢️ DB: Prisma ✉️ Mail: Resend 🔒 Auth: Better Auth I wanted to make it as easy that i can for you to get started with your new project. → We make the Github-repo → We make the Database → We push this to Vercel. Hope you like it ✨
0:29

Introduction HagenKit - the next OSS boilerplate ✨ And its free for everyone 🤯 Launch your new project in 2 minutes – from clicking the button to live preview ✨ Techstack: 🌐 App: Next.js ☁️ Hosting: Vercel 🎨 UI: shadcn 🗂️ ORM: Prisma 🛢️ DB: Prisma ✉️ Mail: Resend 🔒 Auth: Better Auth I wanted to make it as easy that i can for you to get started with your new project. → We make the Github-repo → We make the Database → We push this to Vercel. Hope you like it ✨

CodeHagen

51,770 views • 7 months ago

Struggling to make your UI stand out? CSSnippets – A collection of modern, reusable UI components! ✨Ready-to-use with HTML, CSS, React & Tailwind CSS ✨No frameworks, just pure CSS ✨Clean, minimal, and beautiful 🔗 Explore now: Save it for later! 🔖
2:08

Struggling to make your UI stand out? CSSnippets – A collection of modern, reusable UI components! ✨Ready-to-use with HTML, CSS, React & Tailwind CSS ✨No frameworks, just pure CSS ✨Clean, minimal, and beautiful 🔗 Explore now: Save it for later! 🔖

Shefali

22,953 views • 1 year 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.
0:29

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,651 views • 6 months ago

Introducing Code Blocks A set of UI components & utilities to show your code beautifully. ✓ Copy-Paste. 100% free. ✓ Shiki or Sugar-High for syntax highlighter. ✓ Add components with shadcn /ui CLI. ✓ Docs built with Next.js + Base UI ✨
0:58

Introducing Code Blocks A set of UI components & utilities to show your code beautifully. ✓ Copy-Paste. 100% free. ✓ Shiki or Sugar-High for syntax highlighter. ✓ Add components with shadcn /ui CLI. ✓ Docs built with Next.js + Base UI ✨

Pablo

17,916 views • 4 months ago

if you use shadcn ui for your apps, you're gonna love these 7 ui libraries: > > > > > > > imagine spending thousands on overpriced designers to make your app sexy when you have prebuilt components like these that elevate the shadcn experience i sprinkle em in all my apps and everyone loves using it for a reason...
1:44

if you use shadcn ui for your apps, you're gonna love these 7 ui libraries: > > > > > > > imagine spending thousands on overpriced designers to make your app sexy when you have prebuilt components like these that elevate the shadcn experience i sprinkle em in all my apps and everyone loves using it for a reason...

Rexan Wong

275,716 views • 7 months ago

Introducing the open-source Next.js Audio Starter Kit Add Text to Speech, Speech to Text, Sound Effects and Conversational AI to your product in minutes. Built with: • ElevenLabs SDK • Next.js + shadcn/ui • Tailwind CSS v4 Repo link in the comments below:
1:01

Introducing the open-source Next.js Audio Starter Kit Add Text to Speech, Speech to Text, Sound Effects and Conversational AI to your product in minutes. Built with: • ElevenLabs SDK • Next.js + shadcn/ui • Tailwind CSS v4 Repo link in the comments below:

ElevenLabs Developers

145,836 views • 1 year ago

Introducing the new Svgl 🥳🎉 ❖ New design. Upgrade to Svelte 5 + Tailwind CSS v4. ❖ New API docs + extensions page. ❖ shadcn/ui support + open with v0. ❖ Copy the optimized SVG directly using SVGO. ❖ Add your SVGs to favorites and access your list whenever you want.
0:51

Introducing the new Svgl 🥳🎉 ❖ New design. Upgrade to Svelte 5 + Tailwind CSS v4. ❖ New API docs + extensions page. ❖ shadcn/ui support + open with v0. ❖ Copy the optimized SVG directly using SVGO. ❖ Add your SVGs to favorites and access your list whenever you want.

Pablo

41,634 views • 9 months ago

I created LinkNode, an open-source tool that generates one link for all your links. Inspired by Fayaz Ahmed's onelink repo. Try out : Built with Next.js, shadcn, and Tailwind CSS. #buildinpublic
0:39

I created LinkNode, an open-source tool that generates one link for all your links. Inspired by Fayaz Ahmed's onelink repo. Try out : Built with Next.js, shadcn, and Tailwind CSS. #buildinpublic

Suraj

82,110 views • 2 years ago