Moodle 2 Theme Engine

Setting theme colors

On the Colors tab (1) you can set the colors of most items in your theme. Setting colors

  1. Click the colors tab to get to the theme color editor.
  2. Click on an existing color to open the color picker
  3. Select a color by clicking it, or type in the hexadecimal directly (in the # space on the editor).
  4. Click OK to set the color, or cancel to cancel (remember to click Save Changes at the bottom of the form also).
Set color
For example, in the image above we have set the foreground color of the block to FFFFDC.

Example 1: setting the dock color:
Set dock color
  1. We'll start by locating the "Dock Color" row on the form.
  2. Then select the dock Background color by clicking it - this will open the color picker where we can select a color or enter it directly. In this example we entered "D05B17" in the # field
  3. Then click OK.
Finally, click "Save Changes at the bottom of the form.

Once we save our changes, the "Sample" tab updates with the new color settings:

Dock Color Results

Of course the actual dock now shows these colors as well:
Dock Color

Example 2: Updating Block colors

block colors

  1. In this example, we have decided that the light green color that unvisited block links are shown in is too light.
  2. To fix this, we'll go to the colors tab of the RL Master theme, and click the Foreground color
block colors

Choose a new foreground color - here we have chosen #160E86.

Save Changes
Save changes to implement the new color.

See the new color

Now the new color is implemented in the block (note if the color doesn't change, you probably didn't set theme designer mode to on, above. You can also clear your cache to see the changes if you don't want to set theme designer mode to on).

Next we'll change the block background color, just because we can:-).

Changing the block color
Click the Background color field in the Block Color row, and choose a new color. Here we've chosen FFD3A2.
Click OK and save changes as above.
Block Color Changed
Now you can see new block colors.