---
title: Customize Your Website’s Colors
description: Changing your website's colors is beneficial as it aligns with your brand and influences user emotions, creating a more engaging and memorable experience.
---

[Skip to content](https://support.cityhive.net/customizing-your-websites-colors#main-content)

[Contact Us](https://support.cityhive.net/kb-tickets/new?hsLang=en) [Customer portal](https://support.cityhive.net/tickets-view?hsLang=en)

![City Hive Logo-2.png\]](https://support.cityhive.net/hs-fs/hubfs/City%20Hive%20Logo-2.png?width=62&height=60&name=City%20Hive%20Logo-2.png)

Open main navigation

Close main navigation

- [Contact Us](https://support.cityhive.net/kb-tickets/new)
- [Customer portal](https://support.cityhive.net/tickets-view)

 We're here to help!

- There are no suggestions because the search field is empty.

1. [City Hive Support](https://support.cityhive.net/?hsLang=en)
2. [Customize Your Website & App](https://support.cityhive.net/customize-your-website-app?hsLang=en)
3. [Graphics & Design](https://support.cityhive.net/customize-your-website-app?hsLang=en#graphics-design)

# Customize Your Website’s Colors

## Changing your website's colors is beneficial as it aligns with your brand and influences user emotions, creating a more engaging and memorable experience.

1. [**Begin on the Studio section**](https://merchants.cityhive.net/#!/ffffff/studio/website/settings/general) of your dashboard under Website
2. **[Select Colors](https://merchants.cityhive.net/#!/fffff/studio/website/colors)** on the left side of the page
3. **Update the colors** of the different sections below using the information below
4. The **contrast ratio** measures how visually distinct two colors are from each other; use contrast scores to help choose colors that everyone can read easily  
   ![Screenshot 2026-06-24 at 12.02.30 PM](https://support.cityhive.net/hs-fs/hubfs/Screenshot%202026-06-24%20at%2012.02.30%20PM.png?width=127&height=98&name=Screenshot%202026-06-24%20at%2012.02.30%20PM.png)  
   When both AA and AAA display green checkmarks, your color combination is accessible and safe to use for text across your site
5. **Click Submit Colors** once you've made changes to save and publish the changes![](https://support.cityhive.net/hs-fs/hubfs/Screenshot%202024-02-01%20at%2012-02-17%20pm-png.png?width=243&height=41&name=Screenshot%202024-02-01%20at%2012-02-17%20pm-png.png)

#### [Header Top Note](https://support.cityhive.net/customizing-your-websites-colors#top-note)

- Background - changes the background color of the top header (blue)
- Text - changes the color of any text on the top header (pink)

![Screenshot 2026-06-24 at 1.47.51 PM](https://support.cityhive.net/hs-fs/hubfs/Screenshot%202026-06-24%20at%201.47.51%20PM.png?width=670&height=79&name=Screenshot%202026-06-24%20at%201.47.51%20PM.png)

#### [Pre Header](https://support.cityhive.net/customizing-your-websites-colors#pre-header)

- Background - changes the background color of the strip above the header at the top of the webpage (pink)
- Text - the color of any writing on there header (blue)
- Icons - the color of icons, graphics or any other parts of the pre header (yellow)

![](https://lh7-us.googleusercontent.com/v9j6TW5EdGAxis8OxvsToopYAIp8i0sOIwuBMuM-N1Qm3K4wVkjvSTLyZh_huvPl4Qr6ClHlxMreFEmpWyUIm93Sod-IHnfeCOZnLj0hJDjmuI5Gjb_MELq9_2zJ3HEMkayz0CsBJpj5S7-nQZSJbnM)

#### [Header](https://support.cityhive.net/customizing-your-websites-colors#header)

- Background - changes the background color of the header (green)
- Text - changes the color of the small text on the header (pink)
- Icons - changes the color of any icons on the header (dark green)

![](https://lh7-us.googleusercontent.com/Or9VCT2bA8qvX3ngpxfyFHFc4WV7-KhKI1rvRzSRhDgGvLRM3BPaT1IV89ZlBAFKdDbTU-C01cOkaz352W_4fbTBA8QnJcVmUaj9BSp8p7nxOvZHtB6LNmgIY2n5zVYfXzDlgWDf3v0tmM78nYF2qts)

#### [Top Menu](https://support.cityhive.net/customizing-your-websites-colors#top-menu)

- Background - changes the color of the top menu (Blue)
- Text - changes the color of the text on the top menu (Green)
- When hovered - changes the color of the text on the top menu to a different color when mouse is hovered over it (pink)

![](https://lh7-us.googleusercontent.com/a2gURIWQQGv0VZ65pz9o8JFOOpgeOMkQ_cCWZxt29pD9mHQ_pOe-2Oxcrpa9MIZBt3bIH5Ii_ZFWZscsjz7oRM7OMPJouBbaCG0rXXrMR4skebRo6lc55PtXFdncqmRW40iyfnYRRi5VzO-9_Pf9nTk)

#### [Header Sub Note](https://support.cityhive.net/customizing-your-websites-colors#sub-note)

- Background - changes the background color of the top header (red)
- Text - changes the color of any text on the top header (green)

![](https://lh7-us.googleusercontent.com/ZtbnNWdte2ZFqFaCI9uanahn0Ultg059t1mtmQO3eBCZvGvgAShyrwTlkjOpXQHJD-ePY9P05oNX-jKD8bPGa7dDClb4FakzgtS1hEk6nmLnThPimf3Q0S-Iy2kDE7x_H7gPbZNRHJSTRorFt-ymUfU)

#### [Main Content](https://support.cityhive.net/customizing-your-websites-colors#main-content)

- Background - changes color of the background of the whole webpage (blue)
- Text - changes the color of any text on the main background (yellow)
- Icons - changes any icon color on the main webpage (pink)

![](https://lh7-us.googleusercontent.com/hGhztgRXP7ZdMCbh-FkSp9PjHRVCsBIUw_vJMsp3p_NkAwZZkEXiYAxOY8S_5ddkaGHeHN7ijPBal7uE5KPnf2qBHp3R9w8ME0uZSt5CuOBwVBb6wMTTx6F2CzdvM4hcxMbgklHGH1daCCq4rXfIr7o)

#### [Buttons on White Background](https://support.cityhive.net/customizing-your-websites-colors#white-background)

- Primary on White - changes the color of the "add to cart" buttons and other featured item tags (purple)

![Screenshot 2024-02-29 at 12.03.19](https://support.cityhive.net/hs-fs/hubfs/Screenshot%202024-02-29%20at%2012.03.19.png?width=670&height=211&name=Screenshot%202024-02-29%20at%2012.03.19.png)

#### [Footer](https://support.cityhive.net/customizing-your-websites-colors#footer)

- Background - changes the background color of the footer (blue)
- Text - changes the color of the small text on the footer (red)
- Titles - changes the color of the title text on the footer (purple)
- Icons - changes the color of the icons and graphics on the footer (green)

![Screenshot 2024-02-29 at 12.02.55](https://support.cityhive.net/hs-fs/hubfs/Screenshot%202024-02-29%20at%2012.02.55.png?width=670&height=194&name=Screenshot%202024-02-29%20at%2012.02.55.png)

#### [Sitelinks](https://support.cityhive.net/customizing-your-websites-colors#sitelinks)

- Background - changes the background color of the site links section at the very bottom of the page (red)
- Text - changes the text color of the site links (blue)
- Icons - changes the color of the icons next to the site links (pink)

![Screenshot 2024-02-29 at 12.02.38](https://support.cityhive.net/hs-fs/hubfs/Screenshot%202024-02-29%20at%2012.02.38.png?width=670&height=43&name=Screenshot%202024-02-29%20at%2012.02.38.png)

- [Get Set Up](https://support.cityhive.net/get-set-up?hsLang=en#main-content)

    - [Create Your Merchant Account](https://support.cityhive.net/get-set-up?hsLang=en#create-your-merchant-account)
    - [Configure Your Settings](https://support.cityhive.net/get-set-up?hsLang=en#configure-your-settings)
    - [Launch Your Website and App](https://support.cityhive.net/get-set-up?hsLang=en#launch-your-website-and-app)
    - [Marketplace Integrations](https://support.cityhive.net/get-set-up?hsLang=en#marketplace-integrations)
- [Orders - Need Help?](https://support.cityhive.net/orders-need-help?hsLang=en#main-content)

    - [Shipping](https://support.cityhive.net/orders-need-help?hsLang=en#shipping)
    - [Delivery Optimization](https://support.cityhive.net/orders-need-help?hsLang=en#delivery-optimization)
    - [Digital Gift Cards](https://support.cityhive.net/orders-need-help?hsLang=en#digital-gift-cards)
- [Inventory Management](https://support.cityhive.net/inventory-management?hsLang=en#main-content)

    - [City Hive POS](https://support.cityhive.net/inventory-management?hsLang=en#city-hive-pos)
    - [Set Up and Sync](https://support.cityhive.net/inventory-management?hsLang=en#set-up-and-sync)
    - [Update Product Information](https://support.cityhive.net/inventory-management?hsLang=en#update-product-information)
    - [Standard Inventory Management](https://support.cityhive.net/inventory-management?hsLang=en#standard-inventory-management)
- [Customize Your Website & App](https://support.cityhive.net/customize-your-website-app?hsLang=en#main-content)

    - [Creating and Editing Pages](https://support.cityhive.net/customize-your-website-app?hsLang=en#creating-and-editing-pages)
    - [Graphics & Design](https://support.cityhive.net/customize-your-website-app?hsLang=en#graphics-design)
    - [Content Organization](https://support.cityhive.net/customize-your-website-app?hsLang=en#content-organization)
- [Promotions](https://support.cityhive.net/promotions?hsLang=en#main-content)

    - [Promotions](https://support.cityhive.net/promotions?hsLang=en#promotions)
- [Wine Clubs](https://support.cityhive.net/wine-clubs?hsLang=en#main-content)

    - [Wine Club](https://support.cityhive.net/wine-clubs?hsLang=en#wine-club)
- [Marketing & Customer Engagement](https://support.cityhive.net/marketing-customer-engagement?hsLang=en#main-content)

    - [Email, Push & SMS Marketing](https://support.cityhive.net/marketing-customer-engagement?hsLang=en#email-push-sms-marketing)
    - [Customer Acquisition & Management](https://support.cityhive.net/marketing-customer-engagement?hsLang=en#customer-acquisition-management)
- [Autopilot](https://support.cityhive.net/autopilot?hsLang=en)
- [Events](https://support.cityhive.net/events?hsLang=en)
- [Overview & Reports](https://support.cityhive.net/overview-reports?hsLang=en)
- [Payments & Billing](https://support.cityhive.net/payments-billing?hsLang=en#main-content)

    - [Transactions](https://support.cityhive.net/payments-billing?hsLang=en#transactions)
    - [Payments](https://support.cityhive.net/payments-billing?hsLang=en#payments)
    - [Disbursements](https://support.cityhive.net/payments-billing?hsLang=en#disbursements)
    - [Chargebacks](https://support.cityhive.net/payments-billing?hsLang=en#chargebacks)
- [Ads & Analytics](https://support.cityhive.net/ads-analytics?hsLang=en#main-content)

    - [Analytics](https://support.cityhive.net/ads-analytics?hsLang=en#analytics)
    - [Ads](https://support.cityhive.net/ads-analytics?hsLang=en#ads)
- [FAQs](https://support.cityhive.net/faqs?hsLang=en)

[![Chill listening crop-3](https://support.cityhive.net/hs-fs/hubfs/serviceorg-normal.png?width=26&height=24&name=serviceorg-normal.png "Chill listening crop-3")](http://cityhive.net)

City Hive Help Center

Copyright © 2026, City Hive, Inc.