Consent banner isn't using the correct font
If your cookie banner appears in Times New Roman (or a different font from your site’s paragraph text), it’s likely because your website doesn’t have a default body font defined. Some website builders don’t apply a global font unless you explicitly set one.
Why this happens
Our banner is designed to inherit your site’s body font. The body font refers to the default font-family
applied to the <body>
element in your site’s CSS. It typically controls the font for most on-page content - including paragraphs, links, and (unless otherwise overridden) headings.
If the <body>
element has no defined font-family
, browsers will fall back to their default - usually Times New Roman.
How to check if your body font isn't defined
To diagnose whether your website's body font isn't defined, you'll need to use your browsers inspect element tool.
Enable the Element Inspector tool
The Element Selector tool can be found in your browser’s Developer Tools.
~~~~~
Enabling the Element Selector in Microsoft Edge:
Right-click anywhere on the page and select Inspect, then enable the inspect element tool in the developer tools window.
Compare the font of your banner with the paragraph text on your website
If your banner font doesn’t match your site’s body text, it’s likely the body font hasn’t been set.
Inspect your website's <body> element
In the Elements tab, select the <body>
tag.
Look in the Styles pane for a font-family
rule.
- If missing: Your site does not have a global font defined.
- If present: Confirm it matches your paragraph text font.
How to define your body font
Find your site’s paragraph font
Use the Inspect tool to identify the font used in your body text.
Add it to your website's <body> using the following CSS
body {
font-family: 'Your Font Family';
}
Example:
body {
font-family: 'Graphik';
}
Where to add this code
If you have access to your site’s stylesheet:
Add the code above to your main CSS file (usually called style.css
or similar).
If you're using a no-code website platform e.g. Wix or Squarespace:
Look for a CSS injector or "Custom Code" section. Most platforms allow you to inject custom styles.
If you still cant find where to add the code:
Google “how to add custom CSS in [your CMS name]” for platform-specific instructions.
Your banner should now display in the correct font
Once added, your cookie banner should match your site's font style
Still need help?
If the article didn't resolve your issue, please reach out to our support team!