How to Set Up Microsoft Clarity Consent Mode with a Cookie Banner

What Microsoft Clarity Does and Why Consent Matters

Microsoft Clarity is a free behavioural analytics tool that records user sessions, generates heatmaps, and surfaces usability insights. It works by loading a JavaScript tag on your pages and tracking how visitors scroll, click, and move through your site.

That tracking relies on cookies. Clarity sets two first-party cookies - _clck and _clsk - to identify returning visitors and stitch page views into sessions. It can also set third-party cookies like MUID and CLID through Microsoft domains. Under Article 5(3) of the ePrivacy Directive and the GDPR's consent requirements, storing non-essential cookies on a visitor's device requires prior consent. Clarity cookies are not strictly necessary for your site to function, so there is no alternative legal basis - you need consent before they fire.

Since 31 October 2025, Microsoft has enforced this at the platform level. Clarity now defaults to a denied consent state for visitors from the EEA, UK, and Switzerland. If your site does not pass a valid consent signal, Clarity runs in a restricted no-consent mode with significantly reduced data quality.

Clarity's Two First-Party Cookies

Before configuring consent, it helps to know exactly what Clarity stores on your visitors' devices. Both cookies are first-party, set on your domain.

Clarity may also set third-party cookies (MUID, CLID, ANONCHK, MR, SM) through Microsoft domains. These are used for cross-site identification and advertising data sharing. All of these fall into the analytics cookie or marketing cookie category and require consent.

Granted vs Denied: How Consent Mode Changes Clarity's Behaviour

Clarity Consent Mode has two states, and the difference between them is dramatic.

Granted means the visitor has accepted analytics cookies through your banner. Clarity operates normally: it sets _clck and _clsk, identifies returning users, stitches page views into multi-page sessions, and populates your dashboard with accurate funnel, engagement, and source data.

Denied means the visitor has not consented or has actively rejected cookies. Clarity still loads its tag - it does not stop entirely - but it switches to a restricted mode. No cookies are set. No existing Clarity cookies are retained. Each page view generates a unique, non-persistent identifier, which means every single page is treated as a separate session from a brand-new visitor.

The impact on your Clarity dashboard is significant:

This is why passing the correct consent signal matters. Without it, your Clarity data for EU visitors becomes unreliable.

The Consent API v2: Technical Reference

Clarity exposes a JavaScript API that your cookie banner (or CMP) calls after the visitor makes a choice. The current version is consentv2, which replaced the older boolean-only v1 API.

The call signature:

window.clarity('consentv2', { ad_Storage: 'granted', analytics_Storage: 'granted' });

Two parameters control Clarity's behaviour:

Note the naming convention. Microsoft uses camelCase with an underscore: ad_Storage, not adStorage or ad_storage. Getting the casing wrong means the signal is ignored.

To grant full tracking after a visitor accepts your banner:

window.clarity('consentv2', { ad_Storage: 'granted', analytics_Storage: 'granted' });

To deny everything when a visitor rejects cookies:

window.clarity('consentv2', { ad_Storage: 'denied', analytics_Storage: 'denied' });

To erase existing cookies (useful when a visitor withdraws consent):

window.clarity('consent', false);

You can also grant partial consent. A visitor who accepts analytics but not advertising cookies would receive analytics_Storage: 'granted' and ad_Storage: 'denied'. Clarity will track sessions but will not share data with Microsoft Ads.

The older v1 API - window.clarity('consent') for grant, window.clarity('consent', false) for deny - still works but is deprecated. It treats consent as all-or-nothing with no distinction between analytics and advertising. Microsoft plans to remove it, so use v2 for any new integration.

How a CMP Connects to Clarity

A consent management platform (CMP) sits between your visitor and tools like Clarity. The flow is straightforward:

1. Visitor lands on your page. The CMP displays the cookie banner.

2. Visitor makes a choice - accept all, reject all, or select specific categories.

3. The CMP reads that choice and calls Clarity's consentv2 API with the appropriate values.

4. Clarity adjusts its behaviour immediately: setting cookies if granted, operating cookieless if denied.

If your site also uses Google Consent Mode v2, Clarity can read those signals directly. It maps Google's ad_storage and analytics_storage parameters to its own. A CMP that already implements Google Consent Mode may not need separate Clarity configuration at all.

Setting Up Clarity Consent with Kukie.io

Kukie.io includes a built-in integration for Microsoft Clarity. The setup takes a few minutes and does not require writing any JavaScript.

Step 1: Install the Clarity tracking code. Add the Clarity JavaScript snippet to your site's <head> section, or use Google Tag Manager to deploy it. You can find the snippet in your Clarity project settings under Setup.

Step 2: Enable the integration in Kukie. Log into your Kukie dashboard. Open the Banner Editor for your site, go to the Integrations tab, and toggle on "Microsoft Clarity Consent". Save and publish your banner.

Step 3: Kukie handles the rest. When a visitor accepts analytics cookies through your banner, Kukie automatically calls window.clarity('consentv2', { ad_Storage: 'granted', analytics_Storage: 'granted' }). When a visitor denies cookies, Kukie sends the denied signal and triggers cookie erasure. If a visitor later changes their preference through the revisit consent button, Kukie updates Clarity in real time.

No custom JavaScript. No manual API calls. The integration also works alongside Kukie's Google Consent Mode support, so both signals stay in sync.

Verifying That Consent Signals Reach Clarity

After setup, test both the accept and deny paths. Open your site in a private browser window and open DevTools (F12).

Check Clarity is loaded: In the Console tab, type typeof window.clarity. If it returns 'function', the Clarity tag is present.

Monitor consent calls: Before interacting with the banner, paste this snippet into the Console to intercept Clarity calls:

const _c = window.clarity; window.clarity = function() { console.log('Clarity called:', ...arguments); return _c.apply(this, arguments); };

Now accept or reject cookies through your banner. You should see a console log showing Clarity called: consentv2 { ad_Storage: 'granted', analytics_Storage: 'granted' } (or denied).

Check cookies: Open the Application tab in DevTools and look under Cookies for your domain. After accepting, you should see _clck and _clsk. After rejecting, these cookies should be absent. If you accepted first and then withdrew consent, they should disappear.

In your Chrome DevTools audit, confirm that no Clarity cookies appear until after the visitor grants consent. If _clck shows up before the banner interaction, the Clarity tag is firing too early - check your script loading order.

Frequently Asked Questions

Take Control of Your Cookie Compliance

If you are not sure which cookies your site sets, start with a free scan. Kukie.io detects, categorises, and helps you manage every cookie - so your visitors get a clear choice, and you stay on the right side of the law.

Start Free - Scan Your Website