A grayscale color palette is best to stand out in:
- Photography
- Texts

Arizona State University

University of Michigan - Ann Arbor

Increasing the color contrast between a surface or element and its surroundings makes that element more visually prominent, helping communicate hierarchy and draw attention. This emphasis can be created through contrasting adjacent surfaces, combining changes in color and shape, limiting color elsewhere, or using contrast to distinguish text.

Surface Contrast Creates Visual Emphasis

To draw attention to important elements, use strong color contrast between them. For example, a purple background contrasting sharply with a white surface emphasizes the list of item choices—the main focus of this travel app screen.

Surface Contrast Between Elements

By limiting the use of color in your app, the areas that do receive color gain more attention, including:
- Text
- Images
- Individual elements like buttons

i.e. Because the content of this product is multicolored, a black floating action button contrasts greatly with the bright colors, making it more visible.

Limiting Color in Surface Contrast 


Visual emphasis is given to an element that changes both color and shape at the same time.
- Use this kind of emphasis to indicate something has been selected or requires immediate attention. 
- E.g. The chips with curved, pink left corners indicate they have been selected by the user.

Learn Before

Related