Lookout Ridge IT | Site Help
Type to search documentation.

Step 3: Choose your colors

Every color palette your website can wear, light and dark, side by side. Pick by looking. Also called the theme, the color scheme, or the look.

Ask AI

Your website can wear any one of eighteen color palettes. Each one changes every page at once: the colors, the shape of the buttons, how much the cards lift off the page.

This page shows them in light and in dark, on the same page of a made-up builder’s website. Scroll and pick by looking. Nothing here needs a click.

The two choices

You choose your colors on the Appearance page, under Palette. Each palette is a matched set. Its card shows its name, its two main colors, and a row of small color swatches for light and for dark. Ember Trail, for example, reads ember and amber.

The card marked Host default is the palette we set when we built your site.

Under the palettes is Color mode. Light gives you dark words on a pale background. Dark does the reverse. Every visitor gets the one you pick. There is no switch on your website for them to change it.

Other words people use for the same thing: theme, color scheme, palette, look and feel, design, skin, dark mode, light mode, night mode.

How to change it

Important

New colors reach every page of your website at once. Most of your site follows them on its own. A few parts we styled by hand may not. If something looks wrong, pick your old palette again and everything goes back, then tell us which one you wanted.

Only an Admin user can change the colors. It takes about a minute.

  1. Write down the palette you are on now. Its card is the one picked.
  2. Go to Plugins, then Appearance. It sits in the Site Layout group.
  3. Under Palette, click the card you want.
  4. Under Color mode, click Light or Dark.
  5. Click Preview at the bottom. Your website opens in a new tab with your new colors. Only you can see them.
  6. Happy with it? Go back to the panel tab and click Apply.

A message says the look is saved. Visitors see the new colors the next time a page loads.

Changed your mind before you clicked Apply? Click Discard. Want the palette we set back? Click Use host default above the palette cards, then click Apply.

The same page also sets your style, your fonts and more. Appearance covers all of it.

Switching to Dark? A dark logo can vanish on a dark background. Logo tint, on the same page, can repaint your logo to match. It does not suit every logo. Logo tint explains when to use it.

The eighteen palettes

Each pair below is the same sample page. Light on the left, dark on the right. The pictures all use one style. Your site’s style may lay the page out differently, but the colors are the same.

Default

Indigo and pink. The first palette in the list.

Light

The sample Contact page in the Default palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Default, light.

Dark

The sample Contact page in the Default palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Default, dark.

Earth

Forest green and moss. Warm, natural tones.

Light

The sample Contact page in the Earth palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Earth, light.

Dark

The sample Contact page in the Earth palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Earth, dark.

Blue

Ocean blue and cyan. Cool and clean.

Light

The sample Contact page in the Blue palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Blue, light.

Dark

The sample Contact page in the Blue palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Blue, dark.

Ember Trail

Ember orange and amber on near black. Sharp corners.

Light

The sample Contact page in the Ember Trail palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Ember Trail, light.

Dark

The sample Contact page in the Ember Trail palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Ember Trail, dark.

Pine Hollow

Pine green and teal. Rounded, pill-shaped buttons.

Light

The sample Contact page in the Pine Hollow palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Pine Hollow, light.

Dark

The sample Contact page in the Pine Hollow palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Pine Hollow, dark.

River Bend

Azure and sky blue on a soft gray canvas.

Light

The sample Contact page in the River Bend palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

River Bend, light.

Dark

The sample Contact page in the River Bend palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

River Bend, dark.

Summit Ridge

Crimson and alpine blue. Big rounded corners and pill buttons.

Light

The sample Contact page in the Summit Ridge palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Summit Ridge, light.

Dark

The sample Contact page in the Summit Ridge palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Summit Ridge, dark.

Meadow Pass

Coral and plum on warm white. Cards that lift off the page.

Light

The sample Contact page in the Meadow Pass palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Meadow Pass, light.

Dark

The sample Contact page in the Meadow Pass palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Meadow Pass, dark.

Cedar Brook

Blue and green, with a soft tinted shadow.

Light

The sample Contact page in the Cedar Brook palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Cedar Brook, light.

Dark

The sample Contact page in the Cedar Brook palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Cedar Brook, dark.

Tide Pool

Deep teal and sea green. Nearly flat and very calm.

Light

The sample Contact page in the Tide Pool palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Tide Pool, light.

Dark

The sample Contact page in the Tide Pool palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Tide Pool, dark.

Amber Harvest

Olive and honey gold.

Light

The sample Contact page in the Amber Harvest palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Amber Harvest, light.

Dark

The sample Contact page in the Amber Harvest palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Amber Harvest, dark.

Sunflower Field

Olive and bright gold.

Light

The sample Contact page in the Sunflower Field palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Sunflower Field, light.

Dark

The sample Contact page in the Sunflower Field palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Sunflower Field, dark.

Autumn Sage

Brown and terracotta. No gradients, just solid color.

Light

The sample Contact page in the Autumn Sage palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Autumn Sage, light.

Dark

The sample Contact page in the Autumn Sage palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Autumn Sage, dark.

Harbor Dawn

Navy and warm cream.

Light

The sample Contact page in the Harbor Dawn palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Harbor Dawn, light.

Dark

The sample Contact page in the Harbor Dawn palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Harbor Dawn, dark.

Trailhead

Burnt orange and dusty blue.

Light

The sample Contact page in the Trailhead palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Trailhead, light.

Dark

The sample Contact page in the Trailhead palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Trailhead, dark.

Butter Lagoon

Deep teal and butter gold.

Light

The sample Contact page in the Butter Lagoon palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Butter Lagoon, light.

Dark

The sample Contact page in the Butter Lagoon palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Butter Lagoon, dark.

Marquee Red

Cinema red. No gradients, just solid color.

Light

The sample Contact page in the Marquee Red palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Marquee Red, light.

Dark

The sample Contact page in the Marquee Red palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Marquee Red, dark.

Mountain Sunset

Navy and tangerine on a gray canvas, with white cards. Rounded buttons that are never pills. No gradients, just solid color.

Light

The sample Contact page in the Mountain Sunset palette, light mode: the header, the Get in touch heading, the town buttons, and the form.

Mountain Sunset, light.

Dark

The sample Contact page in the Mountain Sunset palette, dark mode: the header, the Get in touch heading, the town buttons, and the form.

Mountain Sunset, dark.

What done looks like

You have a palette name written down, and your website wears it on the home page and on one inside page. If you changed your mind, the old palette and Apply put it all back.

Next: Step 4: Replace the examples.

Last updated Oct 20, 2026