Palettes and backgrounds

The nine palettes

The names stay numeric so that other themes can reuse the same classes with their own colors. Each palette defines a background, a text color, an accent and the card colors.

Class	Role	Main text	Card background
color-1	Light neutral, default	Navy	Warm paper
color-2	Dark with orange accent	White	Dark blue
color-3	Dominant orange	Navy	Warm paper
color-4	Light tinted	Navy	White
color-5	Dark monochrome	White	Dark blue
color-6	Light positive	Navy	White
color-7	Light alert	Navy	White
color-8	Dark positive	White	Dark green
color-9	Dark alert	White	Dark plum

One palette per slide. The colors below are those of the DWA theme; an organization theme replaces them with its own brand colors.

Backgrounds are chosen by the layout

You do not choose a background: the layout and composition do it for you.

Layout or composition	Background
title, callout	intro
closing	closer
toc, chart-wide	intermediate
chapter	header1, header2 or header3 depending on the palette
simple content	content or content-inverted
content cols-2	content-2col
content cols-3 to cols-6	content-right
image-text[-N]	content-right or content-inverted-right
text-image[-N]	content-left or content-inverted-left
gallery, timeline, timeline-vertical	lowerband
gallery-bento, image-fit, image-full	rightband

Background names are an internal detail of the theme. The old bg-1 to bg-15 classes are no longer part of the language.

Chapters by palette

Palettes 1 and 4 use header1 (blue); 2, 5, 6 and 8 use header2 (beige/gray); 3, 7 and 9 use header3 (purple). The palette's tint is applied on top.

Known limitation: overlaid tints

The current DWA theme applies the background in two layers:

background-image:
  linear-gradient(var(--wash), var(--wash)),
  var(--layout-art);

--wash is transparent by default, but several palettes redefine it. An orange tint over header3 visually turns the purple salmon; a pale red tint can turn it pink. You can see this in the chapters above.

The intended behavior is to keep the original colors of the chapter backgrounds. Removing the tint alone is not enough: dark palettes have white text, while some original backgrounds are light. The fix must handle background and readability together; it has not shipped yet.