# The Component Gallery

> An up-to-date repository of interface components based on real-world design systems, serving as a reference for anyone building user interfaces.

The Component Gallery is a curated, searchable collection of interface components drawn from real-world design systems across the web. Created by front-end developer Iain Bean, it catalogs 60 components across 95 design systems with 2,676 examples, helping developers and designers solve common UI problems without reinventing the wheel. It serves as both a naming reference and an inspiration source for anyone building component-based user interfaces.

- **Component Catalog**: *Browse 60 documented UI components — from Accordion and Tabs to Carousel and Tree View — each with real-world examples from multiple design systems.*
- **Design System Directory**: *Explore 95 design systems including Elastic UI, Ariakit, HeroUI, and more, filterable by tech stack (React, Vue, Web Components) and features (accessibility, open source, code examples).*
- **Cross-System Examples**: *View 2,676 examples showing how different organizations implement the same component, making it easy to compare approaches and naming conventions.*
- **Search Functionality**: *Use the built-in search (powered by Pagefind) to quickly find components or design systems by name or keyword.*
- **Naming Reference**: *Discover alternative names and aliases for components (e.g., Accordion is also called Collapse, Disclosure, Expander) to align terminology across teams.*
- **Contribute**: *Submit new design systems or components via the Contribute page to help keep the gallery up to date.*
- **Free to Use**: *The Component Gallery is a free, publicly accessible resource with no account required — just visit the site and start exploring.*

## Features
- 60 documented UI components
- 95 design systems cataloged
- 2,676 real-world examples
- Component naming reference with aliases
- Design system filtering by tech stack and features
- Full-text search powered by Pagefind
- Community contribution support
- Changelog tracking

## Integrations
Airtable, Astro, Netlify, Pagefind, Tailwind CSS

## Platforms
WEB, JETBRAINS_PLUGIN

## Pricing
Free

## Links
- Website: https://component.gallery
- Documentation: https://component.gallery/about/
- EveryDev.ai: https://www.everydev.ai/tools/the-component-gallery