zero·style

Dictionary entry

elevation overlay

View related-term graphUse in a brief
Was this helpful?
UI / UXCurated · verified

A thin, semi-transparent light film laid over a dark-theme surface so that panels which sit 'higher' look slightly lighter, signalling depth without relying on shadows.

Synonyms

  • elevation tint

Related terms

In plain words

  • the way raised panels get a little lighter in dark mode to look closer to you

Usage example

Menus use a stronger elevation overlay so they read as floating above the page.

Don't confuse with…

  • drop shadowShadows show elevation on light backgrounds; an elevation overlay lightens the surface itself, which reads better on dark backgrounds.

Categories

  • Color

Related-term graph

Two hops from elevation overlay — click a term to open its entry, or re-center the graph on it

Directly related

Two hops away

  • Relatedelevation overlay related of drop shadow
  • Relatedelevation overlay related of neumorphism
  • Relatedelevation overlay related of surface color
  • Relateddrop shadow related of bevel and emboss
  • Relatedneumorphism related of bevel and emboss
  • Relatedsurface color related of card
  • Relatedsurface color related of color token
  • Relatedneumorphism related of drop shadow
  • Relateddrop shadow related of elevation
  • Relatedsurface color related of elevation overlay
  • Relatedneumorphism related of glassmorphism
  • Relateddrop shadow related of inner shadow
  • Relatedneumorphism related of inner shadow
  • Relateddrop shadow related of long shadow
  • Relatedsurface color related of panel

Stop describing. Start naming.

Turn a plain-language description into a designer-ready brief in minutes.

Start a brief