LWV Logos and Brand Standards

Note: This page is only a summary of common issues with online logo display. A full description of the standards for using LWV logos can be found in the Brand Standards documentation [here]. 

 Official State and Local League logos can be downloaded here.

The main things to keep in mind when using logos on your website:

• Logos should be large enough to be legible and to show the trademark symbol
• Logos should have clear visual space around them
• Logos should not have elements added into them or be altered visually

Clear Visual Space

Make sure your logo, as provided, has a clear visual space between it and any other visual elements. The files provided by LWV does not provide this clear space automatically. The logo image goes right to the edge of the image files. This can be problematic with some NationBuilder templates. 

Header Images

If your NationBuilder template has a colored background for the menu, and the header image cuts up into that background, using the LWV logo as is will produce something that looks like this:

Non-compliant Example

The logo is crashing against the top blue as well as against the gray on the other sides. This does NOT meet the clear space requirement.

Fix

The easiest fix for this is to use an image editing program to put a thick white border around your header image to provide the clear space. 

Avoid Alterations

LWV logos should not be altered. This means they should not have any additional elements added into them, or have changes to font or relative spacing, or be stretched in a way that changes the proportions of the logo. A full set of negative examples are included in the Brand Standards document. Two common alterations are addressed here.

Avoid Stretching

Sometimes when you are resizing the logo in an image or document editor, it can be accidentally resized in a way that breaks the relative proportions.

Original Logo

Stretched Logo: Non-compliant Example

The Fix

Before resizing a LWV logo, make sure that you have constrained the proportions of the image. In some programs, such as document editors, this can be done by pressing and holding a specific key (usually Shift, Ctrl, or Alt) before resizing. In other programs, such as image editors, there may be a setting to constrain the proportions. Often this is shown next to a chain icon, where a broken chain means the proportions are NOT constrained, and an unbroken chain means the proportions ARE constrained.

Note: While sometimes website displays can accidentally stretch images, NationBuilder display parameters usually prevent this from happening. If you suspect the problem is in the display, you can do a right-click to get the pop-up menu, and select the "Open image in new tab" option. If the new tab shows the image correctly, then the issue is with the way the website is displaying the image. Fixing this involves adjusting the image parameters (if you added it into the content) or the template display (if it is uploaded as part of the settings).

Avoid Added Elements 

There should be NO added text or visuals within the provided LWV logo area. Below are a couple of examples of non-compliant additions. The dashed line shows the border of the original logo.

Non-compliant Examples

The Fix

Place desired text and visuals OUTSIDE of the official logo and required clear space. You can do this in an image editor if a single image is needed.

Logos and Backgrounds

The preferred background for LWV logos is white (#ffffff). The .jpg files that are provided have white backgrounds. If it is necessary to use a different background for some reason, the .png files provided have a transparent background that will allow the website background to display through the logo instead. Make sure the background provides high contrast to the logo. If the background color makes the colored version of the logo hard to read, use the gray-scale version of the logo instead. See the Brand Standards document for full details.

In this example, the color logo is easy to read, as there is still a high contrast between the logo and the background

In this example, the color logo is hard to read. 

Non-compliant Example

If the purple background is desired, a gray-scale version of the logo should be used instead.

It is also permissible to change the black part of the gray-scale logo to white (#ffffff) if that makes for a better contrast.