Banner design & content
Customize the banner, preferences, translated content and services before publishing.
Cookie Studio edits a draft of your consent experience. Start with the services and purposes your website uses, then shape the interface around clear choices.
Make the banner yours
Adjust text and background colors, layout, spacing, corners, borders and surface effects. Place the banner at the bottom left, bottom right or center, and style individual buttons as filled, outlined or text, with or without an underline. Choose a solid or glass surface and control its opacity; preview the fallback appearance as well as the effect over your website.
Review the initial banner, detailed preferences and the widget visitors use to reopen their choice. Customize the widget’s position, size, shape, colors, borders, opacity and surface independently of the banner. Choose a built-in icon or upload your own SVG or PNG in Studio.
In Cookie settings button, Reopen cookie settings offers a Floating button or My own link. With My own link, copy the snippet into your footer or another accessible place on every page. While the link is usable, the floating button stays hidden; it returns if the link is missing or hidden.
For visitors in the United States or an unknown location, when a published service involves sale and sharing or targeted advertising, the floating button shows Your privacy choices with the official California opt-out icon in place of your icon, and both the button and your link open the preferences at those opt-outs. Elsewhere, the preferences hold the purposes only. Keep the official icon beside your link's text; the snippet includes it. Privacy icon color recolors the blue parts of the official icon on the button and in your link snippet, and Use official blue restores the default.
Check desktop and phone layouts, long translations and contrast over the actual background. The first banner widens up to 640px to keep long button labels on one row; on phones, buttons that wrap span the full width. Acceptance, refusal and preference controls must remain readable and reachable.
Match your website with AI
Use the SiteOS plugin and Cookie skill to have your agent inspect the website’s source and rendered pages, then match its colors, spacing, corners and visual treatment. The agent can style both the banner and the persistent widget using the supported design controls.
Studio’s Design with AI action prepares a prompt with the selected project, environment and shared or regional design scope. Copy it to your agent, review the resulting draft and publish when ready. Opening or copying the prompt does not save or publish changes.
See AI & MCP for plugin installation.
Services and translated content
Choose a known provider from the curated service catalog or add a custom service. Review its name, purpose, provider, description and privacy-policy link. A preset supplies a starting point for your disclosure; it does not install the vendor or connect all copies of its script.
SiteOS Trace can also appear under Analytics. When Trace in the same environment waits for the banner’s Analytics choice, Add to banner in Trace’s collection settings lists it, so visitors see it among the services their choice covers. Its row in Studio is marked as added from Trace and has a switch to take it off the banner. Cookie only lists Trace; it never loads or blocks it. See Consent and privacy.
Add the languages your website needs and edit their banner, preference and service text. A rule can follow the page’s <html lang> attribute, falling back to the base language and then your default language, or always use one fixed language. Preview every configured language. Regional rules can have their own presentation and content; see regions and domains.
Try a few settings
This example uses the Cookie renderer with synthetic content. Changes stay in the preview and do not edit or publish your project. The real Studio includes more layout, language, service and regional controls.
Only a few settings are shown here. Explore more layouts, styling and regional controls in Cookie Studio.
Publish a reviewed version
Saving keeps changes in the draft. Publication is a separate action that updates the configuration delivered to your installed loader. A restored version also needs review and publication.
Publications lists every published revision, marks the Live one and describes its Change for visitors. Restore as draft… copies a revision into your draft after a confirmation that names any unpublished changes it replaces; your website keeps the live revision until you publish.
When a change affects the purposes or policy behind a previous choice, visitors may need to review their consent again. Verify the published result on a fresh visit and with an existing choice; do not infer behavior from the editor preview alone.
Continue with installation and integrations.