$99 launch price

Components

Shader Stream

Pro

Customize

<ShaderStream />

Installation

ProRequires a Planes Pro license.
npx shadcn add @useplanes/shader-stream

Works once the @useplanes registry is set up in your project (one-time). After that, copy and run commands directly.

Unlock with Planes Pro

$99 once · 132 Pro components · lifetime updates.

I have a licenseGet Pro
<ShaderStream
  series={[
    { name: "Direct", values: [12, 18, 31, 44, 38, 22, 14] },
    { name: "Search", values: [20, 24, 29, 35, 52, 61, 48], colors: ["#000000", "#7e22ce", "#e9d5ff"] },
    { name: "Social", values: [8, 15, 27, 23, 19, 30, 41] },
  ]}
  labels={["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]}
/>

Use cases

  • Traffic by channel

    Direct, search, social and referral traffic as one river that shows how the mix shifts month to month.

  • Revenue by product line

    Launches show up as bumps that swell and settle while the whole stays readable.

  • Listening history

    Genres over a year on a music profile, each band in its own colour world.

  • Workload by team

    Tickets or deploys per team per week on an internal dashboard; a glance shows who carried a sprint.