Basic application icons used in forms, components and copy
Don’t mix styles
There are two popular icon styles: outline and filled
Exception: Use filled style to show an active state.
Think twice paint once
Generally, icons change colors after shifting their state: hover, active, focus, error, success. Omit use of colors without the intention of indicating their state.
Exception: Some apps are well suited for colored icons. This approach creates a playful atmosphere. It also may work as color coding.
Use popular sizing
Basic icon sizes are 18x18px and 24x24px.
Add details with purpose
Avoid high-detailed icons as they distract from main thing. Simplify them for better clarity.