An Image-Based Visual Strategy For Working With Color Contrasts During Design

Many websites do not satisfy minimum contrast requirements. One reason could be that designers must select colors through trial and error using contrast calculators. This paper presents a visual framework for working with color contrasts. The foreground and background colors are detected automatically, and views are presented to simulate how a design is viewed with different levels of reduced vision. Moreover, saturation-brightness plots are introduced to help make valid color choices. Color corrections are proposed and visualized.