Custom Themes

You can select a colour theme for your branch/website.  In t4, colour choices are known as Custom Themes. If you don't define a custom theme, your pages will inherit the colour theme from the first Custom Theme above your branch.

Each Custom Theme is made up of four colours from the College colour palette. ‘Primary’, ‘Secondary A’, ‘Secondary B’ and ‘Accent’.

Give it a try

To add a Custom Theme for a set of pages within the site, it will need to be 'activated' for that section.  Follow the instructions below:

1. Go the top page of your site structure, and create a hidden section called 'Custom Theme'. The name is case sensitive and it must not contain additional spaces or characters.  See the screenshot below;

2. Uncheck the 'Show in navigation' box in the form and hit the 'add' button;

The system will detect the name of the section, recognise that it is a special folder and no longer treat it is a sub-page.

Screen grab of the folder structure Note: the grey folder denotes a section that is hidden from the navigation.

3. Go to your Custom Theme section in the site structure, hover over the yellow drop down button and click 'Add content'.  Choose the Custom Theme content type. (Find out more information about adding a content type to a section);

4. Give your content the name, 'Custom theme';

5. Choose a colour theme from the dropdown list, e.g. 'Green';

6. Leave the Local footer section as it is. See Local footer for guidance.

Screengrab of selector 

7. Click Add and Approve to save.

8. Preview the results and publish the branch when you're happy. you will need to publish the entire branch for the changes to filter down.

You can add as many Custom Themes as you like to different branches within your website.

The nine colour themes

Blue

Blue

Primary - Blue

CMYK 100.70.0.0;
PMS-293;
RGB-0.110.175;
HEX-#006EAF

Dear teal

Secondary A - Dark Teal

CMYK-100.0.25.50;
PMS-3155;
RGB-15.130.145;
HEX-#0F8291

Imperial Blue

Secondary B - Imperial Blue

CMYK-100.61.0.45;
PMS-541;
RGB-0.62.116;
HEX-#003E74

Pool Blue

Accent - Pool Blue

CMYK-75.0.0.0;
PMS-306;
RGB-12.161.205;
HEX-#00ACD7

Brick/Navy/Teal

Brick

Primary - Brick

CMYK-20.100.100.20;
PMS 207;
RGB-165.25.0;
HEX-#A51900

Navy

Secondary A - Navy

CMYK-100.55.0.85;
PMS-539;
RGB-0.33.71;
HEX-#002147

Dear teal

Secondary B - Dark Teal

CMYK-100.0.25.50;
PMS-3155;
RGB-15.130.145;
HEX-#0F8291

Tangerine

Accent - Tangerine

CMYK-0.45.100.0;
PMS-151;
RGB-236.115.0;
HEX-#EC7300

Green

Dark green

Primary - Dark Green

CMYK-100.0.100.15;
PMS-348;
RGB-2.137.59;
HEX-#02893B

Dear teal

Secondary A - Dark Teal

CMYK-100.0.25.50;
PMS-3155;
RGB-15.130.145;
HEX-#0F8291

Blue

Secondary B - Blue

CMYK 100.70.0.0;
PMS-293;
RGB-0.110.175;
HEX-#006EAF

Kermit green

Accent - Kermit Green

CMYK-70.0.100.0;
PMS-368;
RGB-102.164.10;
HEX-#66A40A

Orange/Green/Imperial Blue

Orange

Primary - Orange

CMYK-0.76.100.0;
PMS-166;
RGB-210.64.0;
HEX-#D24000

Dark green

Secondary A - Dark Green

CMYK-100.0.100.15;
PMS-348;
RGB-2.137.59;
HEX-#02893B

Imperial Blue

Secondary B - Imperial Blue

CMYK-100.61.0.45;
PMS-541;
RGB-0.62.116;
HEX-#003E74

Pool Blue

Accent - Pool Blue

CMYK-75.0.0.0;
PMS-306;
RGB-12.161.205;
HEX-#00ACD7

Pink

Magenta pink

Primary - Magenta Pink

CMYK-0.100.9.4;
PMS-Rubine Red;
RGB-200.30.120;
HEX-#C81E78

Violet

Secondary A - Violet

CMYK-34.100.0.0;
PMS-2405;
RGB-150.0.120;
HEX-#960078

Plum

Secondary B - Plum

CMYK-100.100.0.3;
PMS-2105;
RGB-50.30.109;
HEX-#321E6D

Purple

Accent - Purple

CMYK-88.86.0.0;
PMS-2098;
RGB-101.48.152;
HEX-#653098

Purple/Violet/Navy/Pool blue

Purple

Primary - Purple

CMYK-88.86.0.0;
PMS-2098;
RGB-101.48.152;
HEX-#653098

Violet

Secondary A - Violet

CMYK-34.100.0.0;
PMS-2405;
RGB-150.0.120;
HEX-#960078

Navy

Secondary B - Navy

CMYK-100.55.0.85;
PMS-539;
RGB-0.33.71;
HEX-#002147

Pool Blue

Accent - Pool Blue

CMYK-75.0.0.0;
PMS-306;
RGB-12.161.205;
HEX-#00ACD7

Red

Brick

Primary - Brick

CMYK-20.100.100.20;
PMS 207;
RGB-165.25.0;
HEX-#A51900

Orange

Secondary A - Orange

CMYK-0.76.100.0;
PMS-166;
RGB-210.64.0;
HEX-#D24000

Imperial Blue

Secondary B - Imperial Blue

CMYK-100.61.0.45;
PMS-541;
RGB-0.62.116;
HEX-#003E74

Tangerine

Accent - Tangerine

CMYK-0.45.100.0;
PMS-151;
RGB-236.115.0;
HEX-#EC7300

Teal/Blue/Plum

Dear teal

Primary - Dark Teal

CMYK-100.0.25.50;
PMS-3155;
RGB-15.130.145;
HEX-#0F8291

Blue

Secondary A - Blue

CMYK 100.70.0.0;
PMS-293;
RGB-0.110.175;
HEX-#006EAF

Plum

Secondary B - Plum

CMYK-100.100.0.3;
PMS-2105;
RGB-50.30.109;
HEX-#321E6D

Seaglass

Accent - Seaglass

CMYK-75.0.25.0;
PMS-3115;
RGB-55.159.159;
HEX-#379f9f

Violet/Blue/Navy

Violet

Secondary A - Violet

CMYK-34.100.0.0;
PMS-2405;
RGB-150.0.120;
HEX-#960078

Blue

Secondary A - Blue

CMYK 100.70.0.0;
PMS-293;
RGB-0.110.175;
HEX-#006EAF

Navy

Secondary B - Navy

CMYK-100.55.0.85;
PMS-539;
RGB-0.33.71;
HEX-#002147

Pool Blue

Accent - Pool Blue

CMYK-75.0.0.0;
PMS-306;
RGB-12.161.205;
HEX-#00ACD7