Our Logo
Logomark
Our logomark must always be depicted in our official colours, exclusively. Unless you are using it as a watermark, it should always be depicted using a colour combination that ensures optimal contrast against its background. This means that when using one of our dark colours as background, light colours should be used for the logomark, and vice-versa.
Understanding Contrast Ratios
When applying colours to any of your design elements, you want to ensure that there is sufficient contrast for the logomark in our logo to be clearly seen, and for the logotype to be legible. This is specially important if targeting audiences that may have visual issues. The controls on this page show you the WCAG AAA ratings between your chosen background colour and any other colours you are applying. Clicking on the rating will give you the precise contrast ratio.
The contrast ratio between 2 colours is measured on a scale from 1 (no contrast at all) to 21 (maximum contrast between total white and total black). In order for a large logomark to be clearly recognisable, and large heading text to be legible, there must be a contrast ratio of at least 4.5 — that is an "AA" rating. For normal body text and smaller logomarks, a contrast ratio of at least 7 is required, which is "AAA" rating.
The contrast ratio between 2 colours is measured on a scale from 1 (no contrast at all) to 21 (maximum contrast between total white and total black). In order for a large logomark to be clearly recognisable, and large heading text to be legible, there must be a contrast ratio of at least 4.5 — that is an "AA" rating. For normal body text and smaller logomarks, a contrast ratio of at least 7 is required, which is "AAA" rating.
Logotype
Our logotype was carefully crafted using characters from the Source Sans 3 font family, freely available from the Google Font library at: https://fonts.google.com/specimen/Source+Sans+3.
Our logotype must never be used as a watermark, and must always be displayed in a colour that is highly contrasting with its background: if it is typeset using light colours, then its background should be in one of our dark colours, and vice-versa. The word "Webstudio" must always be in a different colour from the word " ACADEMY".
Full Logo
Our full logo must never be used as a watermark — use the logomark instead. This means that it should always be displayed in colours that are highly contrasting with its background: if the background uses one of our light colours, then the logo should use our dark colours, and vice-versa. Always make sure that The word "ACADEMY" and the Logomark are the same colour, and that this is a different colour from the word "Webstudio".
