Installation

Install the package with your preferred package manager:

# pnpm
pnpm add crumbie

# npm
npm install crumbie

Or copy the source from this repository into components/crumbie — the components are designed to be owned by your project.

Wrap your app with CrumbieProvider and render the banner + settings once at the root:

import {
  CrumbieProvider,
  CookieBanner,
  CookieSettings,
  CookieSettingsButton,
} from "crumbie"

export default function RootLayout({ children }) {
  return (
    <CrumbieProvider>
      {children}
      <CookieBanner />
      <CookieSettings />
      <CookieSettingsButton />
    </CrumbieProvider>
  )
}

Crumbie expects React 19+, and uses Tailwind CSS for styling.

pnpm add react react-dom
pnpm add -D tailwindcss

All interactive components are client components. The provider is SSR safe — consent is only read from localStorage after hydration, so you avoid hydration mismatches.