Primary, Secondary, and Tertiary, and their contrasting colors set in Site Design, are used throughout the website. This ensures that the website has a clean and cohesive look and feel.
Your set colors and counter/contrasting color are found within blocks, header, and footer color settings. These colors are used as text and background (or overlay) color options along with a neutral palette.
Access Your Site Colors
🌟 Tithely Tip: You can choose from (and adjust) the pre-selected palettes on the colors page. If you're looking for more inspiration, check out Adobe Color which has thousands of free color palettes.
Hex colors are supported. Decimal, RGB, or any other format will break the Site (see below for how to fix this).
-
Login to your Tithely account and select Sites from the left-hand menu, or log in to your Tithely site directly.
-
Click the Admin menu at the top right of your site.
-
Select Design.
Here you can see and set your Primary, Secondary, Tertiary, and contrasting colors that are used throughout the website.
What Determines Color Placement?
Primary Color: Hyperlinks
Secondary Color: Headlines (used in news/blog/events)
Tertiary Color: Used for buttons in blocks Primary/Secondary and their counter colors are used in blocks and headers.
When Primary or Secondary is chosen as the overlay color with the text being the Primary or Secondary color and the counter (contrasting) color will be the background (and vice versa).
In Blocks, the colors change depending on what Block color layout you choose.
Color Overlay Combinations and Examples
For the following examples, we will use these colors:
Overlay #1: Primary Background with Primary Counter All Text
Overlay #2: Secondary Background and Secondary Counter All Text
Overlay #3: Tertiary Background and Primary Counter All Text
Overlay #4: Primary Counter Background with Primary Headings and Black Text
Overlay #5: Secondary Counter Background with Secondary Headings and Black Text
Overlay #6: Tertiary Counter Background with Tertiary Headings and Black Text
Overlays 7 through 10 are Neutrals
#7 White text on a dark grey background
#8 Black text on light grey background
#9 Black text on a white background
#10 Dark grey text on a white background (negligible difference on most monitors)
Uh oh! Does your site look broken?
In the event an incorrect color code has been added, your site may look like this:
Don't fret! There's a quick and easy way to fix this - Watch the video below, and in a few simple clicks, your website will be back to normal.
User Permissions needed to access Sites
Account Owner, or Admin. Or Admin Permissions granted directly on the Tithely Site. If you have additional questions, please reference this article.