$99 launch price

Components

Dither Bar List

Pro
  • /pricing0
  • /docs0
  • /blog/launch0
  • /0
  • /changelog0
  • /docs/install0
  • /about0

Customize

<DitherBarList max={7} />

Installation

ProRequires a Planes Pro license.
npx shadcn add @useplanes/dither-bar-list

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
<DitherBarList
  items={[
    { label: "/pricing", value: 48200, href: "/pricing" },
    { label: "/docs", value: 36900, href: "/docs" },
    { label: "/blog/launch", value: 29400 },
  ]}
  showPercent
  max={5}
/>

Use cases

  • Top pages

    The analytics classic: paths ranked by views with the share of traffic beside each.

  • Top countries

    Where the audience is, capped at ten with the long tail folded into one line.

  • Top customers

    Revenue by account for a sales dashboard, rows linking into each account.

  • Referrers

    Traffic sources ranked at a glance in a sidebar card.