Strumento

Generatore di sfumature e tonalità

Un colore in ingresso. Una scala tonale completa in uscita. Interpolata percettivamente, così la striscia mantiene la stessa tonalità da un capo all'altro.

Scala tonale
Tonalità (più chiare)
Sfumature (più scure)

Tonalità, sfumature e toni

  • Tonalità — colore base + bianco. Più chiaro, spesso leggermente meno saturo. Utile per sfondi hover, stati disabilitati e superfici di livello "sottile".
  • Sfumatura — colore base + nero. Più scuro, spesso visivamente più saturo. Utile per stati hover su sfondi chiari, pulsanti premuti e testo ad alto risalto.
  • Tono — colore base + grigio. Stessa luminosità, meno saturazione. Non generato qui; utile soprattutto per stati UI "smorzati".

L'interpolazione avviene nello spazio OKLab invece che RGB, così la tonalità resta percettivamente costante lungo la striscia — un blu rimane riconoscibilmente blu attraverso tutte le sue tonalità, invece di derivare attraverso mezzitoni rosati come fanno le scale interpolate in RGB.