chore(shared-charts): soften the curated palette #185

Merged
julien merged 1 commits from chore/charts-palette-tuning into main 2026-05-17 23:42:08 +02:00
@@ -42,10 +42,12 @@ export type ColorScheme = 'sequential' | 'categorical';
/** /**
* Default fill colour for bars when no per-bar encoding applies. * Default fill colour for bars when no per-bar encoding applies.
* `#1d4ed8` ≈ tailwind blue-700 — high contrast against white, * Softer brand-aligned blue — AA contrast against white surfaces,
* still readable on a dark surface. * still readable on a dark surface. Curated alongside
* {@link semanticStatusColors} so the chart palette reads as one
* coherent set rather than a Tailwind grab-bag.
*/ */
export const DEFAULT_BAR_FILL = '#1d4ed8'; export const DEFAULT_BAR_FILL = '#4075e7';
/** /**
* Intent-bearing colours for the small set of statuses APF charts * Intent-bearing colours for the small set of statuses APF charts
@@ -53,14 +55,16 @@ export const DEFAULT_BAR_FILL = '#1d4ed8';
* the lib (per ADR-0023), but they can pick from this curated map * the lib (per ADR-0023), but they can pick from this curated map
* by name — keeps the colour-blind-safety guarantee while letting * by name — keeps the colour-blind-safety guarantee while letting
* the donut chart encode meaning (success = green, denied = * the donut chart encode meaning (success = green, denied =
* orange). * orange). Values are softer than the Tailwind defaults — chart
* surfaces benefit from a lower-saturation palette so adjacent
* slices/bars don't visually fight when they share a tile.
*/ */
export const semanticStatusColors = { export const semanticStatusColors = {
success: '#16a34a', // green-600 success: '#46ac6b', // muted green
warning: '#ea580c', // orange-600 warning: '#f38043', // muted orange
error: '#dc2626', // red-600 error: '#eb5252', // muted red
info: '#2563eb', // blue-600 info: '#4075e7', // muted blue (same as DEFAULT_BAR_FILL)
neutral: '#6b7280', // gray-500 neutral: '#6b7280', // gray
} as const; } as const;
export type SemanticStatus = keyof typeof semanticStatusColors; export type SemanticStatus = keyof typeof semanticStatusColors;