MAGNT
Brand Identity • Guidelines

Icon Style Guidelines (Simple Rules)

Icons are a tiny detail that make your brand look “designed” when they’re consistent—and messy when they’re not. Use these rules to standardize your icon style.

Back to Identity & Design Hub Document in guidelines

4 rules to standardize your icons

You don’t need a fancy system. You need a few decisions that stay consistent.

Pick outline OR filled (don’t mix)
Mixing styles makes the UI feel inconsistent immediately.

Choose one
  • Outline icons everywhere
  • Filled icons everywhere

Standardize stroke weight
Different stroke weights look like icons from different brands.

Choose one
  • 1.5px stroke
  • 2px stroke
  • 2.5px stroke

Standardize corners (sharp vs rounded)
Corner style affects “personality” (friendly vs serious).

Choose one
  • Rounded corners
  • Sharp corners

Use consistent sizing and alignment
Icons “jump” visually when they’re not aligned or sized consistently.

Choose one
  • 16px for inline text
  • 20px for UI labels
  • 24px for feature blocks

Quick checklist (before you publish)

Checklist

  • Do icons share the same style (outline/filled)?
  • Do they share the same stroke weight?
  • Do they share the same corner style?
  • Are they aligned to the same baseline and size within sections?
  • Are you using icons to clarify meaning (not as decoration only)?

Using 5 different icon sets

Fix: Pick one icon set and stick to it. Consistency matters more than “perfect” icons.

Icons that don’t match typography weight

Fix: If your UI is light and minimal, use lighter icons. If it’s bold, use bolder icons.

Icons used without labels

Fix: For small businesses, clarity beats clever—use labels with icons for navigation and features.

Next step: tie it into your guidelines

Add icon style rules (outline/filled, stroke, corners, sizes) to your brand guidelines so your website and marketing always feel cohesive.

Use the Brand Guidelines Template Review logo file formats