Colors

Transcript
Theming helps make pages and content look exactly as we want. To achieve this, we navigate to the theming area. Here, the currently applied theme to our course is indicated by a border around it.

This is one of the built-in themes, which can't be edited, so we need to create our own theme to brand this course to our liking. It's as easy as selecting Create, then giving it a name, and confirming. Here is our theme ready to customize. Just use the pencil icon to open up the theme editor.

What we see now is a version of the page builder that's been laid out so that we can see all of the types of elements that we might find in our course and can theme them all together. Each theme has three main colors, which are that of all text on the left, the background color in the middle, and on the right, the color of the accessories, such as, interactive elements, borders, and buttons.

So, to change the color of our text, we just click into the color bar, and then select the Text color patch, which will bring up the color picker.. We can choose any color, just make sure to keep a good contrast with the proposed background for good legibility and accessibility. Here we have chosen a solid dark blue, and the color is instantly updating in the preview window as we change that.

If our company branding guidelines have particular colors, we can make use of those too. Let's leave our background as white, and set our primary color for elements to match our text. We can pick the color, or alternatively copy these HEX codes, so that we know the colors will be identical, by pasting the code in the field .We can also change the opacity of colors using the slider, and also the hue, to find just the colors we want.

As well as the three main colors. We also have advanced settings. If you click on the show more button, you can change the colors of other interface defaults. Elements such as the check marks that appear when you've answered a question correctly, the crosses that appear when you have something incorrect, items that are inactive and can't be clicked upon, and various others, such as the border of elements.

You also have up to six further colors that you can customize and name . We can also set individual colors for the different available text styles. So, for example, any text we format as a heading on the page, we might want to have as a slightly different color to those of our paragraph text.

We can also customize captions, links, and quotes to be different colors.