Adobe Spectrum

Adobe Spectrum / 2013– / Style / Platform Screen Languages

Adobe's cross-application design system. Under the principles Rational, Human and Focused, it changes density between desktop and mobile while keeping tool-heavy interfaces from pulling attention away from the work itself.

Neutral surfaces with vivid color reserved for selection / Icons, type and borders scaling together / Toolbars and property panels joined by fine divisions / The creative work stays stronger than the interface

Images at the source page

Dictionary entry

Best used for: Creative tools for image, video or documents where controls should recede · Moving one product between desktop and mobile with a systematic density change
Type: Use a sans that survives small labels; optimize for identifying actions, not dramatic headings.
Composition: Keep the canvas central and tools at the edges; change every element through the same density scale.
Material: Build with steps of neutral color and assign vivid color only to selection, focus and warning.
Caution: A dark panel does not make a creative tool. Mixed density scales blur the line between an action and a readout.
Further study: Rational, Human and Focused / Desktop and mobile scales / Spectrum 2 color and icon revisions

Related entries

Cite this entry

The dictionary is meant to be linked to. Take whichever form fits where you are writing.

Link: https://indexstyle.org/styles/adobe-spectrum
Markdown: [Adobe Spectrum — IndexStyle](https://indexstyle.org/styles/adobe-spectrum)
HTML: <a href="https://indexstyle.org/styles/adobe-spectrum">Adobe Spectrum — IndexStyle</a>

Back to index position