Foundations

Icon

Spectrum 2 workflow icons on a 20px grid, filled shapes drawn in currentColor, from Adobe's open-source React Spectrum S2 set (Apache License 2.0).

Preview

Props

Guidelines

Spectrum 2 workflow icons on a 20px grid, filled shapes drawn in currentColor, from Adobe's open-source React Spectrum S2 set (Apache License 2.0).

Provide: name (one of Icon.names), optional size (default 20) and title when the icon is the only label.

• Sizes follow Spectrum: 16px in small controls and meta, 20px at M (buttons, nav, rows), 22px at L, 26px at XL and in the phone tab bar.
• Color comes from the parent: body by default, subdued for inactive nav, accent-content for the current tab, semantic *-content inside alerts.
• Use chevron-right for "see all" links and row navigation; Spectrum has no plain arrow.
• No emoji, ever. When an icon is missing, take it from the same S2 set rather than mixing libraries.