Icon creation guide

The LeafyGreen system icons are a clear and concise set of glyphs designed to be minimal in form and express a variety of use-cases for all digital products.

Learn more about how to use Icons in product.

• Icons should represent real world things
• Icons should not represent overly complex things, like CalendarEventJulyFourth.
• Refer to this guide and existing icons while building your icon.

How to create an icon

Follow these steps to help maintain a consistent look across new and existing icons.

Stroke weight of negative space

Negative space is a defining feature of our icon set. For optimal rendering and legibility, the stroke width should vary to appear better optically. When designing icons, use the following stroke weights.

Corner radius

The icon set has predominately rounded corners and caps, but it’s important to note that it also allows for sharp corners occasionally.

Things to avoid while creating

To ensure consistency and quality for your icon, avoid these common mistakes.

How to prepare your final icon

Follow these steps to help maintain a consistent look across new and existing icons.