How to Change Your Site's Color Palette and Primary Brand Color

Your account and website's color palette is a central piece to theming and branding your website. OfferingTree puts your brand front and center when your clients are on your website, and you can take full advantage of that by customizing your Color Palette. 

To customize your color palette visit the Site Settings section under Edit Website.

The first tab is called Styles, and this is where you can customize not only your color palette but also your fonts.  You will see in the Color Palette section that you can customize up to 6 colors. These colors are grouped into 3 categories; Primary, Accents, and Neutrals. We'll describe what each of these categories means, but you can change each color by clicking on the color and then pressing the Save Settings button at the bottom of the page.

Primary Color

The primary color is your primary brand color. It is used for primary actions and other places on your website that need to be highlighted. If your brand has more than one color, you can add those as Accent colors. Once set, press the Save Settings button at the bottom of the page and your primary color will be set and immediately shown on your website.

Accent Colors

Accent colors are usually bold and highly saturated colors that also go along with your brand and primary color. Accent colors can be used to draw attention to certain features and elements on your site. One accent color is required and you can add up to two.

Neutral Colors

Neutrals are colors that do not compete with your primary or accent colors. Think shades of white, black, greys and beige, or a very undersaturated (washed out) or deeply saturated (very dark) version of your primary or accent color. Three neutral colors are required and it is recommended that you have at least one very light, and one very dark neutral color in your palette. These colors will be used to provide a lot of contrast and do not draw a lot of attention. They are great for background colors and content colors. These colors keep your website from looking too busy and overwhelming. 

How to Choose Your Palette Colors

This can be really hard when there are infinite possibilities 😀. OfferingTree provides our own color palettes you can choose from to get started. Press the Choose from one of our color palettes button to see them. 

There are also many resources online that can help you generate a color palette from a logo, image or from a brand color. Here are two of those resources that we've come across.

• Coolors palette generator - If have a color already you can add it and then lock it (hover over the color and there is a lock button. Then hit space bar to generate more palette options. You'll want to decide which colors are your primar, accents and neuetrals. They also have a tool that can extract colors and create a palette from an image or logo.
• Canva also has a palette generator where you can explore their palettes or derive one from an image.

P.S. Join our Facebook group and connect with other OfferingTree users to share questions, offer ideas and insights, and support each other towards a more thriving wellness business.