Custom Styling

The main way to control appearance is the dashboard fields (see Configuration): accent color, button color and text color, theme (light/dark), logo, and on-screen position. That covers most sites without writing any CSS.

Finer control with CSS

The banner, the category modal, and the floating badge are plain DOM elements with fixed IDs:

#cb-banner  /* the consent banner */
#cb-modal   /* the category preferences modal */
#cb-badge   /* the floating "Customize" badge after consent */

The widget styles them inline (via the style attribute) so they don't depend on — or break because of — the host site's own CSS. As a result, overriding them from your own stylesheet requires !important:

#cb-banner { border-radius: 4px !important; }

This is a deliberate trade-off: targeted CSS overrides can break if the widget's markup structure changes in a future update. For basic branding (colors, logo, position, theme), use the dashboard fields — those are guaranteed stable across versions.

z-index

The banner, modal, and badge use the maximum possible z-index (2147483647) so they always render above the rest of the page's content — there's no need, and no reason, to override it.