# Logo Sizes for Favicons, App Icons, Websites and Social Media

> Keep a 1000 × 1000 master logo plus an SVG. Favicons are 16, 32 and 48 px (design at 512 × 512), the iPhone home screen icon is 180 × 180, Android and Google Play need 512 × 512, the App Store needs 1024 × 1024, profile pictures need at least 400 × 400, and print needs 300 pixels per inch.

Source: https://hf-photo-editor.dafontstyle.io/blog/logo-sizes · Updated 2026-10-01 · By DafontStyle Team · Tool: https://hf-photo-editor.dafontstyle.io/editor (free, in the browser)

One logo has to work in many places: a 16-pixel browser tab, an app icon on a phone, a website header and a printed sign. Each place has its own size and shape. This guide lists every size you need and shows how to export all of them from one design.

![Logo size cheat sheet from a 16 pixel favicon to a 1024 pixel app icon](https://hf-photo-editor.dafontstyle.io/blog/logo-sizes-cheat-sheet.webp "1200x750|From the 16 px favicon to the 1024 px App Store icon.")

## Logo sizes at a glance

| Where | Size (pixels) | File |
|---|---|---|
| Browser tab (favicon) | 16 × 16 and 32 × 32 | ICO, PNG or SVG |
| Google Search results | 48 × 48 or any multiple of 48 | PNG or SVG |
| iPhone home screen (apple-touch-icon) | 180 × 180 | PNG |
| Android home screen and PWA | 192 × 192 and 512 × 512 | PNG |
| WordPress Site Icon | at least 512 × 512 | PNG |
| Google Play store icon | 512 × 512, up to 1 MB | PNG |
| iPhone App Store icon | 1024 × 1024, no transparency | PNG |
| Website header logo | about 40–80 px tall on screen | SVG or PNG at 2× |
| Social media profile | square, 400 × 400 or larger | PNG or JPG |
| Print | 300 pixels per inch | SVG or PDF |

The safest plan is to keep one master logo as a large square (1000 × 1000 or more) plus an SVG, and export everything else from it. If you do not have a logo yet, [make your logo first](https://hf-photo-editor.dafontstyle.io/blog/how-to-make-a-logo-for-free) and come back here.

## Favicon sizes

The favicon is the small icon in the browser tab, in bookmarks and next to your site in Google results. Browsers show it at **16 × 16** and **32 × 32** pixels, and Google Search asks for a square image that is a **multiple of 48 pixels** (48 × 48, 96 × 96, 144 × 144 and so on).

![Website mockup with the favicon in the browser tab and the logo in the header](https://hf-photo-editor.dafontstyle.io/blog/favicon-in-browser-tab.webp "1200x900|The favicon sits in the tab; the wide logo sits in the header.")

At 16 pixels there is no room for words. Use only the icon or your initials, with strong contrast. Start from a **512 × 512** square: it is large enough for every favicon size, for Android and for WordPress, which asks for a Site Icon of at least 512 × 512.

A typical set of favicon files looks like this:

- `favicon.ico` with 16, 32 and 48 pixel versions inside, for older browsers
- `icon.svg` for modern browsers, which keeps the icon sharp at any size
- `apple-touch-icon.png` at **180 × 180** for iPhone and iPad home screens
- `icon-192.png` and `icon-512.png`, listed in your web app manifest, for Android and installable web apps

In HF Photo Editor, pick a design under **Favicons** in the logo maker. These are 512 × 512 squares with bold initials or a single icon, so they stay readable when small. Follow our [step-by-step favicon guide](https://hf-photo-editor.dafontstyle.io/blog/how-to-make-a-favicon) to add it to WordPress, Shopify or your own HTML.

## App icon sizes for Android and iPhone

App icons follow stricter rules because the phone, not you, decides the final shape.

![App icon on a phone home screen next to other apps](https://hf-photo-editor.dafontstyle.io/blog/app-icon-on-phone.webp "1200x900|An app icon competes with dozens of others, so keep it bold and simple.")

**Google Play** asks for a **512 × 512** PNG of up to 1 MB. Upload a full square; Google Play rounds the corners for you, so do not add rounded corners or shadows yourself.

**Android adaptive icons** are made of layers of **108 × 108 dp**. The phone shows only the middle **72 × 72 dp** and crops it into a circle, squircle or rounded square depending on the brand of the phone. Keep the important part of your logo inside the central **66 dp** circle.

**iPhone and iPad** need one **1024 × 1024** PNG for the App Store, with **no transparency**. The system rounds the corners, so fill the whole square with your background color.

![Diagrams of the iOS rounded corner mask and the Android adaptive icon safe zone](https://hf-photo-editor.dafontstyle.io/blog/app-icon-safe-zones.webp "1200x750|Keep the logo inside the safe zone so no shape cuts it off.")

For an installable web app, add a **maskable** 512 × 512 icon too. Keep the logo inside the central circle that is 80 percent of the width, because Android may crop the rest.

The **App icons** tab of the logo maker gives 1024 × 1024 designs with the icon centered. They show rounded corners so you can judge the look. Before you upload to a store, select the rounded background shape, set **Corner radius** to 0 and type 1024 in **W** and **H** so it fills the whole square. Then download PNG at 1× for exactly 1024 × 1024. Our guide on [how to make an app icon](https://hf-photo-editor.dafontstyle.io/blog/how-to-make-an-app-icon) covers Android Studio, Xcode and the alpha-channel error. Browse the [mobile app logos](https://hf-photo-editor.dafontstyle.io/templates/logo-app) and [startup logos](https://hf-photo-editor.dafontstyle.io/templates/logo-startup) for ideas.

## Website header logo size

There is no single standard for the logo in your website header, but most sites show it **40 to 80 pixels tall**. A wide logo with the icon next to the name works best there, because a tall square logo wastes the space of the header.

- Upload the logo at **twice the size it is shown**. A logo shown at 200 × 50 should be a 400 × 100 file, so it stays sharp on phones and Retina screens.
- Better still, use **SVG**. It is usually smaller than a PNG and sharp at every size.
- Keep a **transparent background** so the logo works on any header color. Here is how to [make a transparent PNG](https://hf-photo-editor.dafontstyle.io/blog/make-transparent-png).

The **Website headers** tab in the logo maker has 1200 × 300 designs (a 4 : 1 shape), ready for a header. Shops can start from the [online store logos](https://hf-photo-editor.dafontstyle.io/templates/logo-ecommerce).

## Social media profile picture sizes

Every network shows your logo as a small square or circle, and each one picks a slightly different size. The simple rule: **upload a square of at least 400 × 400 pixels** (1000 × 1000 is even better) and keep the logo away from the corners, because most networks crop it into a circle.

![Social media profile with the logo in a round profile picture](https://hf-photo-editor.dafontstyle.io/blog/logo-social-profile.webp "1200x900|Profile pictures are cropped into a circle, so center the logo.")

| Network | Upload | Shown at about |
|---|---|---|
| Instagram | 320 × 320 or larger | 110 px circle on phones |
| YouTube | 800 × 800 | 98 px circle |
| X (Twitter) | 400 × 400 | small circle |
| LinkedIn company page | 400 × 400 | square |
| Facebook page | 400 × 400 or larger | about 176–196 px circle |

Use the icon-only or initials version of your logo for profile pictures. A full name with a tagline is usually too small to read. For cover photos, banners and post sizes, see our guide to [image sizes for Instagram, YouTube and Facebook](https://hf-photo-editor.dafontstyle.io/blog/resize-image-for-social-media), or start from the [YouTube channel art templates](https://hf-photo-editor.dafontstyle.io/templates/w-ytchannel).

## Logo size for print

Printers work in inches or millimeters, not pixels. The rule is **300 pixels per inch**.

![Business cards with the logo printed in the middle](https://hf-photo-editor.dafontstyle.io/blog/logo-business-card.webp "1200x900|A logo 1 inch wide on a business card needs at least 300 pixels.")

- A logo **1 inch** wide on a business card needs at least **300 pixels**.
- A logo **2 inches** wide on a letterhead needs at least **600 pixels**.
- For **signs, banners and T-shirts**, send an **SVG** or **PDF**. They print sharp at any size, so the printer never has to stretch a small image.

In HF Photo Editor, the Download dialog picks **3×** for logos by default, which gives a PNG of about 3000 pixels. That is enough for prints up to about 10 inches wide. Choose **4×** or **SVG** for anything larger.

## Export every size from one design

You do not need a separate design for each size. Make one master logo, then:

1. Download the **brand logo** as PNG at 3× and as SVG.
2. Open the **favicon** version and download it as PNG at 1× (512 × 512). That one file works for WordPress, Android and your web app manifest, and most website builders and favicon generators make the smaller sizes from it.
3. Open the **app icon** version and download it at 1× for the exact 1024 × 1024 store size.
4. Use **One design, every size** in the Canvas tab to turn the logo into a Facebook cover, a YouTube banner or an Instagram post in one click.

Keep every file in one folder with clear names such as `logo-header.svg`, `logo-square-3000.png` and `favicon-512.png`. When you change your colors next year, update the project once and export the set again.

## Questions people ask

### What is the best size for a logo?

Design the main logo as a square of at least 1000 × 1000 pixels and keep an SVG copy. Export smaller sizes from it: 512 × 512 for Android and PWA icons, 180 × 180 for iPhone home screens and 48 × 48 or 32 × 32 for favicons.

### What size is a favicon?

Browsers show favicons at 16 × 16 and 32 × 32 pixels. Google Search needs a square favicon that is a multiple of 48 pixels, such as 48 × 48 or 96 × 96. Start from a 512 × 512 square so every size can be made from it.

### What size is an app icon for Android and iPhone?

Google Play needs a 512 × 512 PNG up to 1 MB. The iPhone App Store needs a 1024 × 1024 PNG without transparency. Both stores round the corners themselves, so upload a full square.

### What size should a logo be on a website?

Most website headers show the logo about 40 to 80 pixels tall. Upload it at twice that size, for example 400 × 100 for a 200 × 50 logo, or use SVG so it stays sharp.

### What resolution do I need to print a logo?

Use 300 pixels per inch. A logo printed 2 inches wide needs at least 600 pixels. For signs and banners, send the printer an SVG or PDF.