Icons
We use icons to represent ideas and information visually. They capture attention and quickly convey concepts, enhancing user experience.
To create icons that do this effectively and reflect our icon design style, use this info here. This will ensure they are engaging, easy to identify, complementary to content flow, aesthetically pleasing within the design, and meet our guidelines.
Icon Design
Designs should be simple in structure and easy to identify.
Do use icons that are easy to identify and not overly detailed. Below are examples of properly styled Essendant icons.
Don't use complex designs that include a lot of detail and color.
Icon Color
There are three different color variations of icons. Each color should be used in accordance to the background it lives on.
Please refer to the brand colors section of this guide for more in-depth information on color.
Light Background - Primary icon color should be dark blue. Highlights are light blue.
Dark Background - Primary color for reversed out icons is white. Highlights are light blue.
Mid-tone Background - Primary icon color is dark blue. Highlights are white.
Icon Usage and Placement
Take care when placing icons in designs. And make sure they enhance the user experience when used in conjunction with copy.
Do use icons that are proportionate to one other.
Don't stretch, squash or distort icons in any way.
Additional Guidelines
Do allow sufficient spacing between the icon and copy.
Don't crowd icon and copy together.
Do use icons that clearly represent the associated copy.
Don't use icons without a clear connection to the messaging.
Icon Package
Download the Essendant icon package. Icon PNG files and icon reference grid included.