A great app icon isn't just a shrunk-down logo — it's a tiny piece of UI that has to read clearly at 48px on a phone home screen and look polished at 1024px in the App Store. Three decisions matter most: shape, padding, and background color. Here's how to get each one right, with a free tool that lets you preview all three before exporting.
---
Shape: Square, Rounded, or Circle?
You don't actually choose your icon's final shape — the operating system does:
This means your source icon should be a plain square (no pre-applied rounding), but your important content — logo, text, symbol — needs enough margin that it doesn't get clipped when a circular mask is applied.
The GMC Tools generator includes a live shape preview (square / rounded / circle) so you can see exactly how your design survives each mask before you export anything.
---
Padding: The "Safe Zone" Rule
A common mistake is designing artwork that fills 100% of the canvas edge-to-edge. When a circular mask is applied, the corners — and anything near them — get cut off.
Rule of thumb: keep your core design within the center 65–70% of the canvas. That's roughly a 15–20% padding setting.
| Padding | Best For |
|---|---|
| 0% | Icons designed to bleed to the edge (rare, risky with adaptive icons) |
| 10% | Logos with already-generous internal margins |
| 15–20% | Most logos — safe for circle/rounded masks (recommended default) |
| 25%+ | Logos with text or fine details that must stay fully visible |
---
Background Color: Transparent vs Solid
If your logo is a transparent PNG (e.g., just a colored mark with no background), pick a complementary solid color — often your brand's primary color — so the icon doesn't look "cut out" when placed on a home screen.
---
Putting It Together
---
Frequently Asked Questions
Should my icon include text?
Generally avoid it — text becomes unreadable at 48px. Use a symbol, mark, or initial instead, and save full branding (with text) for splash screens.
What if my logo is rectangular, not square?
The generator centers a rectangular image on a square canvas — add padding to give it breathing room, or crop your logo to a square composition first using the Image Cropper.
Does padding affect all platforms equally?
Yes — the padding setting applies uniformly to every generated size, so your icon looks consistent across Android, iOS, and PWA.
What background color should I pick if I'm not sure?
Your brand's primary color is usually the safest choice — it keeps the icon recognizable and on-brand even before someone opens the app.