Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

Design Systems Database Massive collection of best-in-class design systems with visual styles, components and references from leading UI teams.

101babich's profile picture

Nick Babich

24,262 subscribers

221,415 Aufrufe • vor 2 Jahren •via X (Twitter)

Wissenschaft & Technologie
LIVE

Anya Rossi• Live Now

Private livecam show

0 Kommentare

Keine Kommentare verfügbar

Kommentare vom Original-Post werden hier angezeigt

Ähnliche Videos

UI design checklist A massive collection of the best practices for everything related to UI design—components, pages, user flows and branding. 🖋️ by George Hatzis
0:10

UI design checklist A massive collection of the best practices for everything related to UI design—components, pages, user flows and branding. 🖋️ by George Hatzis

Nick Babich

71,556 Aufrufe • vor 2 Jahren

Mobile design UI components Line design system is an excellent collection of UI components for mobile apps—from action buttons to pulldown menus. Every component features anatomy, states & behavior, and design dos and donts.
0:16

Mobile design UI components Line design system is an excellent collection of UI components for mobile apps—from action buttons to pulldown menus. Every component features anatomy, states & behavior, and design dos and donts.

Nick Babich

266,750 Aufrufe • vor 2 Jahren

UI design reference library Mobbin is a massive collection of best-in-class mobile & web app designs like YouTube, Instagram and Apple Music. It helps to streamline product research and design process.
0:14

UI design reference library Mobbin is a massive collection of best-in-class mobile & web app designs like YouTube, Instagram and Apple Music. It helps to streamline product research and design process.

Nick Babich

56,067 Aufrufe • vor 2 Jahren

Open Design System Repository Discover 40+ open design systems that come with UI kits for Figma.
0:11

Open Design System Repository Discover 40+ open design systems that come with UI kits for Figma.

Nick Babich

40,160 Aufrufe • vor 2 Jahren

Introducing support for Design Systems in Bolt Now Bolt uses your actual design system components, not some mimic Here’s how to stop building from scratch and start building on-brand: 👇
0:12

Introducing support for Design Systems in Bolt Now Bolt uses your actual design system components, not some mimic Here’s how to stop building from scratch and start building on-brand: 👇

bolt.new

66,917 Aufrufe • vor 1 Jahr

📐Design Systems and DESIGN.md Consistency using Design Systems and DESIGN.md: ✨ Every new design automatically starts with a cohesive design system which GREATLY improves consistency (we heard you!) ✨ Edit the system, and all associated screens can be easily updated ✨ You can extract a design system from any URL ✨ Use DESIGN.md to export your design rules or import your design rules from other products (just ask your agent to create you a DESIGN.md file from your code or other context) ✨ You can start a new design by choosing from popular design systems ✨ Read more about DESIGN.md in the docs (link in thread)
0:15

📐Design Systems and DESIGN.md Consistency using Design Systems and DESIGN.md: ✨ Every new design automatically starts with a cohesive design system which GREATLY improves consistency (we heard you!) ✨ Edit the system, and all associated screens can be easily updated ✨ You can extract a design system from any URL ✨ Use DESIGN.md to export your design rules or import your design rules from other products (just ask your agent to create you a DESIGN.md file from your code or other context) ✨ You can start a new design by choosing from popular design systems ✨ Read more about DESIGN.md in the docs (link in thread)

Stitch by Google

219,245 Aufrufe • vor 4 Monaten

We finally have a "Figma for AI agents." It's called Awesome-design-md. A curated collection of UI systems extracted from 50+ top websites, formatted specifically for coding agents. Instead of parsing screenshots or messy design files, you drop a DESIGN.md straight into your project. It upgrades your AI's UI skills instantly. > Unlocks 50+ elite design systems: Cursor, Vercel, Stripe, Spotify, SpaceX, and more > Structured into 9 clear sections: typography, spacing, elevation, rules > Includes light/dark previews for quick visual checks > Uses Google Stitch's native plain-text format for LLMs Every file also comes with an Agent Guide, ready-to-use prompts included. 100% Free. Open Source.
0:11

We finally have a "Figma for AI agents." It's called Awesome-design-md. A curated collection of UI systems extracted from 50+ top websites, formatted specifically for coding agents. Instead of parsing screenshots or messy design files, you drop a DESIGN.md straight into your project. It upgrades your AI's UI skills instantly. > Unlocks 50+ elite design systems: Cursor, Vercel, Stripe, Spotify, SpaceX, and more > Structured into 9 clear sections: typography, spacing, elevation, rules > Includes light/dark previews for quick visual checks > Uses Google Stitch's native plain-text format for LLMs Every file also comes with an Agent Guide, ready-to-use prompts included. 100% Free. Open Source.

Simplifying AI

12,824 Aufrufe • vor 14 Tagen

just updated ui-skills: It's now a collection of the best skills for design engineering
0:12

just updated ui-skills: It's now a collection of the best skills for design engineering

Ibelick

67,982 Aufrufe • vor 3 Monaten

Found a website with 2,000+ hand-picked tools and resources for designers. It has everything from design inspiration, UI resources, mockups, icons, AI tools, no-code tools, design systems, productivity tools, and more. Really useful when you don’t want to waste hours searching across different sites. Save it for later
0:15

Found a website with 2,000+ hand-picked tools and resources for designers. It has everything from design inspiration, UI resources, mockups, icons, AI tools, no-code tools, design systems, productivity tools, and more. Really useful when you don’t want to waste hours searching across different sites. Save it for later

𝐍𝐨𝐚𝐡

16,204 Aufrufe • vor 1 Monat

