Components

Shader Index

Pro

Installation

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

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 · 90 Pro components · lifetime updates.

I have a licenseGet Pro
<ShaderIndex
  items={[
    { title: "AI Workflows", description: "Automate repetitive tasks.", icon: <Sparkles /> },
    { title: "Team Sync", description: "Keep everyone aligned.", icon: <Users />, colors: ["#4a0f8f", "#c14dff", "#f2c7ff"] },
  ]}
/>

Use cases

  • Feature index

    Five headline capabilities on a landing page, each with its own colour world.

  • Services menu

    An agency's offerings as a bold list that comes alive on hover.

  • Chapter navigation

    Sections of a long-form piece, previewed with a mood block instead of a thumbnail.