SHOUT Styleguide
You can download all files, fonts and so on at the bottom of this article.
We’ve created this logo, fonts, colours and general outing style to make sure SHOUT becomes a recognisable ‘brand’ and shows a level of professionalism that is needed to work with the bigger national organisations while keeping appeal to our local community. Please stick to this styleguide when you’re doing work for SHOUT.
Use of the logo
This is our brand. Keep it consistent throughout our outings in print and online.
- Always position the logo straight up, never rotate it. Not even a bit.
- Make sure there’s sufficient space around it to let it breathe and claim it’s own visual attention.
- Never put extra outlines around it, never change colors or appearance in any way.
The logo is designed in such a way that it should be easy to integrate in any design.
If the logo doesn’t work well with a background, for instance on a poster, alter the poster design to accomodate the logo better.
The logo always has prevalence over the design and background of a poster or design.
We want the logo to become a recognisable item and it should be included in any and every folder, poster, flyer or other commercial outing of SHOUT.
Online and on official communication such as letters or folders, the logo should be put preferrably on a white background.
On printed posters the logo may be put on any background.
Always make sure it’s clearly visible and readable.
Headers: Google font Strait
Subheader: Google font Nunito Light – There should be an introduction or small first paragraph in bold Nunito Light font, just like this.
Then the rest of the text may follow in Google font Nunito Light. Nunito is designed to be well readable especially for dyslexic people. The pun of using a font called Strait is nice for an LGBTQ+ association and the font delivers a bit of ‘kick’ as a companion to the more friendly looking Nunito Light font.
Color use
Please use the colors as defined here. Normally we would use a white background.
Colors
#3f3f3f
#565656
#a8a8a8
#54abe5
#0c71c3
#9fcc6c
#f6208a
White Bold text on a pink background for special blocks and notices
Regular text for less important items
“Darkblue Artifika font ( #0c71c3 ) text on a grey background for quotes and interest notifications ”
Optionally a light blue line on the side of the area
A footer header
This is for website footers and so on. #eaeaea
A website footer – bg color #232323
The logo as it should be used on a dark background
The rainbow element may be used like below, as footer or header line – small and unobtrusive, just a hint, or as break in print and online.
In the Zip file, which you can download with the button below, you will find all files in PSD or AI format, as well as png or jpg format. Now go and make beautiful things!