SCGA Design Style Guide

Logo, Fonts & Colours

Details on the SCGA logo, fonts used in the logo and on the site, plus Primary and Secondary defined colours.

Primary colours

The first primary accent colour is a dark blue. Used in the logo together with a paler blue, it is the key colour used on the website to highlight blocks, elements and backgrounds.

Hex #005F9B / RGB 0,95,155 / CMYK 95,65,13,1

Dark blue


R – 0

G – 95

B – 155

C – 95

M – 65

Y – 13

K – 1

The second primary accent colour is a pale blue. Used in the logo together with the dark blue, it is used for contrast and secondary elements and backgrounds.

Hex #158DCD / RGB 21,141,205 / CMYK 79,33,0,0

Pale blue


R – 21

G – 141

B – 205

C – 79

M – 33

Y – 0

K – 0


The logo must always be used in full with the acronym, the globe and the wording below. The acronym is dark blue at the top and pale blue at the bottom with a gradient at 50% middle.

The globe is an embedded image with a mask achieving the same gradient. The wording beneath the acronym uses pale blue for the lower-case letters and dark blue for the upper-case letters.

Logo image for the Scottish Council on Global Affairs

Logo alternative, white

If the logo needs to sit on top of an image or coloured backdrop then there is also a white version – all text and the globe are 100% white, no gradients or masks.

Logo files for download:

Logo fonts

There are two fonts used in the logo – these are not the fonts used for copy. The font for the letters SCGA is Gotham Medium from Hoefler & Co. and the font used for the wording below is Swiss 721 Std Light from Bitstream.

Print & site fonts, headings and sub-headings

Headings use the Google font ‘Playfair Display’. On the website they’re used at these sizes:

Heading 1 (H1): 40px

Heading 2 (H2): 30px

Heading 3 (H3): 24px

Heading 4 (H4): 19px

These are the desktop sizes and will change at smaller viewports. Font weight is set to 400 with a line height of 1.2 EM.

Print & site fonts, paragraphs, body & buttons

We use the Google font ‘Inter‘ at 17px, weight ‘Normal’.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Secondary colours

The website has an additional 4 colours specified in a global palette.
They are used sparingly but are available for use where deemed appropriate.

The first accent colour is a dark-ish purple. Used in buttons and to define a category section.

Hex #844E85 / RGB 132,78,133 / CMYK 54,81,20,3



R – 132

G – 78

B – 133

C – 54

M – 81

Y – 20

K – 3

The second accent colour is pale gold. Used to define a category section.

Hex #BAA898 / RGB 186,168,152 / CMYK 27,31,39,0

Pale gold


R – 186

G – 168

B – 152

C – 27

M – 31

Y – 39

K – 0

The third accent colour is a blue variant. Used to define a category section.

Hex #2C73BC / RGB 35,115,188 / CMYK 84,52,0,0

Blue variant 1


R – 35

G – 115

B – 188

C – 84

M – 52

Y – 0

K – 0

The fourth accent colour is another blue/purple variant. Used to define a category section.

Hex #58609C / RGB 88,96,156 / CMYK 75,68,11,1

Blue variant 2


R – 88

G – 96

B – 156

C – 75

M – 68

Y – 11

K – 1