Adding Colors to your Website

This article will explain how to choose color palettes for your site and how to customize colors to match your brand.

Pixieset Team avatar
Written by Pixieset Team
Updated over a week ago

With Pixieset Website’s color tools, its easy to personalize your site so that it reflects your brand and complements your photos. This article will explain how to explore and apply curated color palettes to your site and how to customize colors further to match your brand.

On this page:

Choosing your site colors

Get started by choosing a color palette for your site. Each preset palette contains a group of 5 color schemes that range from light to dark, giving you a range of options from the same family. Choosing a primary color scheme will update all blocks on your website.

To change your website colors:

  1. Go to the Design Tab and click on Colors.

  2. Browse through a variety of beautiful preset color palettes and click on one to apply it to your site.

  3. Once you have chosen a palette, select a scheme that best complements your work.

Editing the color of specific blocks

You can easily edit the color of an individual block by applying the scheme of your choice to it. Simply click on the paintbrush symbol over any block and select your preferred scheme on the left.

When you have the main Colors tab open, you will also see a color scheme toggle in the top-left of each block. This will allow you to quickly override the default color and select a different scheme for that block.

Customizing your site colors

While on the Website Pro Plan, or the Pro or Ultimate Pixieset Suite plan, you can use advanced tools to completely customize your website’s colors. This is a great way to work your own branding into your website. If you are on a different plan, you can explore these options in your Builder, but they won’t apply to your live site until you upgrade.

Editing color schemes

You can easily fine tune the schemes within a palette. This will allow you to customize specific elements such as the background, text and buttons.

  1. Go to the Design Tab and click on Colors.

  2. When viewing the schemes within a palette, click the pencil icon on any scheme to edit it.

  3. Click on the element you wish to edit and select a color. You can choose from recommended options or click custom to make more precise selections.

Note: Editing existing color schemes is an advanced feature available with the Website Pro Plan, or the Pro or Ultimate Pixieset Suite plan.

Creating custom color palettes

If you have your own brand colors that you’d like to incorporate into your Website you can create your own palettes from scratch.

  1. Within your Color Settings, open the Custom Tab.

  2. Click + Add Palette.

  3. Give the palette a name and save.

  4. From there, you can add your own customized schemes.

Note: Creating custom palettes is an advanced feature available with the Website Pro Plan, or the Pro or Ultimate Pixieset Suite plan.

Saving an existing palette to work from

If you’d like to get a head start and adjust an existing palette to match your brand, you can save it to your custom tab and fine tune it further.

  1. Within your Color Settings, open the Preset Tab.

  2. Find the palette you wish to edit and click More (...) > Save As Custom.

A copy of the palette will then be saved in the Custom tab. Each scheme within the new palette can be fully customized and you can also create additional ones to choose from.

Note: Customizing color palettes is an advanced feature available with the Website Pro Plan, or the Pro or Ultimate Pixieset Suite plan.

Resetting changes

If you’ve made changes to a palette preset, you can easily undo them and reset colors to their original values. You can reset specific colors or the palette as a whole.

Resetting specific colors

If you’ve made edits within a color scheme, any modified element will show a small dot next to it. You can reset this value by hovering over the modified icon and clicking it when it turns to an x.

Resetting a full palette

If you’ve modified a preset palette, you can completely undo all changes. Simply hover your mouse over the Modified button and click Reset.

If you’ve selected different schemes for specific blocks, you can also reset these back to the default scheme. Within the palette, click More(...) > Reset All Blocks.

Note: Advanced color tools are not currently available for the Avery and West themes.

Did this answer your question?