> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://support.consentmo.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Design changes for the Cookie banner

When it comes to customizing the appearance of your cookie banner, our platform offers a variety of options. 

To ensure it aligns perfectly with your brand's aesthetic and meets your specific needs, here's how you can make the cookie banner your own.

# Color Customization

Navigate to the **Cookie banner** tab > **Design** section, where you can **alter the color scheme** of your cookie banner. 

In order to see the **color settings**, make sure to select the **Custom** option in the **Banner colors** section. 

You can also explore the other **predefined color styles** by hitting the **Show advanced options.**

With a live preview feature, you can experiment with different hues and instantly see how they look in real-time.


[![](https://gdprstorage.b-cdn.net/faq/gif/banner-colors.gif)](https://gdprstorage.b-cdn.net/faq/gif/banner-colors.gif)

# How to change the position

By default, the Cookie banner is displayed at the bottom part of the screen.

If you want to **change the position of the Cookie banner**, you can navigate to:

1. **Cookie banner**

2. **Design** tab > **Banner layout**

* If you select the **Banner** view, you will see the **Position** option with **Bottom** and **Top** available there

![](https://storage.crisp.chat/users/helpdesk/website/-/b/0/7/f/b07f7406951a4000/position-banner_15th8tw.png)


* The **Dialog** view, if selected, is **only available for a centered position** on the page:

![](https://storage.crisp.chat/users/helpdesk/website/-/b/0/7/f/b07f7406951a4000/dialog-position_za5yxz.png)


* For the **Box** view, you have the options shown below:

![](https://storage.crisp.chat/users/helpdesk/website/-/b/0/7/f/b07f7406951a4000/position-box_1mxy8z4.png)


* If the **Smart Consent** option is selected, for it you have two options for positioning - **Bottom right** and **Bottom left**.

There are also options for setting the position of the banner as per the device used by the visitor. 

For example, for the **Desktop** you can set it to **bottom right** and for **Mobile** to **bottom left**. 

There is also an option to **set the distance from the bottom and the sides of the page**. 

![](https://storage.crisp.chat/users/helpdesk/website/-/b/0/7/f/b07f7406951a4000/smart_dqpihf.png)


# Buttons customization

In the **Design** tab **> Button styles** section, you have the option to adjust the look of each button as well. 

There is an option to choose between the following styles:

* **Default** - having the classic look of the buttons with the Accept and Reject button having the same "weight" and the Preferences button being different;

* **Solid** - making all of the buttons look the same and filled with color without borders;

* **Outlined** - again having the buttons look in the same way with a transparent background and borders;

For each button, regardless of the style you select, you have the option to further adjust them as per your preferences and change the color or the border, text or background as well.

[![](https://gdprstorage.b-cdn.net/faq/gif/buttons-styling.gif)](https://gdprstorage.b-cdn.net/faq/gif/buttons-styling.gif)

* For the buttons customization **you also have the option** to change the **Border radius** from the same **Button styles** section as shown below:

![](https://storage.crisp.chat/users/helpdesk/website/-/b/0/7/f/b07f7406951a4000/button-styles_2e2vm4.png)

* Also, if you are going with the **Box view** design of the banner, **you will have the option** to have the **buttons** shown either **Horizontally** or **Vertically**:

[![](https://gdprstorage.b-cdn.net/faq/gif/box-buttons.gif)](https://gdprstorage.b-cdn.net/faq/gif/box-buttons.gif)

# Font Family and Size Customization 

If you’d like your cookie banner and Preferences popup to better match your brand typography, you can now specify a custom font family — available for stores on the Standard, Plus and Enterprise plans. 

You can navigate to the **Cookie banner** tab > **Design** section > Scroll down until you reach the **Branding and Font** section, as shown below:

![](https://storage.crisp.chat/users/helpdesk/website/-/b/0/7/f/b07f7406951a4000/design-font_13bwwta.png)

There, you will have the option to change the **font family** and **font size**. 


# Layout Customization

Once you access the **Consent banner** tab > **Design** section, from the **Banner layout** you can select the following options:

![](https://storage.crisp.chat/users/helpdesk/website/-/b/0/7/f/b07f7406951a4000/layout-options_10va2t8.png)


* **Banner** - [Frontend Preview](https://gdprstorage.b-cdn.net/faq/img/banner-preview.png)

* **Dialog** - [Frontend Preview](https://gdprstorage.b-cdn.net/faq/img/dialog-preview.png)

* **Box** - [Frontend Preview](https://gdprstorage.b-cdn.net/faq/img/box-preview.png)

* **Smart Consent** - [Frontend Preview](https://gdprstorage.b-cdn.net/faq/gif/smart-consent-preview.gif)

Sleek and contemporary, the available styling options are for stores looking to make a bold statement with their cookie banner design.

# Text Customization

Adjust all text elements through the **Cookie banner** tab by selecting the **Content** section. 

Here you can personalize every message, from the initial greeting to the accept and reject button texts, ensuring clarity and consistency in your communication with customers.

![](https://storage.crisp.chat/users/helpdesk/website/-/b/0/7/f/b07f7406951a4000/bar-content-section_r8wt5a.png)

By offering these extensive customization options, our goal is to empower you to design a cookie banner that not only meets legal requirements but also seamlessly integrates into your store's environment, enhancing the user journey while upholding transparency and choice.

# Need Help

If you need further assistance or wish to explore more design possibilities, our support team is readily available to guide you through each step. Contact us through the in-app chat feature or email us directly at support@consentmo.com for personalized support.