c15t

c15t is the open standard for cookie banners. It's an open-source cookie consent manager and consent management platform (CMP) for JavaScript. You get a GDPR cookie banner, a preference dialog, and consent-gated scripts for React, Next.js, Vue, Nuxt, Svelte, Astro, TanStack Start, and plain HTML. Google Consent Mode v2 works through @c15t/integrations, and IAB TCF through an optional add-on.

c15t is used by 2,100+ sites, including expo.dev, zed.dev, unkey.dev, mintlify.com, and sazabi.com.

Docs · Sign up for Inth · Discord

Why c15t

• Consent lives in your code. The banner ships in your bundle and renders with your app, not from a third-party snippet that loads after your page.
• Analytics, ads, and pixels follow each visitor's choice. Ready-made loaders cover 40+ vendors, such as Google Tag Manager, GA4, Meta Pixel, and PostHog.
• One setup for every region. Policies decide who sees a banner: opt-in for visitors in the EU, opt-out for some US states, or rules that you write.
• Server-rendered pages can ship the banner in the first HTML. Next.js, Nuxt, Astro, TanStack Start, and SvelteKit resolve each visitor's policy on the server, so the banner does not wait for a request from the browser.
• Standards built in: Google Consent Mode v2, IAB TCF 2.4, IAB GPP, and Global Privacy Control.
• Your design or ours. Use the prebuilt components with a theme system, or build your own UI on headless hooks and composables.
• Consent records with no server to run. Inth stores each choice with its region and policy version, and gives you a dashboard to manage policies.

Get started

The fastest way to set up c15t, for you or your coding agent:

npx @inth/cli c15t

The Inth CLI signs you in to Inth, creates or picks a project, and sets up c15t in your app. Then pick how. A coding agent fits c15t to your layout and moves your analytics behind consent. inth c15t scaffold writes your framework's quickstart files instead. Add --claude, --codex, --cursor, or --grok to go straight to that agent.

Supported Frameworks

Framework	Install	Import from	Quickstart
React 18 and 19 (Vite, React Router)	c15t	c15t/react	React
Next.js 15 and 16 (App Router, Pages Router)	c15t	c15t/next	Next.js
Vue 3	c15t	c15t/vue/vue-plugin	Vue
Nuxt 3 and 4	c15t	c15t/vue (Nuxt module)	Nuxt
Astro 5, 6, and 7	c15t	c15t/astro	Astro
TanStack Start	c15t	c15t/tanstack-start	TanStack Start
Svelte 5 and SvelteKit	c15t	c15t/svelte	Svelte, SvelteKit
JavaScript, headless	c15t	c15t, c15t/runtime	Headless runtime
Script tag, no build step (Webflow, WordPress, Framer, Squarespace)	@c15t/browser	<script> from a CDN	HTML

Run c15t on Inth

c15t needs a backend to serve policies and keep consent records. Inth runs it for you, and adds the tools you need once someone asks you to prove consent:

• Consent records. Every choice is stored with its region and policy version, so you can show what each visitor agreed to.
• Website audit. Catches scripts and vendors that appear on your live site.
• Code audit. Checks each pull request for privacy risk.
• Policy packs. Managed consent rules for each region on Pro and above, so a new privacy law doesn't mean a redeploy.
• Inth Agent. Ask what changed and follow the answer to its source.

You don't run the consent database, geo lookups, uptime, or upgrades. Inth's SOC 2 Type 2 report answers procurement questions.

Sign-up is free. Run npx @inth/cli c15t to create a project and set up c15t, or create one by hand and copy its backend URL. See pricing.

For development and tests, local mode keeps choices in the browser and keeps no consent records. Don't ship it to production. Its factory is local(). The old name, offline(), still works and goes away in v4.

Manual setup

A Next.js App Router app with the prebuilt banner, the preference dialog, and PostHog held until the visitor allows measurement. Install c15t and the vendor loaders:

pnpm add c15t @c15t/integrations

Create an Inth project and set NEXT_PUBLIC_C15T_BACKEND_URL to its backend URL in .env.local. Then add three files:

// next.config.ts
import { withConsentManifest } from 'c15t/next/build'
import type { NextConfig } from 'next'

const nextConfig = {} satisfies NextConfig

// Downloads your policy at build time and finds c15t.config.ts
export default withConsentManifest(nextConfig)

// c15t.config.ts
import { posthog } from '@c15t/integrations/posthog'
import { defineConsentConfig } from 'c15t/next'

export default defineConsentConfig({
  scripts: [
    posthog({
      id: 'phc_your_project_key',
      initOptions: { cookieless_mode: 'never' },
      loadMode: 'after-consent',
    }),
  ],
})

This is the beginning of the README. Read the rest at the original. Read the full README ↗