Styling & Customization

Ours Privacy CMP offers extensive customization options to match your website's branding and user experience. You can control everything from colors and fonts to layout and button styles, ensuring your consent banner feels like a natural part of your site.

---

Visual Customization Options

You can configure styles directly in the application via the Design tab in your CMP configuration. The Design tab provides 6 customization options that cover most styling needs, including colors, button styles, and border radius. You can adjust these settings and use the Preview button to see how your changes will look before they go live. Important: Changes must be published to take effect—they are not applied immediately.

All of these customization options are available through point-and-click controls in the Design tab—no coding required:

• Theme Selection: Choose from multiple pre-built themes including light, dark, and minimal designs
• Color Customization: Set primary colors, background colors, text colors, and accent colors using color pickers
• Typography: Control font families, sizes, and weights for all text elements
• Layout Options: Choose between banner, modal, or floating button layouts
• Button Styling: Customize button shapes, sizes, colors, and hover effects with simple controls
• Border & Shadow: Add borders, rounded corners, and shadow effects
• Responsive Design: All themes automatically adapt to mobile and desktop screens

---

Advanced Customization with CSS Variables

The Design tab covers most use cases with its 6 customization options. If you're not technical, you can stick to the Design tab and will most likely not need CSS variables.

For technical users who require advanced customization beyond the options available in the Design tab, CSS variables and CSS classes are available. These provide many more customization options than the 6 options exposed in the Design tab interface. You can find a complete reference of available CSS variables in the CSS Variables Reference tab within the Design section of your CMP configuration. These are intended for engineering and design teams who need deeper control over the consent modal's appearance.

---

Text & Content Customization

Beyond visual styling, you have complete control over all text content:

• Banner Headlines: Customize the main title and description text
• Button Labels: Set custom text for "Accept All," "Reject All," "Preferences," and other buttons
• Category Descriptions: Write clear explanations for each cookie category
• Legal Text: Customize privacy policy links and legal disclaimers
• Regional Translations: Provide different text for different geographic regions
• Accessibility: Ensure all text meets accessibility standards

---

Try Before You Configure

Want to see how different customization options look before implementing them on your site? The Design tab in your CMP configuration provides an in-app interface for configuring and previewing styles. You can adjust colors, button styles, and other visual settings, then use the Preview button to see how your changes will appear before publishing them to your live site.

• Demo different themes and see how they look in real-time
• Test color combinations and typography options
• Preview layouts on different screen sizes
• Experiment with text content and translations
• Compare different consent modes (opt-in vs opt-out)
• Test regional variations and compliance scenarios

The preview functionality lets you experiment with all customization options without affecting your live site, making it easy to find the perfect configuration for your brand and compliance needs.

---

Example: Consent Platform Theme

Ours Privacy CMP offers a variety of theme options to match your website's branding and user experience needs.

The examples below should have varied the modal can be styled:

---

Next Steps

• General Settings: Configure categories, vendors, and UI text
• Regional Policies: Set up region-specific text and translations