Docusign color usage and ratios

Docusign color usage and ratios, editorial, minimal, vibrant

Preview image. Unlock full-res

Color balance page using a grid of pie charts to show recommended 2-, 3-, and 4-color weighting ratios across the palette.

Elementschart, image
Palette
#4C00FF
#130032
#FF5252
#CBC2FF

Summary

A color-ratio page that uses a matrix of pie charts to prescribe how the palette should be weighted in 2-, 3-, and 4-color compositions.

Visual description

Two-column layout, heading "Usage and Ratios" over copy on weighting the palette for light- and dark-theme designs, plus a "Note" that Poppy is used as a stroke/accent rather than a fill. The right side is a 4-column grid of pie charts in three labeled rows, "2-color balance", "3-color balance", and "4-color balance". Each pie shows a recommended proportional split of the palette colors (white/ecru grounds, cobalt and deep-violet/inkwell majorities, small poppy slivers as accent), the slices growing more subdivided as the row count increases. The charts read as approved mixing ratios, not data.

Key takeaway

Using pie charts as prescriptive ratio diagrams, one row per color-count, to turn "use Cobalt as an accent, not a flood" into a visual proportion an implementer can eyeball. The tiny Poppy slivers make the "exclamation mark" accent rule literal.

Reuse notes

A smart page for brands that struggle with overuse of a loud primary or accent. Reuse the ratio-pie matrix to set proportions for any palette. Keep the accent slices visibly small so the intended restraint is obvious. Pairs with the color-combinations pages that follow.

From this deck: Docusign color usage and ratios

View deck

More like this