Checklist Design A collection of 50 checklists for UI components, pages and user flows. Each checklist helps you to consider the different states of a component and scenarios when you take a user from A to B. 🖊️ by George Hatzis
0:13

Checklist Design A collection of 50 checklists for UI components, pages and user flows. Each checklist helps you to consider the different states of a component and scenarios when you take a user from A to B. 🖊️ by George Hatzis

Nick Babich

78,544 Aufrufe • vor 2 Jahren

I’m excited to share HOF Studio’s new home. we’re the crypto-native design partner of some of crypto’s best. we help startups launch faster with branding, decks, product UI/UX, and web design. fast, strategic, and effective design
0:10

I’m excited to share HOF Studio’s new home. we’re the crypto-native design partner of some of crypto’s best. we help startups launch faster with branding, decks, product UI/UX, and web design. fast, strategic, and effective design

xyz man - HOF

239,140 Aufrufe • vor 1 Jahr

Open Design 0.8.0 turns assets, systems, prototypes, exports, and workflows into portable plugins agents can use. From dragging things around to composing capabilities. Open Design 0.8.0 is out now.
0:15

Open Design 0.8.0 turns assets, systems, prototypes, exports, and workflows into portable plugins agents can use. From dragging things around to composing capabilities. Open Design 0.8.0 is out now.

Open Design

110,024 Aufrufe • vor 2 Monaten

Storybook MCP for React is here 🎉 Storybook MCP gives AI agents structured context from your components and design system to build better UI the first time. 🧵 ⤵
0:19

Storybook MCP for React is here 🎉 Storybook MCP gives AI agents structured context from your components and design system to build better UI the first time. 🧵 ⤵

Storybook

169,348 Aufrufe • vor 4 Monaten

Must-know open-source tools for coders and makers - open source library of 30 toggles - react gamification ui components - saas starter kit nextjs + tanstack - open source google analytics/ mixpanel alternative - design engineered data visualization components
0:14

Must-know open-source tools for coders and makers - open source library of 30 toggles - react gamification ui components - saas starter kit nextjs + tanstack - open source google analytics/ mixpanel alternative - design engineered data visualization components

Csaba Kissi

48,242 Aufrufe • vor 1 Monat

20 years of leading experience in #ponymask design and #ponyplay . Many thanks from @FuryFantasy to all our fans and followers!
0:10

Sensitive content

20 years of leading experience in #ponymask design and #ponyplay . Many thanks from @FuryFantasy to all our fans and followers!

FuryFantasy

28,014 Aufrufe • vor 2 Jahren

Get you an architect who understands MEP well enough that they make models like this as part of the design process 💪 Leaving duct layout or system design to the subs to figure out during construction leads to substandard systems and butchered design!
0:11

Get you an architect who understands MEP well enough that they make models like this as part of the design process 💪 Leaving duct layout or system design to the subs to figure out during construction leads to substandard systems and butchered design!

Marilyn Moedinger

28,358 Aufrufe • vor 9 Monaten

Go from design to Compose UI code with Gemini! ⬆️ Upload image of app UI screen ↪️ Use the prompt in the blog ↪️ Copy output into Android Studio
0:16

Go from design to Compose UI code with Gemini! ⬆️ Upload image of app UI screen ↪️ Use the prompt in the blog ↪️ Copy output into Android Studio

Android Developers

14,140 Aufrufe • vor 1 Jahr

everyone: "AI has no taste and can't design UI..." meanwhile, claude helps me in 1-2 prompts to build minimal UI components that look damn near close to an experienced designer who understands spacing, type and color.
0:19

everyone: "AI has no taste and can't design UI..." meanwhile, claude helps me in 1-2 prompts to build minimal UI components that look damn near close to an experienced designer who understands spacing, type and color.

andres

159,510 Aufrufe • vor 4 Monaten

Still can’t believe this… I built a full stock app from scratch in 3 minutes. with nothing but text prompts. no code. no design. Base44 auto-generated UI, backend, database, and deployed it. 1-person startup era is officially here:👇
0:12

Still can’t believe this… I built a full stock app from scratch in 3 minutes. with nothing but text prompts. no code. no design. Base44 auto-generated UI, backend, database, and deployed it. 1-person startup era is officially here:👇

Shruti

55,800 Aufrufe • vor 1 Jahr

Impeccable 3 natively supports crafting new design with diffusion (e.g. GPT Image 2) in harnesses that support it (e.g. Codex, Gemini w/ nano banana plugin). Impeccable now uses the best mode of operation for net-new vs iterative design: 1) completely new design: diffusion-first, then build w/ best practices for brand or product design (new in 3.0) 2) iterative design (additions/changes): design-system first, discovers your components, reads DESIGN/PRODUCT.md, goes to work. new live mode (new in 3.0) makes it extra convenient. Here's a tutorial documenting the whole workflow (incl. how I made the demo site in the video):
0:16

Impeccable 3 natively supports crafting new design with diffusion (e.g. GPT Image 2) in harnesses that support it (e.g. Codex, Gemini w/ nano banana plugin). Impeccable now uses the best mode of operation for net-new vs iterative design: 1) completely new design: diffusion-first, then build w/ best practices for brand or product design (new in 3.0) 2) iterative design (additions/changes): design-system first, discovers your components, reads DESIGN/PRODUCT.md, goes to work. new live mode (new in 3.0) makes it extra convenient. Here's a tutorial documenting the whole workflow (incl. how I made the demo site in the video):

Paul Bakaus

37,832 Aufrufe • vor 3 Monaten