5d:I[333483,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/15s1ft4k9lx-7.js","/creators-assets/_next/static/immutable/chunks/0x8sumr53pdkk.js","/creators-assets/_next/static/immutable/chunks/3pud1dqsw0-_7.js","/creators-assets/_next/static/immutable/chunks/1m75iqpnspynu.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/3ohf-5_4hfjuq.js","/creators-assets/_next/static/immutable/chunks/2jjhfe7-w6y9a.js","/creators-assets/_next/static/immutable/chunks/325i2v5l4tnlq.js","/creators-assets/_next/static/immutable/chunks/0kisxyo3aw231.js","/creators-assets/_next/static/immutable/chunks/2b1mm8iiske-y.js","/creators-assets/_next/static/immutable/chunks/0i7m0zg6jfazw.js","/creators-assets/_next/static/immutable/chunks/3-hmotkz_bdv_.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3naniu4pnqfyw.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/456d4lcv9-syj.js","/creators-assets/_next/static/immutable/chunks/36-o7-3julke0.js","/creators-assets/_next/static/immutable/chunks/2xq6uu2rcdc2i.js","/creators-assets/_next/static/immutable/chunks/2y9gv91n8o3i9.js","/creators-assets/_next/static/immutable/chunks/41i4r4u9uolgz.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/15q00pdqk0br3.js","/creators-assets/_next/static/immutable/chunks/293prjxu_wz0c.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/3l2h8slpbzxqo.js","/creators-assets/_next/static/immutable/chunks/2xgtw4s-tlhet.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/1cphzzg2t2qo2.js"],"PostDetailCard"] 5e:Tb29,

Utilities

It is a functional site utility that manages consent state, privacy preferences, storage, and analytics events. It fits better under Utilities than Buttons, Layout, Sections, or Embeds.

Details

What it does

CookieConsent gives your Framer site a customizable cookie banner and preference center with location-aware consent behavior. It can auto-detect EU and US visitors using timezone detection, then adjust the default consent model for GDPR-style opt-in, CCPA-style opt-out, or relaxed consent. Visitor choices are saved in localStorage, and consent updates can fire custom browser events and GTM dataLayer events for analytics integrations.

Features

Location-aware compliance mode with Auto, GDPR, CCPA, and Relaxed options. GDPR mode starts optional categories off by default, CCPA mode starts them on by default, and Relaxed mode uses your category defaults. Editable cookie categories with ID, label, description, required status, and default-on behavior. Built-in preference center with toggle switches, required category handling, save/cancel actions, and privacy policy link. Persistent consent storage using a configurable localStorage key and expiration window. Accept all, reject all, manage preferences, save preferences, and close labels are fully editable. Supports custom consent events and GTM dataLayer pushes when consent changes. Includes banner layouts for full-width bar, floating card, and minimal mode. Position controls include top, bottom, bottom-left, and bottom-right. Full styling controls for background, surface, text, muted text, accent, reject color, borders, radius, button radius, shadow, font, max width, offset, and z-index.

How to use

Add CookieConsent to your Framer canvas and choose the banner layout and position. Edit the title, description, button labels, privacy policy link, and cookie categories from the property panel. Choose your compliance mode: use Auto-detect for region-based behavior, GDPR for opt-in consent, CCPA for opt-out consent, or Relaxed for category defaults. Enable event firing if you want consent changes to dispatch a custom event or push to Google Tag Manager. Turn off Force Show before publishing so the banner only appears when consent has not been saved or has expired.

Ideal for

Framer landing pages, SaaS websites, marketing sites, blogs, course platforms, template shops, analytics-heavy pages, startup websites, privacy-conscious brands, client projects, and any site that needs a polished cookie consent banner with editable preferences and analytics integration hooks.

5a:[["$","$L5d",null,{"post":{"id":"019e211e-f47b-7611-ab51-51efcaf91a5f","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"2aa1c8b3-7537-46a8-a900-110c4e9d5ea9","name":"Spyridon Merkouris","slug":"spyridon-merkouris","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/2109501/avatar-cFtiy7MwEgg752DMyUE5kNTlTumFuR.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"MYs3o3SFF9uaix5UI3cc","resolved":true,"title":"CookieGuard","body":"$5e","bodyJson":null,"introduction":"Cookie banner with preference center","slug":"cookieguard","author":{"framerUserId":"2aa1c8b3-7537-46a8-a900-110c4e9d5ea9","name":"Spyridon Merkouris","slug":"spyridon-merkouris","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/2109501/avatar-cFtiy7MwEgg752DMyUE5kNTlTumFuR.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/MYs3o3SFF9uaix5UI3cc/cookieguard-ZqzI04QJtpUQIdKRVRNIi0TjlVTpPL","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-05-02T19:25:44.137Z","updatedAt":"2026-06-13T11:37:08.039Z","publishedAt":"2026-05-13T11:35:37.339Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://philosophical-designer-195239.framer.app","price":"4","paymentUrl":"https://payhip.com/b/UdDiT","workshop":false,"categories":[{"id":"7677fa83-43ce-41a2-a3fe-db438ec0fd33","name":"Interactive","slug":"interactive"}],"lastSaveId":"kC8CZQ64GZIZ5MHHiTLx","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":3,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-05-13T11:35:37.339Z","updatedAt":"2026-05-13T11:35:37.339Z","reported":false}}],"$L5f"]

Suggested for you