Skip to main content

Colors

Set the banner's background, text, and button colors to match your site. Color changes show in the preview at once. For separate colors that apply when a visitor's device is in dark mode, see Dark mode.

Set colors

  1. Open Banner Settings in the dashboard at my.optsens.com.
  2. Open the Colors section.
  3. Set the banner colors and the button colors.
  4. Watch the preview, then click Save Changes.

Each color has a swatch picker and a hex input. Button background and border fields can also be set to transparent.

FieldWhat it sets
BackgroundThe banner surface color
TextThe banner text color

OptSens derives borders, card backgrounds, muted text, link color, and the toggle color from your background and text values, which keeps the whole banner consistent.

Button colors

Buttons are set in two groups. Each group has a background, text, and border.

GroupButtons it covers
Accept & RejectAccept All and Reject All
Manage & ConfirmManage Settings and Confirm

Accept and Reject share one color set to keep equal visual weight, which GDPR requires.

Contrast checks

OptSens checks contrast as you pick colors and warns when a combination may be hard to read. Warnings can appear for:

  • Low contrast between text and background
  • Low contrast on the Accept & Reject buttons
  • Low contrast on the Manage & Confirm buttons
  • A background that may hide the OptSens logo

The warnings are advisory. They flag low-contrast combinations early, and they do not block saving. For full WCAG conformance, check your final colors with a contrast tool.

tip

The Background field sets a single solid color. For gradients or other effects that the picker cannot express, use the Custom CSS field instead.

Plan gating

Per-button colors and the corner sliders in Shape & Style are gated by plan. On plans without them, the buttons inherit the theme's colors and you set the banner background and text only.