What is it?

The second thing to consider when creating or amending a [Skin] – is what [Colours] would you like to use throughout the website?

Via the control panel you can select and define the [Colours] and [Font Colours] that will be used on your website.

Current Skin

Displays the current [Skin] that your website is using. Any changes to the [Colours] and [Font Colours] will be saved under this [Skin].

Font colours*

*Please Note: If you enter [NONE] into the colour fields, no colour attribute will be assigned to a specific section.

Main Font

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Main font] that is to be used on your website. After you have selected your [Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Header Font

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Header font] that is to be used on your website. The [Header Font] will be displayed only when inputting code or text into the

HTML  # header #

section of the CMS. After you have selected your [Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Sub Content Font

HTML  # subcontent #

section of the CMS. After you have selected your [Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Footer Font

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Footer font] that is to be used on your website. The [Footer Font] will be displayed only when inputting code or text into the

HTML # footer #

section of the CMS. After you have selected your [Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Heading 1

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the main heading that is to be used on your website. After you have selected your [Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Heading 2

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the secondary main heading that is to be used on your website. After you have selected your [Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Link Normal

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of a [Normal Link] that is to be used on your website. This will configure the “normal” colour state (i.e. when the mouse isn’t on a text link). After you have selected your [Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Link Hover

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Hover Link] that is to be used on your website. This will configure the “hover” colour state (i.e. when the mouse is over a text link). After you have selected your [Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Horizontal navigation links*

*Please Note: If you enter [NONE] into the colour fields, no colour attribute will be assigned to a specific section.

Link normal

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Horizontal Navigation] link that is to be used on your website. This will configure the “normal” colour state (i.e. the colour to display when the mouse isn’t over a text link). After you have selected your [Horizontal Navigation Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Link hover

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Horizontal Navigation] link that is to be used on your website. This will configure the “hover” colour state (i.e. the colour to display when the mouse is over a text link). After you have selected your [Horizontal Navigation Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Link down

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Horizontal Navigation] link that is to be used on your website. This will configure the “down” colour state (i.e. the colour to display when the mouse has clicked on a link). After you have selected your [Horizontal Navigation Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Layout colour scheme*

*Please Note: If you enter [NONE] into the colour fields, no colour attribute will be assigned to a specific section.

Background

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Background] that is to be used on your website. The [Background] is the area around your website, when the website is of a fixed width that is smaller than your browser. After you have selected your [Layout Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Frame

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Frame] that is to be used on your website. After you have selected your [Layout Colour], click the [Submit] button to confirm your choices and [Save] your changes.

For more information on the [Frame] attribute view the [Padding] section of the CMS.

Canvas

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Canvas] that is to be used on your website. The [Canvas] is the area directly below any content on your website. After you have selected your [Layout Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Header

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Header] that is to be used on your website. The [Header] is the area displayed at the top of your website. After you have selected your [Layout Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Content

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Content] that is to be used on your website. The [Content] colour is the area displayed directly underneath any content (Text + Images) of your website. After you have selected your [Layout Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Subcontent

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Subcontent] that is to be used on your website. The [Subcontent] colour is the area displayed directly underneath the [Vertical Navigation] of your website. After you have selected your [Layout Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Footer

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Footer] that is to be used on your website. The [Footer] colour is the area displayed directly at the bottom of your website. After you have selected your [Layout Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Vertical navigation links*

*Please Note: If you enter [NONE] into the colour fields, no colour attribute will be assigned to a specific section.

Link normal

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Vertical Navigation] link that is to be used on your website. This will configure the “normal” colour state (i.e. the colour to display when the mouse isn’t over a text link). After you have selected your [Vertical Navigation Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Link hover

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Vertical Navigation] link that is to be used on your website. This will configure the “hover” colour state (i.e. the colour to display when the mouse is over a text link). After you have selected your [Vertical Navigation Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Link down

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Vertical Navigation] link that is to be used on your website. This will configure the “down” colour state (i.e. the colour to display when the mouse has clicked on a link). After you have selected your [Vertical Navigation Font Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Horizontal navigation and button background colours*

*Please Note: If you enter [NONE] into the colour fields, no colour attribute will be assigned to a specific section.

Navigation background

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Horizontal Navigation Background] that is to be used on your website. After you have selected your [Horizontal Navigation Colour], click the [Submit] button to confirm your choices and [Save] your changes.

Default button background

The [Default button background] colour is the area behind non active navigation links. After you have selected the [Default button background] colour, click the [Submit] button to confirm your choices and [Save] your changes.

Highlight button background

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Highlight Button Background] that is to be used on your [Horizontal Navigation].

This will configure the “highlight” colour state (i.e. the colour to display when the mouse is over a navigation link). After you have selected the [Highlight button background] colour, click the [Submit] button to confirm your choices and [Save] your changes.

Selected button background

This will configure the “down” colour state (i.e. the colour to display when you have clicked a link). After you have configured the [Selected button background] colour, click the [Submit] button to confirm your choices and [Save] your changes.

Vertical navigation and button background colours*

*Please Note: If you enter [NONE] into the colour fields, no colour attribute will be assigned to a specific section.

Navigation background

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Vertical Navigation Background] that is to be used on your website. After you have selected your [Vertical Navigation Background] colour, click the [Submit] button to confirm your choices and [Save] your changes.

Default button background

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Default Button Background] that is to be used on your [Vertical Navigation]. The [Default button background] colour is the area behind non active navigation links. After you have selected the [Default button background] colour, click the [Submit] button to confirm your choices and [Save] your changes.

Highlight button background

This will configure the “highlight” background colour state (i.e. the colour to display when the mouse is over a navigation link in the Vertical Navigation). After you have selected the [Highlight button background] colour, click the [Submit] button to confirm your choices and [Save] your changes.

Selected button background

By either entering a [Hex Code] (#000000 = Black), typing the colour name (BLACK) or selecting a colour from our [Interactive Colour Picker] – you can change the colour of the [Selected Button Background] that is to be used on your [Vertical Navigation]. This will configure the “down” colour state (i.e. the colour to display when you have clicked a link in the Vertical Navigation). After you have configured the [Selected button background] colour, click the [Submit] button to confirm your choices and [Save] your changes.