SCI · Style guide
Style guide
Logo, colours, typography and tone for material about the Sustainability Challenge International, such as posters, flyers and social media posts.
Logo, hexagon, fonts and colour swatches in one zip
About SCI
The programme
The Sustainability Challenge International (SCI) brings together students from several universities in small, interdisciplinary teams. Each team works on a sustainability challenge set by a Service Learning Partner, a company, NGO or public organisation, supported by mentors. The teams meet in person at the Summer School.
SCI builds on the Sustainability Challenge, which has run in Austria since 2010.
Motto
Let’s navigate change together
Voice and look
Tone and visual style
Who we talk to
- Students from all disciplines
- Universities and their teaching staff
- Companies, NGOs and public organisations that work with student teams
How we write
- Friendly and plain. We address the reader as “you” and write “we” for SCI.
- Specific rather than general: say what people actually do. Use numbers only when they’re correct.
- British English (programme, colour), headlines in sentence case.
- Write Sustainability Challenge International in full the first time, then SCI. Always capitalised: Service Learning Partner, Summer School, SDGs.
- Eyebrows: a few words in caps, parts separated by a mid-dot, e.g. Summer School · 2027
How it looks
- Light backgrounds, white or a pale tint, and generous spacing.
- Rounded corners on images, cards and boxes. Fully rounded pill shapes only for small labels.
- Thin borders and soft, slightly indigo-tinted shadows rather than hard black ones.
- No pure black or neutral grey: the darkest colours are Navy and Ink.
- Hexagons from the logo as an accent: flat top and bottom, points left and right, softly rounded corners. Between cells, keep the logo’s even gap of about a fifth of the cell height.
- Do use a single hexagon as an icon frame, or a small honeycomb fragment of two or three cells.
- Don’t use hard-cornered or pointy-topped hexagons, or let them overlap.
Examples from our website: a card with a hexagon icon frame, a honeycomb fragment, and a card on a dark background.
Logo
Logo and mark
The four hexagons of the mark stand for interdisciplinary teams working together. Please use the original files from the brand pack.
The brand pack also has SVG versions of all four.
Clear space and size
Leave a clear space of x on every side, where x is the height of one hexagon.
- Full logo: at least 120 px wide on screen, 35 mm in print
- Smaller than that, or as a profile picture: the mark on its own, at least 24 px / 8 mm
xxBackgrounds
- Colour logo on white and the light tints (Lavender, Cream, Mist)
- White logo on Indigo, Navy, the gradients and dark photos
- On a busy photo, place the logo on a solid area or a gradient overlay
Please don’t
- Recolour, stretch or rotate the logo
- Add shadows, outlines or other effects
- Change the position or size of the mark against the wordmark
- Retype the wordmark in another typeface
Colour
Colours
Indigo from the logo is the main brand colour. Amber is used as an accent.
A rough balance for a typical piece. On dark pieces, Navy or Indigo becomes the base and text turns white.
Brand
- HEX
- #3A2DB5
- RGB
- 58 45 181
- CMYK
- 90 / 82 / 0 / 0
- HEX
- #1D1668
- RGB
- 29 22 104
- CMYK
- 100 / 98 / 31 / 18
- HEX
- #EEA244
- RGB
- 238 162 68
- CMYK
- 4 / 42 / 80 / 0
- HEX
- #D58711
- RGB
- 213 135 17
- CMYK
- 14 / 51 / 100 / 3
Text
- HEX
- #303050
- RGB
- 48 48 80
- CMYK
- 88 / 82 / 39 / 38
- HEX
- #54506E
- RGB
- 84 80 110
- CMYK
- 71 / 66 / 35 / 22
- HEX
- #6B6880
- RGB
- 107 104 128
- CMYK
- 61 / 55 / 32 / 16
Tints
- HEX
- #E7E4FC
- RGB
- 231 228 252
- CMYK
- 10 / 12 / 0 / 0
- HEX
- #FEF3E7
- RGB
- 254 243 231
- CMYK
- 0 / 7 / 11 / 0
- HEX
- #F8F8FC
- RGB
- 248 248 252
- CMYK
- 2 / 3 / 0 / 0
- HEX
- #FFFFFF
- RGB
- 255 255 255
- CMYK
- 0 / 0 / 0 / 0
Secondary accents, used sparingly
- HEX
- #B9528E
- RGB
- 185 82 142
- CMYK
- 29 / 79 / 11 / 1
- HEX
- #7A4FC0
- RGB
- 122 79 192
- CMYK
- 70 / 75 / 0 / 0
Gradients
For larger areas and overlays on photos. White text works on all three.
Text on colour
CMYK values are calculated for coated paper (FOGRA39). For larger print runs, ask the printer for a proof of Indigo and Amber.
Typography
Typefaces
Two typefaces, both free under the SIL Open Font License.
The font pack has both typefaces as static files (Regular to Bold) and as variable fonts, plus their licences.
- Outfit for headlines and numbers, Hanken Grotesk for everything else
- Headlines in Navy on light backgrounds, white on dark ones
- Eyebrows in Hanken Grotesk Bold, all caps, letter spacing +5%: Muted on light backgrounds, white at 70% on dark ones
- Numbers and highlighted words in Indigo; emphasis with weight or colour, not italics or underlines
Co-branding
Partner logos and SDGs
With partner logos
- Logos in a row share the same visual height, with enough space between them or a thin dividing line
- Use each partner’s own logo files; on dark backgrounds, their white version if they have one
- A short eyebrow can introduce them, e.g. “In partnership with” or “Funded by”
With the SDGs
- Use the official UN icons and colours without changes
- Keep the SDG colours to the icons themselves
- See the UN guidelines for the SDG icons
Downloads
Brand pack
The logo and mark (SVG and PNG), the hexagon shape, both fonts and the colour swatches (ASE for Adobe apps and a plain list).