Logo
Logo for a Small Circle: Favicons, App Icons and Social Avatars
A full logo rarely survives a 32-pixel favicon or a round social avatar. Here is how we draw a compact mark that stays legible, and how to test it before you upload.
A logo for a small circle works when you stop shrinking the full logo and draw a separate compact mark for that space. We build that mark to read at tab-icon size, to sit inside a circular crop and to hold up on both light and dark backgrounds.
Most small businesses discover this problem late. The logo looks fine on the website header and the business card, then someone uploads it as a LinkedIn avatar and the name turns into a grey smear. This article explains where the small circle appears, what the platforms expect and how to design and test a mark that stays readable.
Why the full logo fails in a small circle
A full logo is usually a wide object: a symbol, a name and sometimes a tagline. A circle is the opposite. It is square, it crops the corners and it often shows at a few dozen pixels.
Three things break first when you force a horizontal logo into that space:
- Letters in the company name drop below the size where strokes stay separate.
- The tagline disappears completely.
- The symbol shrinks to a fraction of the circle because the wordmark takes the width.
The fix is not a smaller copy of the same file. It is a second, simpler version of the identity, designed for the job. We cover the wider idea of logo versions in our piece on the responsive logo system.
Where the small circle appears
Your logo meets customers in more small spaces than most owners expect. Each one has its own rules.
Search Engine Journal reports that Google's favicon documentation now sets a floor of 8 by 8 pixels, while recommending a favicon larger than 48 by 48 pixels so it looks good on various surfaces. The same article quotes Google's requirement that a favicon be a multiple of 48px square, or an SVG with a square aspect ratio.
For iPhone and iPad home screens, Favicon Tools describes a single 180 by 180 PNG at /apple-touch-icon.png. It also notes that iOS ignores transparency in that image and composites it onto black, so the icon needs an opaque background.
For Android and installable web apps, FaviconStudio lists Android Chrome icons at 192 and 512 pixels.
Social platforms add the circle. SocialSizes notes that Instagram uploads are square but displayed as a circle, so the corners of the square are cropped out. For company pages on LinkedIn, La Growth Machine gives 300 by 300 pixels as the standard logo size and suggests testing the logo at 40 by 40 pixels before uploading.
Platform specs change, so check the current help page before you upload. The design principle stays the same.
| Surface | Typical shape | What we check |
|---|---|---|
| Browser tab and search result | Square, tiny | Mark reads at the smallest scale |
| iPhone home screen | Square, rounded by iOS | Opaque background, no thin edge detail |
| Android and installed web app | Circle, squircle or rounded square | Artwork inside the central safe zone |
| Social avatar | Circle | Mark centred, nothing near the corners |
| LinkedIn company page | Small square or circle | Works at about 40 pixels |
Designing a logo for a small circle
We follow the same short list on every compact mark.
- Keep one idea. A single letter, a monogram or one simple symbol. Two ideas compete at 32 pixels.
- Remove the text. Initials can stay if they are heavy and few. A full name cannot.
- Thicken the strokes. Hairlines vanish when the file is scaled down. Draw the compact mark with heavier lines than the main logo.
- Fill the circle sensibly. The mark should occupy most of the circle but leave a visible margin, so a crop never touches it.
- Use contrast, not gradients. Two flat colours survive resampling. Soft gradients and shadows turn muddy.
Compact does not mean generic. A well-chosen detail from your main logo, such as a distinctive letterform or a cut in a shape, carries the identity into the small space. If you are unsure which logo type you have, our guide to the types of logos shows how each one reduces.
Maskable icons and the safe zone
Android and some launchers apply their own mask to your icon. If the artwork runs to the edge, the mask cuts it.
Favicon Tools gives the rule: keep critical content inside the inner 80 percent of the canvas, which on a 512 by 512 icon is a circle about 410 pixels wide. The outer ring is bleed. It should carry background only, with no logo and no text.
In practice we deliver two versions of the app icon. One has a transparent or neutral background for places that show it as is. The other is a padded version with a solid colour that reaches every edge, so any mask shape leaves the mark intact.
Testing before you upload
A 10-minute test catches most problems. You need nothing beyond a screen and a phone.
- Export the compact mark at 512, 180, 96 and 32 pixels and view each at actual size, not zoomed.
- Place it on a white background, then a dark one. Browser tabs and phone themes use both.
- Apply a circle mask and check that no part of the mark touches the edge.
- Convert to greyscale. If two elements merge, the colour contrast is doing too much work.
- Look at it from an arm's length. If you cannot name the brand from the shape alone, simplify again.
Then upload it and look at the live result. Platforms recompress images, and Google updates search favicons on its own schedule. Search Engine Journal states the guidance, but a favicon is not guaranteed to appear in results even when every rule is met. Plan for a few days before a change shows.
If you also manage a map listing, the same small mark appears there. Our article on the Google Business Profile logo and photos covers that touchpoint.
What a compact mark costs with us
We work to fixed, final prices. Our Logo package is €430 and includes 4 concepts, up to 4 revision rounds, vector files in SVG, AI, EPS and CDR plus JPG and PNG, and 12 months of free edits. If you tell us in the brief that the logo will live in favicons, app icons and round avatars, we draw the concepts with that crop in mind from the first sketch.
Logo Start is €310 with 2 concepts and 2 revision rounds. If you already have a logo that only needs a cleaner, simpler version for small sizes, Logo Refresh is €175 with one concept. Delivery is within 5 business days, and the money-back guarantee applies: if none of the first logo concepts works, we refund in full within 5 business days. The logo is paid 100 % upfront. All prices are on the pricing page.
For file questions, such as which export goes where, see which logo file to use and when.
Check your own logo in a small circle
Take your current logo, shrink it to 40 pixels inside a circle and look at it. If the name is unreadable or the symbol floats in empty space, the identity is missing its compact version.
We offer a free 5-point brand check at /contact/. You get a one-page PDF within 48 hours on business days, with no sales call. It covers how your logo behaves at small sizes among other points. If you already know you need a new or refreshed mark, send the brief through the logo inquiry form.
FAQ
Questions people ask
How big should a favicon be?
Google's guidance is a square icon of at least 48 by 48 pixels, or a multiple of that such as 96 by 96. We draw the mark so it still reads when a browser scales it down to a tab.
Can I use my full logo as a social media avatar?
Usually not. Most platforms crop avatars to a circle and show them at a very small size, so a wordmark or a logo with a tagline becomes unreadable. A compact mark centred inside the circle works far better.
What is a maskable icon safe zone?
It is the central circle, roughly 80 percent of the icon width, where all important artwork must sit. Android launchers may crop anything outside it into a circle or rounded shape.
Do I need a different logo version for small sizes?
In most cases yes. A compact mark with fewer details, heavier strokes and no small text is a separate file in your logo set, built to match the main logo.
Can you make a compact mark for a logo I already have?
Yes. Our Logo Refresh at €175 includes one concept, which suits an existing logo that needs a cleaner, simpler version for favicons and avatars.
Need a logo that holds up in print, on screen and in ten years?
Fixed prices, 4 concepts, vector files and a money-back guarantee on the first concepts.
Related articles
All articles
BrandQuiet Confidence or Dopamine Design? 2026 Trend Test
2026’s web trends split in two: neon dopamine design and quiet, grain-textured restraint. Which fits your brand depends on the decision your buyer is making
· 4 min read
BrandHow to Launch a Rebrand Without Losing Your Customers
The files are delivered, and now comes the part that decides everything: the switch. The 215-asset inventory, the bridge period, the inside-out sequence, and the 30-day scoreboard.
· 3 min read
BrandWhy 2 Logo Directions Beat 10 Concepts, Every Time
“How many concepts do I get?” is the most revealing question in logo design. Why high concept counts signal uncertainty, and what a decision-led process looks like
· 3 min read