$99 launch price

Components

Shader Bars

Pro

Customize

<ShaderBars />

Installation

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

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
<ShaderBars
  data={[
    { label: "Jan", value: 24000 },
    { label: "Feb", value: 31000 },
    { label: "Mar", value: 28500 },
  ]}
  fill="liquid"
  highlight={1}
/>

Use cases

  • Revenue by month

    A dashboard's headline chart that looks alive instead of flat.

  • Landing-page metric

    Weekly sessions or signups as a hero figure with real motion.

  • Report cover

    A yearly summary where the numbers are the artwork.

  • Comparison toggle

    Switch datasets and watch each bar travel to its new height.