1. Knowledge Base
  2. >
  3. Change Template Color Theme

Change Template Color Theme

Looking for help for the Gator Website Builder product? Please see Gator's Knowledge Base.
This content only applies to those using Gator Website Builder.

Since each Gator site is entirely customizable, that means you can change the color theme of your entire website quickly and easily. You can also easily alter individual sections colors and backgrounds so that you do not affect the other areas of your site. Every theme has a color scheme and a "palette" of colors that you can change, which will affect every similar element, using that color palette. 

In this article, we will cover How to Change Theme Colors and Background. For the best results, you may want to know already which color scheme your site should follow (such as the color from your logo) and have the color codes (RGB or HEX#) available if possible.


Changing Theme Background Color:

  1. To start with changing the theme background colors, click the Design button on your website builder's left-hand menu.
    User-added image
  2. A pop-up will appear where you will select Background.
    User-added image
  3. In the new menu that appears, you can do the following:
    User-added image
    1. Preview the current background from the monitor simulation.
    2. Customize the background image, colors, opacity, orientation, and alignment.
    3. Change the Theme Background Color by clicking the circular color options.
    4. Replace the background with one of the Textures built into the designer.
    5. Add a stock image to the background.
 

Changing Theme Colors: AKA color palette:

Our team of expert designers has included a collection of color presets that look and work beautifully together. These presets are organized into color palettes under the Sites Presets Collection.  You can color your site automatically by selecting one of these presets, which will work to change the backgrounds, fonts, sections, and links throughout your whole website. Continue reading to learn how to access and edit these presets.

To access the color palettes and edit them:

  1. Continue working from the Design section of the left-hand menu.
    User-added image
  2. Select the Colors option.
    User-added image
  3. In the new menu that appears, a series of available color palettes will appear that will give your site different feelings when applied.
    User-added image
  4. When a color or palette is selected, the colors of the site will automatically change in real-time allowing you to visualize ‘s application.
    User-added image
  5. Click the Revert option to go back to original colors or Apply to save this palette selection.
    User-added image
  6. Optional: If you only want to change one of the palette colors, you can do so by selecting Edit Colors.
    User-added image
  7. From the site colors menu, select the color you want to change, and a Color Picker menu will appear.
    User-added image
  8. Here you can select the color manually or enter in the RGB or HEX values for the color you want.
    User-added image