...
- Icons must be delivered to us in SVG file format.
- The SVGs files should meet the following technical qualifications:
No SVG elements except for paths.
- Flatten the SVG as much as possible.
Avoid groups or transforms if possible. No guarantee for icons working with complex groups and transforms.
- Don't use "shadow" and "stroke" effects. Flatten strokes into geometries with fill instead.
- Use only flat fills, not gradients or transparency.
Height and width should be around 31x31, although other sizes work.
- Units must be in pixels.
...
Our rule-of-thumb is to have icons designed as 34x34 in a 50x50 box, and then adjusting individually as necessary. That should result in around 16% whitespace on each side of the icon.
Example:
Design Icons to be displayed on non-white backgrounds.
...
Don't have transparent "holes" in your icons. Test your icons on top of a color background and see that nothing of the background is visible through your icon.
Exmample:
...
Example:
Design icons to be readable on "noisy" backgrounds
Adding a thin, white border around the icons will make them more legible when placed on top of various backgrounds.
Example:
Questions? Need help?
As always - we are available to assist in helping you if you have questions or need extra help in getting your icons to work.
Don't hesitate to send us an email.