Cookie Consent Generator, Free GDPR Banner Builder
This cookie consent generator builds a customizable, GDPR style cookie banner with accept, reject, and category options. Set your colors, position, and text, preview it live, then copy the ready to paste HTML, CSS, and JavaScript, no sign up needed.
Your details
Appearance
Cookie categories
Strictly necessary cookies are always included and cannot be switched off, which is correct: they do not require consent.
Preview
Compliance checklist
Generated code
Paste the HTML just before </body>, the CSS into your stylesheet, and the JS into a script file loaded on every page.
Consent has to be prior, and this is where most banners fail. If your analytics script runs while the banner is still on screen, you have already set the cookie before anyone agreed to it. The generated code blocks non-essential scripts by default. Mark them like this and they will not execute until that category is granted:
<script type="text/plain" data-cookie-category="analytics">
Reject has to be as easy as accept. A prominent Accept button next to a faint “manage preferences” link has been ruled non-compliant repeatedly across the EU. Both buttons here are the same size for that reason, and it is not a style choice you should reverse.
This is not legal advice. It produces a banner that follows the requirements regulators most commonly enforce, but obligations vary by jurisdiction and by what your site actually does. If you handle sensitive data or operate at scale, have a lawyer look at it.
How the cookie consent generator builds a working banner, not just a mockup
Most cookie banner generators show you a preview and hand you a screenshot’s worth of styling to copy by hand. This one writes actual HTML, CSS and JavaScript that you paste before the closing </body> tag on your site, and it works the moment you paste it. Nothing you type into the form is ever sent off your device. The preview, the code assembly, and the file download all happen in the browser with plain string concatenation, no server round trip.
The output is built around consent as a stored decision, not a one time dismissal. That distinction matters under the EU ePrivacy Directive and GDPR, both of which treat clicking away a banner as meaningless unless the site actually respects the choice on every later page load.
What the generated snippet actually does
Every banner the tool produces follows the same four part logic, regardless of which style or position you pick.
localStorage under the key cc_consent_v1. If a decision already exists, the banner never renders. This is what stops the banner reappearing on every page, which is the single most common complaint about badly built consent tools.
localStorage and a CustomEvent named cookieConsentUpdated fires with the state object attached. Your analytics or ad tag loader listens for that event and only fires the tracking script once permission is actually granted.
window.cookieConsent with get() and reset() methods, so a “Cookie Settings” link in your footer can clear the stored choice and show the banner again without a page reload.
If you enable the Full style, a Customize button reveals per category checkboxes for analytics, marketing and preferences before a Save Preferences button writes the granular choice. That is the layout regulators tend to favour, since a one click Accept next to a buried Reject has been flagged repeatedly by European data protection authorities as a dark pattern.
Style options and what each includes
| Style | Buttons rendered | Category granularity |
|---|---|---|
| Simple | Accept All only | None, single blanket consent |
| Standard | Accept All, Reject All | None, binary choice |
| Full | Accept All, Reject All, Customize, Save Preferences | Analytics, Marketing, Preferences checkboxes, each independently toggled |
The pieces you can customise
Position and layout
Bottom bar, top bar, or a floating card pinned to the bottom left or bottom right. Each maps to a fixed set of CSS position properties baked directly into the inline style string, so the output needs no external stylesheet.
Colour and copy
Site name, message text, button labels, and three colour pickers for background, text and accent feed directly into the generated inline styles. There is no theme file to maintain later, the colours are literally the hex values you chose, written into the HTML.
What it will not do for you
The tool does not block scripts from loading before consent, that part is on you. It gives you the event to listen for, but your Google Analytics or ad pixel tag still needs to be wrapped in a conditional that checks cookieConsent.get() before injecting the script tag. It also does not generate a cookie policy page, a separate legal document listing every cookie your site actually sets. Pair this banner with an actual audit of your cookies, since ePrivacy compliance depends on what you are really tracking, not just what the banner says.
- RFC 6265 defines how HTTP cookies actually work at the protocol level, useful background even though this tool stores its own decision in
localStoragerather than a cookie. - GDPR Article 7 sets the conditions for valid consent, including that withdrawing consent must be as easy as giving it.
- GDPR Recital 42 clarifies that consent is not freely given if refusal causes detriment, the legal basis behind requiring a visible Reject option.
- CNIL cookie guidance is one of the more detailed regulator publications on what a compliant banner looks like in practice.
Compliance work this covers
Freelancers shipping a client site who need a working banner before launch day, small SaaS teams that cannot justify a paid consent management platform, agencies standardising a lightweight banner across several brochure sites, and developers who just want to see what a compliant three category consent flow looks like in plain JavaScript before wiring it into a larger tag management setup.
FAQ: Cookie Consent Generator
This tool generates a banner styled after common GDPR consent patterns, accept, reject, and granular categories, but full legal compliance depends on more than the banner itself. It also depends on your actual privacy policy content, what your scripts do before consent is given, how you handle data subject requests, and jurisdiction specific rules. Treat this as a strong starting point for the consent interface, and have the overall compliance approach reviewed by someone familiar with privacy law for your specific situation, this tool is not a substitute for legal advice.
“Accept Only” shows a single button and is the simplest but least compliant with strict GDPR interpretations, which generally require an equally easy way to reject. “Accept & Reject” gives visitors a clear binary choice with two equally prominent buttons. “Full Categories” adds a Customize option letting visitors toggle individual cookie categories like Analytics or Marketing independently, which is the pattern most aligned with strict GDPR and similar regulations that require granular consent.
Wrap your analytics or advertising script loading code inside the “cookieConsentUpdated” event listener shown in the About section above, and check the relevant category flag (e.g. e.detail.analytics) before injecting the script tag. This ensures the script only loads after the visitor has explicitly agreed to that category, rather than loading immediately and just hiding data afterward, which does not meet most consent requirements.
Add a “Cookie Settings” link, commonly placed in the site footer, that calls window.cookieConsent.reset() when clicked. This clears the stored choice and reopens the banner immediately, letting the visitor make a new selection at any time without needing to clear their browser data manually.
No, as long as you paste the exact same snippet on every page. It checks localStorage for a saved choice on each page load, so once a visitor makes a selection on any page, the banner will not reappear on subsequent pages or visits from the same browser until they clear their browser data or you call the reset function.
Yes, the generated snippet is plain HTML, CSS, and JavaScript with no dependencies, so it can be pasted into any custom HTML or code injection section your platform provides, typically found under theme footer code, custom code, or a dedicated header/footer scripts setting. Check your specific platform’s documentation for exactly where to add custom footer scripts.
No, the banner itself only manages the consent choice and stores it, it does not automatically intercept or block other scripts on your page from setting cookies. You are responsible for wiring your actual tracking scripts to check the consent state, using the event listener pattern shown above, before they run.
No, all configuration happens in your browser and the final code is generated locally, nothing you enter in this generator is sent to or stored on any server.
From the blog
Security writing without the scare tactics
Practical explanations of hashing, headers, certificates and consent, aimed at people who have to ship something this week.
