Neutral Colors — Brand Neutrals

BAUER GROUP defines four brand neutrals as fixed reference points. They are derived from the Warm Gray Scale and form the cornerstones for background, text, and surface design.

Brand Neutrals

Brand White

#FFFFFF

Brand Light

#F9F8F6

Brand Dark

#3A3430

Brand Black

#231F1C

Specification

Name	HEX	OKLCH	RGB	CMYK	Warm Gray step
Brand White	#FFFFFF	oklch(100% 0 0)	255, 255, 255	C0 M0 Y0 K0	—
Brand Light	#F9F8F6	oklch(98% 0.005 50)	249, 248, 246	C0 M0 Y1 K2	Warm 50
Brand Dark	#3A3430	oklch(30% 0.011 50)	58, 52, 48	C0 M8 Y13 K77	Warm 800
Brand Black	#231F1C	oklch(20% 0.009 50)	35, 31, 28	C0 M9 Y14 K86	Warm 900

Mapping to the Warm Gray scale

The brand neutrals are direct reference points from the Warm Gray scale — no mapping distance, unlike systems with separate neutrals.

Brand Light #F9F8F6

= Warm 50 #F9F8F6

Brand Dark #3A3430

= Warm 800 #3A3430

Brand Black #231F1C

= Warm 900 #231F1C

Which system, when?

• Brand neutrals for official brand materials, print, marketing assets — the four fixed reference values
• Warm Gray scale for digital interfaces where fine-grained steps (50–900) with a warm undertone are needed
• Neutral Gray scale for print rasters, technical elements, and factual presentations without color undertone — see Color Scales → Neutral Gray

Accessibility

Combination	Contrast	WCAG	Status
Brand Black on Brand White	~16.6:1	AAA	AAA
Brand Black on Brand Light	~16.1:1	AAA	AAA
Brand White on Brand Dark	~12.3:1	AAA	AAA
Brand White on Brand Black	~16.6:1	AAA	AAA
Orange on Brand Black	~6.8:1	AA	AA
Orange on Brand Dark	~5.0:1	AA	AA

Application examples

Section transitions

Primary content

Brand White (#FFFFFF) as the standard background

Secondary section

Brand Light (#F9F8F6) — warm background for visual separation

Dark section

Brand Dark (#3A3430) for contrast and depth

Footer area

Brand Black (#231F1C) for deep regions

Complete brand color palette

White

Light

Orange

Dark

Black

Print & production

Name	CMYK	Pantone (closest)
Brand White	C0 M0 Y0 K0	—
Brand Light	C0 M0 Y1 K2	—
Brand Dark	C0 M8 Y13 K77	PMS 411 C
Brand Black	C0 M9 Y14 K86	PMS Black 7 C

Print note

Brand Dark and Brand Black are not pure black (K100) — they intentionally carry a warm undertone (M+Y > 0). For deep black on large surfaces, use rich black C40 M30 Y20 K100.

CSS Custom Properties

:root {
  /* HEX — print authority, tooling fallback */
  --brand-white: #FFFFFF;
  --brand-light: #F9F8F6;  /* = Warm 50 */
  --brand-dark:  #3A3430;  /* = Warm 800 */
  --brand-black: #231F1C;  /* = Warm 900 */

  /* OKLCH — web/display authority */
  --brand-white-oklch: oklch(100% 0 0);
  --brand-light-oklch: oklch(98% 0.005 50);
  --brand-dark-oklch:  oklch(30% 0.011 50);
  --brand-black-oklch: oklch(20% 0.009 50);
}

Aliases on Warm Gray

--brand-light, --brand-dark, and --brand-black are semantic aliases on top of the Warm Gray scale. To work directly with scale tokens instead, use the warm-token variants — see Semantic Aliases.