Minimal Setup

You can have a working consent banner on any website in under 5 minutes. No backend, no database, no build tool required if you prefer CDN. This guide walks you through the fastest path to a live banner and explains what each step does.

Step 1 — Install the package

Choose the installation method that fits your project. All three produce the same widget — the only difference is how it gets to the browser.

npm install @consenti/ui

Step 2 — Instantiate the widget

Import ConsentiSetupand call it with a compliance type. The simplest possible setup auto-detects the visitor's region from their browser timezone and language, then shows the right banner automatically.

import { ConsentiSetup } from '@consenti/ui'

// Auto-detects region from browser timezone + language
const widget = new ConsentiSetup({})

// Or pin a specific regulation — GDPR for all visitors
const widget = new ConsentiSetup({ compliance: { type: 'opt-in' } })

On first visit, a banner appears at the bottom of the screen. The visitor accepts, rejects, or customises. On every subsequent visit, Consenti reads the stored cookie and the banner stays hidden.

What just happened?

When you call new ConsentiSetup(), the widget:

1. Checks whether a consent cookie already exists for this visitor.
2. If no cookie exists, determines which compliance profile to load (geo-resolved or fixed).
3. Downloads only the relevant profile chunk — typically a few KB.
4. Injects the banner DOM into the page.
5. Waits for the visitor to interact, then writes the consent cookie.

Next steps

Now that the banner is live, you probably want to react to consent decisions in your own code:

widget.on('consentSubmitted', (data) => {
  if (data.consent.analytics === 'granted') {
    initAnalytics()
  }
})

For a full picture of the consent lifecycle — from first visit to cookie expiry — read How Consent Flow Works.

Frequently asked questions