Modern icon design
Consistent stroke weight
One stroke width across the set is the single biggest driver of a coherent look.
Pick one stroke and commit
On a 24px grid, a 2px stroke is a reliable default. The rule that matters most:
Every icon in a family uses the same stroke width.
Mixing 1.5px and 2px strokes is the fastest way to make a set look unfinished.
Terminals & joins
- Use round caps and round joins for a friendly, modern feel.
- Use butt caps and miter joins for a technical, precise feel.
- Whatever you choose — keep it consistent.
Counter-spaces
Keep the gaps inside an icon (between strokes) at least as wide as the stroke itself, or the icon turns into a blob at small sizes.
Next lesson
Optical alignment