Effects & chrome

exaggerate

Tightens the Y-axis so small movements fill the chart height. Ideal for heart rate, temperatures, or prices that tick in tiny increments.

<LiveChart data={data} value={value} exaggerate />

Resting heart rate. Custom formatter, exaggerated Y-axis.

degen

Burst particles and a light chart shake on momentum swings — for when subtlety is not the goal.

<LiveChart data={data} value={value} degen />
<LiveChart
  data={data}
  value={value}
  degen={{ scale: 1.5, downMomentum: true }}
/>

type DegenOptions = {
  scale?: number; // particle count/size multiplier (default 1)
  downMomentum?: boolean; // particles on down swings (default false)
};

Degen mode (chart shake and particles) with momentum arrows.

pulse / fill / lineWidth

Prop	Default	Role
`pulse`	`true`	Soft glow pulse on the live tip
`fill`	`true`	Gradient under the line
`lineWidth`	`2` (via palette)	Stroke width in px

Badge

Prop	Default	Role
`badge`	`true`	Live value pill at the tip
`badgeVariant`	`"default"`	`"default"` (accent) or `"minimal"` (quiet pill)
`badgeTail`	`true`	Pointer tail toward the tip
`formatValue`	`toFixed(2)`	Badge + tooltip text

<LiveChart badgeVariant="minimal" />
<LiveChart badge={false} />

Minimal chrome recipe

<LiveChart
  data={data}
  value={value}
  badge={false}
  fill={false}
  grid={false}
  pulse={false}
  momentum={false}
  scrub={false}
  color="#94a3b8"
/>

See Just a line.