Material 3 Icons

We use Material 3 Icons as our icon set of choice—because they’re clean, scalable, and incredibly well-supported across both design and code.

🌟 Why Material Icons?

Material Icons offer a massive, consistent set of symbols that cover nearly every use case—from navigation to notifications to niche UI moments (yes, there's even an icon for “compost”). Here’s why we chose them:

• Maintained and regularly updated by Google

• Optimized for accessibility and readability at all sizes

• Available in multiple styles: outlined, filled, rounded, and more

• Already familiar to most users and developers

Plus, they align well with modern UI design practices and are easy to customize.

🛠 Using the Material Icons Plugin in Figma

To insert icons into your designs quickly:

1. Open Figma and go to Plugins → Browse Plugins

2. Search for "Material Symbols" or "Material Design Icons"

3. Install the official plugin by Google (or your team’s preferred one)

4. Open the plugin in your file

5. Search and insert the icon you need

6. Set the style (outlined, filled, rounded, etc.) to match your visual tone

💡 Pro tip: Use the outlined style by default to match our system's minimalist visual language.

Icons should be treated as components or tokens where possible. Avoid uploading custom SVGs unless absolutely necessary—consistency and accessibility come first!