Styleguide Styleguide

The logo

Download all logo files
The positive logo
This is the default positive mark; use this version in most cases.

Color variations

The logo is available in three color variations:

  • Color: A full color version.
  • Monochrome: A single color version (usually black).
  • Reverse: A version used on dark backgrounds.
  • The color lockup
  • The grayscale lockup
  • The reverse lockup

In compliance with WCAG 2.0 Accessibility guidelines, the logo and its background should always have a contrast ratio of at least 3:1. You can check the contrast ratio using WebAIM’s Contrast Checker tool.

Spacing

To ensure the logo has enough space around it, draw an imaginary box around the wordmark. The box should extend, horizontally and vertically, to the outside of the icon. there should be enough space around this bounding box to place the capital “E” from the logomark on its side both ontop and underneath the logo as well as place a copy of the logomark on each side of the logo. This will ensure optimal spacing around the logo.

Usage guidance

When applying the logo to branded collateral, be sure to follow these guidelines to ensure that the logo is visually clear, legible, and consistent.

  • Do not change the colors in the logo; use only the provided color variations.
  • Do not distort the logo; make sure to preserve its original aspect ratio when scaling up or down.
  • Do not attempt to recreate the logo yourself or use another typeface. Use only the original logo files as-is.
  • Make sure the logo has enough contrast with its background. Use the positive version with a sufficiently light background; use the reverse version with a sufficiently dark background.
  • Do not place the logo over imagery. Always place the logo over a solid background to ensure it has enough spacing and legibility.
  • Do not change the logo colors.
  • Do not distort the logo.
  • Do not attempt to alter or recreate the logo.
  • Make sure the logo has enough contrast with its background.
  • Do not place the logo over imagery.

Summary

  1. Use the default full gradient color logo in most cases. Use the reverse version when there is not enough contrast between the positive version and the background.
  2. If you have a gradient in the background, use a single color version without the gradient.
  3. Use the grayscale and reverse versions only when color is not available or when the color logo will not have enough contrast with its background (e.g. if the background color is teal or coral).