Build Better InterfacesFree
Building for the web has never been easier. Creating something memorable still takes care. Opensource UI is a copy-paste library of thoughtfully crafted, production-ready components — pick one, drop the code in, and ship interfaces that feel polished, intentional, and worth sharing. MIT licensed — free for personal and commercial use.
Obsessively Detailed. Effortlessly Beautiful.
Designed with precision, from the frame curves to the smallest hardware details, so your apps and websites look as polished as the products they deserve.
Premium Finishes,Endless Possibilities.
Choose from beautifully crafted color variants like Titanium, Space Gray, and more. Every finish is meticulously designed with realistic materials, accurate hardware details, and pixel-perfect precision to make every presentation feel premium.
Designed to Blend In. Built to Stand Out.
Wrap your UI in light, dark, or transparent browser chrome. Pick a theme, drop in your screenshot, and present web work that feels finished before you ship.
Draw attention where it matters most with clean, customizable annotations. Add arrows, labels, and callouts to explain features, document interfaces, and create presentations that communicate with clarity and confidence.
view more annotationsDesigned to Keep Time in Style.
Explore carefully designed clock variants that balance functionality, elegance, and customization for any project.
Clock
--:--
Clock
--:--
Clock
--:--
Interactive Components That Feel Alive.
Polished widgets inspired by modern design systems, built with smooth interactions and thoughtful details that users notice.
view more widgetsWriting That Feels Natural.
Designed to feel like a real writing space, complete with a notebook layout, live word count, save indicators, and an experience that encourages focused writing.
Morning pages
Saturday, Jun 6
How They're Crafted.
Built on the stack you already trust — React and Next.js for components that fit your app, TypeScript for props you can rely on, Tailwind CSS v4 for styling that stays in your codebase, and Lucide for icons. Every file is production-ready, readable, and yours to own.
A Developer Experience You'll Love.
Search for a component, open it, and everything is right there — preview up top, details and code below. No digging, no extra steps. Copy and paste into your project when you're ready — MIT licensed, free for personal and commercial use. No install, no lock-in.
Annotation Text
export function Card() {
return <div />;What People Are Saying.
Real feedback from Product Hunt and Twitter — on cohesion, spacing, typography, and how easy the components are to drop into real projects.
The way each component feels cohesive without being overly uniform is genuinely impressive. Spacing, type, and interaction details across 33 categories usually fall apart at scale, but this holds together with real care.
Niyazi Gözkenç
Product Hunt
The attention to detail in each component really shows, especially how the spacing and typography stay consistent across so many categories. Feels like a curated set rather than a dump of files.
Boran
Product HuntReally clean set of components, the spacing and typography choices feel consistent across categories which is rare for an open source library. Easy to drop in and tweak.
Hacer
Product Huntpretty cool collection mate! upvoted
Saïd Aitmbarek
The founder of MicrolaunchResources & Sponsors.
Tools, people, and services that power Opensource UI — plus a spot for sponsors who want to support the project.
Sponsors
Resources
Anthropic / For AI models
Anthropic/For AI modelsanthropic.comCanva / For designing
Canva/For designingcanva.com
Cursor / For Editor
Cursor/For Editorcursor.com- D
Dither.it / For making images better
Dither.it/For making images betterditherit.com 
Flaticon / For image PNGs
Flaticon/For image PNGsflaticon.com
Hostinger / For managing the domain
Hostinger/For managing the domainhostinger.comLucide / For icons
Lucide/For iconslucide.devNext.js / For building web applications
Next.js/For building web applicationsnextjs.org
PostHog / For tracking
PostHog/For trackingposthog.comProduct Hunt / For promoting
Product Hunt/For promotingproducthunt.comshadcn/ui / For UI
shadcn/ui/For UIui.shadcn.comTailwind CSS / For styling
Tailwind CSS/For stylingtailwindcss.comTypeScript / For type safety
TypeScript/For type safetytypescriptlang.orgUnplash / For background images
Unplash/For background imagesunsplash.comVercel / For deploying
Vercel/For deployingvercel.com