ColorScale

A gradient legend for continuous colour scales: caption, low/high (and optional mid) labels, sequential or diverging palette, horizontal or vertical.

@ruckc/truss-chart Charts

Import

import { ColorScale } from '@ruckc/truss-chart';
import '@ruckc/truss-chart/charts.css'; // series palette

palette

vertical

mid

caption

label

Prop	Type	Default	Description
`low` required	`string`	—	Label at the low end, e.g. `0%`.
`high` required	`string`	—	Label at the high end, e.g. `40+%`.
`mid`	`string`	—	Optional label at the midpoint (the neutral stop of a diverging scale).
`caption`	`string`	—	Visible caption above the bar (horizontal) or beside it (vertical).
`label`	`string`	—	Accessible name. Defaults to "caption: low to high", e.g. "Error rate: 0% to 40+%".
`palette`	`ScaleKind`	`'sequential'`	Which palette ramp to draw; match the ramp your marks use.
`vertical`	`boolean`	`false`	Bar runs bottom (low) to top (high) instead of left to right.
`size`	`number`	`200`	Bar length in px.