The Component Gallery
The Component Gallery is a collection of components from the best design systems.
About The Component Gallery
The Component Gallery is a reference site cataloging interface components drawn from examples across design systems used in the software industry. It documents 60 components (such as carousel, tree view, popover, rating, accordion, quote, pagination, and tabs) with definitions, alternate naming conventions, and 2,671 examples pulled from real design system implementations.
The site also indexes 95 design systems, listing details such as the underlying technology (e.g., React, Web Components, CSS-in-JS, Sass, Tailwind CSS), links to related resources (GitHub, Figma, Storybook), and attributes like accessibility, open source status, code examples, and usage guidelines. Design systems referenced include Polaris, Elastic UI framework, Sainsbury's Design System, Ariakit, SubZero, Web Awesome, Red Hat design system, and HeroUI.
The resource is intended for people building user interfaces who want to compare how different organizations implement common UI components. It is built with Astro using data sourced from Airtable, hosted on Cloudflare Pages, with search powered by Pagefind.
Key features
- Catalog of 60 UI components with examples from real design systems
- Over 2,671 component examples across 95 design systems
- Search functionality powered by Pagefind
- Cross-references components like accordion, carousel, tree view, and pagination by common naming variations
Frequently asked questions
What is The Component Gallery?
It is an up-to-date repository of interface components based on examples from the world of design systems, designed as a reference for anyone building user interfaces.
How many components and examples does it cover?
It covers about 60 components, 95 design systems, and 2,671 examples.
Who is this for?
It is intended for anyone building user interfaces, such as designers and developers researching component patterns.
What technology is the site built with?
It is built with Astro using data from Airtable, hosted on Cloudflare Pages, with search powered by Pagefind.
Show your product to thousands of developers
· 100k monthly pageviews
· 7k newsletter subscribers
You might also like
Sketch
Design/Prototyping/UISketch is a design toolkit built to help you create your best work — from your earliest ideas, through to final artwork.
SpeedUp AI
AI/Design/PrototypingEnd-to-End AI Circuit Schematic Design.
Templated
Editor/Design/MarketingAutomate your images and PDFs with a simple API. Generate social media visuals, banners, PDFs and more with our API and no-code integrations.
TOOOLS.design
Accessibility/Design/BlogA growing archive of 1,500+ design resources, frequently updated for the community.
UI Design Daily
Design/Inspiration/UIWeekly FREE UI resources straight to your inbox.
UI Design for Developers
Design/Learn/UILearn just enough visual design to be dangerous as a developer.
