---
title: How to add custom CSS on HubSpot CMS
description: Learn how to add custom CSS to a specific page or across all of your pages on HubSpot CMS Hub.
---

[Blog - HubSpotted](https://www.lean-freight.com/blog)

# [How to add custom CSS on HubSpot CMS](https://www.lean-freight.com/blog/how-to-add-custom-css-on-hubspot-cms)

 Written by [Kerem Kandirali](https://www.lean-freight.com/blog/author/kerem-kandirali) | Sep 10, 2023, 11:07:05 PM

Adding custom CSS on HubSpot CMS is pretty easy. You may prefer to add your code snippet to a specific page or all of your pages. In both cases, your CSS code will appear between <head></head> tags in the source code of your website.

## Add custom CSS to a specific page

If you need to change/edit something via CSS on a specific page, follow the steps below:

1. Navigate to **Marketing > Website > Website Pages** on your HubSpot account.
2. Click the **Edit** button of the page which you’d like to add custom CSS.
3. Click the **Settings** tab and then scroll to the bottom. There you’ll realize an **Advanced options** button. Click that button and the page will be extended.
4. Now you should see a **Head HTML** text area right under the **Additional code snippets** title.
5. Add your CSS snippet into that text area, between **<style></style>** tags. For example:
   
   `<style>    .example_div { color: #000000; } </style>`
6. Finally, **Update/Publish** the page by clicking the orange button at the top right corner of the screen.

That's all. Now you should see the changes you've made on your page.

## Add custom CSS to all of your pages

When it comes to add custom CSS for across all of your pages, you should do this from the Settings section on your HubSpot account. So follow the steps below:

1. Click the gear icon at the top right menu on your HubSpot account. This will take you to the **Settings** page.
2. Navigate to **Website > Pages** from the left hand panel.
3. Choose a domain from the top part of the page. If you want to apply your custom CSS to all the pages across all of your domains, leave it as **Default settings for all domains**. Note that you're still able to override any settings for a specific domain in the future.
4. Ensure that you're on **Templates** tab and realize the **Site header HTML** text area.
5. Add your CSS snippet into that text area, between **<style></style>** tags. For example:
   
   `<style>    .example_div { color: #000000; } </style>`
6. Once you edit this text area, you'll see that a bar will appear from the bottom of your screen. Hit **Save** button over there to make your changes take affect.

Now you can check your website and you'll see that your changes are alive.

## Need help?

Don't hesitate to use the comments section below for your questions!

[View full post](https://www.lean-freight.com/blog/how-to-add-custom-css-on-hubspot-cms)

```json
{
  "@context" : "http://schema.org",
  "@type" : "BlogPosting",
  "author" : {
    "@type" : "Person",
    "name" : "Kerem Kandirali"
  },
  "dateModified" : "2023-09-10T23:17:49.633Z",
  "datePublished" : "2023-09-10T23:07:05Z",
  "headline" : "How to add custom CSS on HubSpot CMS",
  "image" : {
    "@type" : "ImageObject",
    "height" : 600,
    "url" : "https://43800513.fs1.hubspotusercontent-na1.net/hubfs/43800513/blog-featured-images/add-custom-css-hubspot.webp",
    "width" : 1080
  },
  "mainEntityOfPage" : "https://www.lean-freight.com/blog/how-to-add-custom-css-on-hubspot-cms",
  "publisher" : {
    "@type" : "Organization",
    "logo" : {
      "@type" : "ImageObject",
      "height" : 60,
      "url" : "/hs/hsstatic/content_shared_assets/static-1.4092/img/default-amp-logo.png",
      "width" : 60
    },
    "name" : "Blog - HubSpotted"
  }
}
```