Theming lab

The components read every colour and radius from --cc-* custom properties. Pick an accent and a radius, then copy the CSS into your app.

Accent
DesignEngineeringResearch
SoloTeam
NotificationsRemember me
Heads upAlerts keep their own status colours.
CancelSave draftPublish
BoardListTimeline

Your theme

The tokens' stylesheet sits in a CSS cascade layer, so a plain :root rule always wins.

Apply it

Paste the rule into any stylesheet that loads after the components. Scope it to a selector instead of :root to theme one part of a page.

.marketing {
  --cc-accent-main: var(--cc-palette-purple-600);
  --cc-radius: 12px;
}