Components/Sparkline

Sparkline

Tiny dependency-free trend line for watchlists, tables, and cards - auto-colors by direction (emerald up, red down) and stays crisp at any DPI.


PETR4+4,2%
VALE3-2,8%
ITUB40,0%

Installation

npx @ajax-ui/cli add sparkline

Props

  • data - number series, oldest first (min 2 points).
  • color - stroke color; "auto" (default) picks emerald/red by whether the series ends above its start.
  • fill (default true) - soft gradient under the line.
  • width / height (default 96×28) and strokeWidth (default 1.5).
  • Pass aria-label describing the trend - the SVG carries role="img".