Bklit Logo
Composed Chart
One time axis, one Y scale: combine SeriesBar, Line, and Area. Use the curve menu to swap the shared Line and Area interpolation.
Curve

Hero uses a Radix Select for the Line and Area `curve` prop (SeriesBar shape is unchanged). See https://visx.airbnb.tech/docs/curve.

Composed Chart — Bar + line
30 daily points with rounded SeriesBar tops (`radius`) and a smoothed revenue line

Dense time series: use default XAxis ticks (numTicks) so labels stay readable. Use tickMode="data" when you only have a few rows (e.g. one bar per month).

Composed Chart — Lime / amber / red
Fixed hex accents (tailwind lime-300, amber-300, red-500) with rounded bars

Trending up by 5.2% this month

Composed Chart — Stacked SeriesBar + line
Two stack segments per day with the same 30-day timeline; stackGap={0} for flush stacks

Trending up by 5.2% this month

Composed Chart — Grouped bars, no gap
Two SeriesBar series per day with barGap={0}; rounded tops on both bar series

Trending up by 5.2% this month

Composed Chart — Pattern fills
One SeriesBar with a fuchsia-400 diagonal pattern, one solid bar on theme colors; revenue line unchanged

Trending up by 5.2% this month

Composed Chart — Bar + two lines
Installs as daily columns (rounded) with desktop and mobile lines (30-day variation)

Trending up by 5.2% this month