Skip to content
Type
design system
Verdict
Very useful
Licence
Conditional licence, mixedmixedFree to browse. Spectrum CSS and Spectrum Web Components are Apache-2.0 implementations; the website, brand assets and downloadable design resources have separate rights, with no blanket licence stated for them.
Agent channels
none
Pricing
free
Reviewed

← Atlas · Topics: components, color, documentation

Adobe Spectrum ​

Type
design system
Verdict
Very useful
Licence
Conditional licence, mixedmixedFree to browse. Spectrum CSS and Spectrum Web Components are Apache-2.0 implementations; the website, brand assets and downloadable design resources have separate rights, with no blanket licence stated for them.
Agent channels
none
Pricing
free
Reviewed

What it is ​

Spectrum is Adobe's design system documentation. The site brings together visual foundations, content guidance, components, patterns and resources, and links to separate CSS, React and Web Components implementations.

When to open it ​

Open it when a product needs a documented component language, or when you want to compare how a large software company connects design principles to implementation resources.

Most useful ​

  • The landing page uses a fixed left rail for search and topic navigation beside a wide reading column, with an illustrated blue hero that previews the system's color and interface vocabulary.
  • Foundation and component pages make rules discoverable through a persistent section navigation and search field.
  • The resource area links to UI kits, fonts and icons; the implementation links lead to the open-source codebases.

Using it with agents ​

No MCP, CLI, public API, agent skill or llms.txt is published on this site; the checked llms.txt path returns a not-found page. An agent can browse the foundation and component pages, then use the linked implementations when code is needed. Check the licence of the specific implementation or asset before reuse.

Watch out for ​

  • The documentation describes Adobe's own product language. Reuse the layout or component rationale without copying Adobe branding or product artwork.
  • Open-source code and downloadable design resources do not share one blanket licence. Spectrum CSS and Spectrum Web Components publish Apache-2.0; check other packages, fonts, icons and kits separately.
  • The preview Spectrum 2 link is a separate destination and may document a changing version of the system.

Reusable ideas ​

  • Keep design principles, usage guidance, component behavior and code discoverable from one consistent navigation.
  • Pair an implementation with detailed usage guidance so code examples do not carry the whole design contract.
  • Use a small number of strong brand colors in the documentation artwork, then leave the component pages calm and easy to scan.

Carbon Design System, Material Design 3