Preview image. Unlock full-res
A color system specification showing four named colors with their tint and shade ramps down to percentages, rendered as stacked horizontal strips.
Summary
A structured color specification grid showing four branded colors plus variations at percentages, with RGB hex values labeled for each swatch.
Visual description
A two-section horizontal layout on black background. Left section displays four vertical color stacks: petrol green, smoked beige, energising red, and black, each with 5-6 tinted or shaded variants descending in value from 75% to 25%. Right section shows three grayscale neutrals: steel, light gray, and white, with the same percentage-based variation grid. Every swatch is labeled with RGB hex codes and percentage values aligned below.
Key takeaway
The color specification method itself: a systematic tint/shade ramp keyed to percentages and hex values, making it reproducible across applications and platforms. The side-by-side color and neutral organization clarifies accent versus background palette roles. Labeling every swatch removes ambiguity in handoff.
Reuse notes
Essential reference for brand teams or design systems needing to document their palette precisely. Works particularly well for corporate or technical brands. The percentage-based system is easier for developers and QA to implement than relative brightness adjustments. Black background makes every swatch visible and vibrant.
