$99 launch price

Components

Shader Nav

Pro

Installation

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

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

I have a licenseGet Pro
<ShaderNav
  logo={<span>Acme</span>}
  actions={<a href="/signup">Get started</a>}
  items={[
    {
      label: "Product",
      title: "Ship in seconds",
      description: "Live worldwide in seconds.",
      icon: <Rocket />,
      links: [
        { label: "Deploys", href: "/deploys", description: "Git push, live in seconds.", icon: <Rocket /> },
        { label: "Edge functions", href: "/edge", description: "Code next to every visitor.", icon: <Zap /> },
      ],
    },
    { label: "Pricing", href: "/pricing" },
  ]}
/>

Use cases

  • Marketing site header

    Product, Solutions and Developers menus, each with its own colour world.

  • Docs navigation

    Sections as menus, pages as links, the card describing the section.

  • Multi-product company

    One menu per product, the liquid flowing into each product's brand palette.