NCC homepage

The NCC homepage consists of two different sections; the news and campaigns tiles (positioned at the top of the homepage) and the council services icons (positioned at the bottom of the homepage).

News tiles web part

The news tiles web part has been designed in a checker board style that alternates between news items and campaign tiles. The web part is dynamic so that every time something is published, it automatically updates.

Homepage news tilesNew items

Each news item must have an image in order for the news tiles web part to remain in the checker board style. If an image is not added then the tile will default to the corporate purple colour and will break the correct look of the web part.

News item text

The text that sits on top of the image is picked up from the short title of the news item. To ensure that the web part remains tidy, you must ensure that you give the news item a short title that will equate to no longer than a maximum of 3 lines on the news tile (roughly 60 characters).

The text colour must always remain white, this is set up as a default so you do not need to specify this within the text colour field.

News item text background colour

The news item text background colour must remain black with an opacity of 0.8. This is set as the default so there is no need to input the colour.

The rgba code for this is ‘rgba(0,0,0,0.8)’.

Promoted tile (sits at the top of the web part)

The promoted tile sits at the top of the web part. It stands out and allows you to promote a specific item. It can feature either a news item or a campaign.

Homepage promoted tileThe promoted tile picks up the title of the item and must contain an image. You must also insert some promotional text (no longer than one sentence), this is the sentence underneath the title.

You do not always have to have a promoted tile featured and it can be taken off, or added back on at any time.

Campaign tiles

The campaign tiles are the coloured blocks, which remain in the same checker board style and sit in between each news item. They can be changed and moved around at any time.

Campaign tile 

Campaign tile colours

The colours of the campaign tiles must stick within the NCC brand guidelines. This means that the tiles must use either the service's theme colour or NCC’s primary or secondary brand colours:


When referring to or linking to a specific service area, you must use their theme colour. If they do not have a theme colour, then you may use the NCC primary colour or secondary colours.

services colours.PNG 

NCC primary and secondary colours

You may use any of these colours where the service or subject you are referring to does not have a theme colour.

ncc brand colours.PNGCouncil service icons

Icons are used at the bottom of the homepage to represent our different council services and their top tasks.

svg icons homepage.PNGIcon size

The large circle icon must be used for the homepage icons.

Icon colour

The icon colour must remain black: #000000.

The background colour of the icons must be #d6d6d6.

Icon hover colour

The background hover colour turns to a darker shade of grey, the code for this is: #b7b7b7. Icon hover colour stays black: #000000.

Icon links

The maximum number of links underneath the icon and the heading is 4. This is to ensure that the council services area remains tidy.

How to use the SVG icons web part

For instructions on how to use the SVG icon web part, visit the ‘Icons’ section of the design guide.

 Back to

 ‭(Hidden)‬ Related pages

Please Add Some Content

 ‭(Hidden)‬ Useful links

Please Add Some Content