
Typography
Our Font Families
Our font families should be used for all communications. This to ensure the consistent look and feel of all literature off and online.
Logo Typeface
Futura SH Font was used in building the Primary Logo for Outsource and should only be used in any re-creations of this.
Futura SH LOGO
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890(,.;:?!$&*)
Futura SH
Weight: 500
Style: Bold
Document Fonts
For all main typesetting in documents and advertising, where possible, the Segoe UI Font Family should be used. To ensure a consistent look, make sure fonts are used in a consistent manner and the weights of the font have been considered, using heavier weights for headers and the highlight key messages.
Segoe UI DOCUMENTS
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890(,.;:?!$&*)
Segoe UI
Weight: 300
Style: Light
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890(,.;:?!$&*)
Segoe UI
Weight: 300
Style: Light Italic
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890(,.;:?!$&*)
Segoe UI
Weight: 300
Style: Semilight
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890(,.;:?!$&*)
Segoe UI
Weight: 300
Style: Semilight Italic
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890(,.;:?!$&*)
Segoe UI
Weight: 300
Style: Regular
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890(,.;:?!$&*)
Segoe UI
Weight: 300
Style: Italic
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890(,.;:?!$&*)
Segoe Bold
Weight: 700
Style: Bold
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890(,.;:?!$&*)
Segoe Bold
Weight: 700
Style: Bold Italic
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890(,.;:?!$&*)
Segoe Bold
Weight: 700
Style: Black
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890(,.;:?!$&*)
Segoe Bold
Weight: 700
Style: Black Italic
Usage
CSS
font-family: ‘futurash-boldregular’, sans-serif;
font-family: ‘Segoe UI’, sans-serif;
Download
Web Styles
For development, see the production ready frontend pattern called Headings.
Heading Styles
Hero Title
Weight: bold
Style: normal
Size: 60px
Line Height: 1.15
Text Colour: #02546E
Background: •#FFFFFF
Text Colours
Background Colours
Hero Title
Weight: bold
Style: normal
Size: 40px
Line Height: 1.4
Text Colour: #444444
Background: •#FFFFFF
Text Colours
Background Colours
Hero Title
Weight: bold
Style: normal
Size: 22px
Line Height: 1.4
Text Colour: #444444
Background: •#FFFFFF
Text Colours
Background Colours
Hero Title
Weight: bold
Style: normal
Size: 20px
Line Height: 1.4
Text Colour: #444444
Background: •#FFFFFF
Text Colours
Background Colours
Hero Title
Weight: bold
Style: normal
Size: 15px
Line Height: 1.4
Text Colour: #444444
Background: •#FFFFFF
Text Colours
Background Colours
Hero Title
Weight: bold
Style: normal
Size: 14px
Line Height: 1.4
Text Colour: #444444
Background: •#FFFFFF