Sparklinedata-display

Dependency-free inline SVG line, area or bar chart for small series with an accessible min, max and latest summary.

설치

pnpm

pnpm dlx shadcn@4.23.0 add @uikit/sparkline

의존 아이템locale style

Default

sparkline-demo.tsx

import { Sparkline } from "@/components/ui/sparkline";
export default function SparklineDemo() {  const series = [3, 5, 4, 8, 6, 9, 12, 10];  return (    <div className="flex flex-wrap items-center gap-6">      <Sparkline values={series} />      <Sparkline values={series} type="area" />      <Sparkline values={series} type="bar" />    </div>  );}