Skip to content

Themes

A theme is an accent ramp and a neutral ramp. The semantic colors refer to the palette by step, so swapping the two ramps recolors everything. Every theme passes every contrast check, because each step has the same relative luminance as the same step of indigo.

Apply one with xds theme <name> in a project, or mise run theme <name> in this repository.

The default. An indigo accent on cool grey neutrals.

LightSecondary textA linkPrimary
DarkSecondary textA linkPrimary

Accent

Neutral

A deep green accent on sage neutrals.

LightSecondary textA linkPrimary
DarkSecondary textA linkPrimary

Accent

Neutral

A clear blue accent on slate neutrals.

LightSecondary textA linkPrimary
DarkSecondary textA linkPrimary

Accent

Neutral

A magenta accent on mauve neutrals.

LightSecondary textA linkPrimary
DarkSecondary textA linkPrimary

Accent

Neutral

A burnt orange accent on warm stone neutrals.

LightSecondary textA linkPrimary
DarkSecondary textA linkPrimary

Accent

Neutral