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.

Published 6 min read
A company logo mark shown inside a tiny browser tab favicon, a round social avatar and a phone app icon side by side

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.

SurfaceTypical shapeWhat we check
Browser tab and search resultSquare, tinyMark reads at the smallest scale
iPhone home screenSquare, rounded by iOSOpaque background, no thin edge detail
Android and installed web appCircle, squircle or rounded squareArtwork inside the central safe zone
Social avatarCircleMark centred, nothing near the corners
LinkedIn company pageSmall square or circleWorks at about 40 pixels

Designing a logo for a small circle

We follow the same short list on every compact mark.

  1. Keep one idea. A single letter, a monogram or one simple symbol. Two ideas compete at 32 pixels.
  2. Remove the text. Initials can stay if they are heavy and few. A full name cannot.
  3. Thicken the strokes. Hairlines vanish when the file is scaled down. Draw the compact mark with heavier lines than the main logo.
  4. Fill the circle sensibly. The mark should occupy most of the circle but leave a visible margin, so a crop never touches it.
  5. 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.

Brand Notes, monthly

One email a month: what changed in logo, brand and web design, in five minutes.

No sales sequence. Unsubscribe with one click. We never share your address.

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.