Components / Component reference
The Component Gallery
Compare several real implementations of the same interaction.
Understand the resource
What it is.
The Component Gallery organizes examples from published design systems by component type. It helps expose naming, structure and behavior choices before a team commits to one implementation.
When it is useful
You need to decide whether a pattern should be a popover, tooltip, disclosure or dialog.
A proposed application
Put it to work.
This example illustrates a possible use. The proposed workflow and expected result are separate from the bounded checks recorded below.
Try this
Compare three disclosure patterns, note their keyboard expectations, and write a specification for your own content.
Result to aim for
A reasoned component choice with source references.
Before you start
What you need.
- A specific interaction question and access to the linked system documentation.
The practical boundaries
What to watch for.
- Links to implementations do not transfer their licenses or validate every example.
- A screenshot hides focus, announcements and error states; inspect the original system before adopting behavior.
Review record
What we could establish.
- Public primary documentation and the bounded account-free checks below were reviewed. The public search returned a visible accordion reference after entering the query. This evaluates browsing the reference collection, not the linked design systems.
The source-review notes describe documentation and identity. The account-free evaluation below records exactly which public interaction or local fixture was checked, what happened, and what remains untested.
Check current access, terms, licensing and data handling before using a resource with your own material.
Runtime and security evaluation
What the evaluation covers.
The public search returned a visible accordion reference after entering the query. This evaluates browsing the reference collection, not the linked design systems.
Methods: Public HTTP response · Public browser sample. A completed check covers the stated sample; it is not a safety certification.
- Target
- https://component.gallery/
- Version or capture
- Unversioned public page checked 2026-10-19
- Integrity scope
- sha256:09e360a9b5be2c0dd39bc4c823e97b700b0f1f7da065a4ffa556ad279c54d421
Test conditions
- Chromium 155.0.8059.82 on Windows; fresh temporary profile and fresh account-free contexts.
- Public HTTPS GET/HEAD requests only; telemetry/auth routes and WebSockets blocked. No account storage or credential environment variables.
Individual checks and observations
Public document and DOM
passPublic browser sample: Fresh Chromium GET, then inspect rendered controls after hydration delay
Observed: HTTP 200; 6 captured button labels; 1 inputs; 0 canvases.
Component reference search
passPublic browser sample: Open search, enter accordion and inspect rendered results
Observed: 1 visible accordion result links after search.
Security findings and boundaries
Passive inspection of the public response headers, requested hosts and the named browser sample. No active exploitation, authenticated permissions test or complete security audit.
Practical advice · caution
References cross implementation boundaries
A gallery result can point to a different publisher, codebase and set of terms. A successful search is not evidence that those implementations share an accessibility or security standard.
Practical caveats
- Use a reference to compare behavior, then inspect the chosen system and its own documentation.
- Pin and recheck the selected version or sample before adoption; the observations apply only to the scope and date shown.
What remains untested
- Only one public search was exercised; linked components were not installed or audited.
- Fresh-browser restrictions can affect external assets and hydration. Initial failed selectors and limited probes remain in the evidence; they are not blanket product failures.
Security limits
- No authenticated workspace, private content, production backend permissions or data-retention verification.
- Only one public search was exercised; linked components were not installed or audited.
Evaluation sources
Follow the evidence
Sources and further reading.
Keep exploring