Custom Color Theme Creator
Open the Style Customization editor by Edit Site -> Edit Style from the top of your site. Choose the style you want to edit -> Color Theme.
Start creating your Custom Color Scheme by clicking the white plus symbol or editing one of the default color schemes by clicking the pencil.
This is where the fun begins! Below is an example of the Custom Color Scheme Creator.
Name your color scheme and make as many different schemes as you would like.
Below is an example of the Custom Color Scheme Creator.
Notice in the below image, the "Generate Colors" option is selected by default. By keeping it selected, when you change a base color (the options not indented) we will automatically fill the sub-colors (the options indented) with complimentary colors to your choice.
By unchecking that box, you have total control over all 17 site colors.
Once you have created your new color theme, select Keep Change then Publish Changes.
What do all These Custom Colors Change on my Site?
W3Schools.com offers your basic HTML Color Picker and a lot of other CSS and HTML tools.
Color-hex.com is best for people who already know how web color works and just wants to find some more colors that match their idea
Colourlovers.com is a great place for anyone to go and find color schemes people have already made.
Below is an example of the Custom Color Scheme Creator.
Notice in the below image, the "Generate Colors" option is selected by default. By keeping it selected, when you change a base color (the options not indented) we will automatically fill the sub-colors (the options indented) with complimentary colors to your choice.
By unchecking that box, you have total control over all 17 site colors.
Once you have created your new color theme, select Keep Change then Publish Changes.
Pro Tip:
- You can also enter specific colors using either the RGB color codes or HTML color codes. For example either the number (ex. 81C79D) or the # sign in front (ex. #81C79D) . You can also choose the level of transparency by either using the transparency slider or the transparency percentage. 1.00 would not be transparent at all, and 0.01 would be very transparent.
- If you press Cancel after you have selected a new color, it will not revert to the original color. The original color will be saved and listed in one of the color boxes. The top two rows of color boxes are the original colors. Below that are the custom colors you have selected.
Helpful Articles
How Do I Pick a Custom Font?
What do all These Custom Colors Change on my Site?
Check out these sites for choice color inspiration.
W3Schools.com offers your basic HTML Color Picker and a lot of other CSS and HTML tools.
Color-hex.com is best for people who already know how web color works and just wants to find some more colors that match their idea
Colourlovers.com is a great place for anyone to go and find color schemes people have already made.