Here, at LearnWorlds, we analyzed thousands of websites to develop a simplified color scheme system for your school’s site. It’s important to understand the system’s underlying architecture to make use of its full potential.
Your brand color choice has a powerful impact on how your customers perceive your business. You can find a list with some recommended articles on how to choose your brand color schemes:
To select or modify your school’s color scheme:
1 Navigate from your admin menu to the "Site Builder".
2 Choose the Colors Tab from the Theme Explorer’s menu.
Brand colors represent your school’s brand identity and help establish familiarity with your users. They’ll generally consist of one main color and two supporting accent colors. However, if your brand only uses one color, it's possible to select the same color for all three fields.
Additionally, we have found that most websites use three different background colors for each of their sections. A dark color is used to make the other colors stand out, and seem more vibrant. While light and white colors are used as separators to create eye-catching designs on the page. Utilizing all 3 color sets will allow for the creation of beautiful and elaborate backgrounds.
Should you prefer a more sophisticated look, try setting all three color sets to black.
Or perhaps you’d like to try a clean white design.
Sometimes choosing a dark or light background won’t necessarily work with the selected text color. You may select which text color is displayed with your Brand & Background colors.
Toggle dark or light text for each color by clicking on the option displayed below each color box.
When editing colors on the page, you’ll notice that the colors you selected within the theme explorer appear as the background color of the Properties menu on the right. We recommend using these colors to maintain consistency across your school’s site.
Selecting a background color from your color scheme will change both the background and text colors. Keep in mind that using a color outside of your scheme will only change the background and you’ll need to manually update the text.
Specifically, the top row (theme explorer colors) changes the background color using a CSS class, which is what allows the text to change, while the rest of the colors are added simply as inline styles. Thus it carries no information regarding text, they just change the background color.
Now, it’s time to see how to use your Color Palette. Click on a color box to open the Color Palette.
1On your right, the left slide bar will adjust the hue.
2The right slide bar adjusts the transparency.
3 You may also select a color by entering a HEXA.
4Or you may also select one by using RGB code.
5 Choosing a color will add it to Your Color Scheme for easy access. We recommend using these colors when designing your individual pages.
Don’t forget to click “Save” at the top of the page before leaving the page! :)