Change your website colors and switch to dark mode

Change your colors

1. In the sidebar, click themes and double-click your active theme.
2. On the Colors tab, click the Accent, Gray or Background swatch and pick a color, or type a hex code such as #5b5bd6.
3. Check the result on the canvas, or switch it to Brand guide to see every shade and its contrast grade.
4. Click publish.

Switch between light and dark

1. On the Colors tab, set Appearance to Light or Dark.
2. If your background doesn't suit the new mode, Pixelesq swaps it for you and offers Undo.
3. Click publish.

Limits

• Every shade on your site is built from Accent, Gray and Background.
• Light or dark is one setting for the whole site. It doesn't follow each visitor's device setting.
• Contrast grades show in the brand guide. The editor doesn't check contrast as you pick.
• Pixel can't change these colors, so change them here.
• The picker's Clear and gradient options do nothing here.

Common questions

Why don't my new colors show on my site?

Publish the theme, and make sure it's your active theme. See Publish a theme and make it active.

What does "Invalid color format" mean?

Type the color as a hex code, such as #5b5bd6.

Can I preview dark sections?

Turn on Dark section in the canvas toolbar to see how inverted sections look.