Signguin

Social Media Icons for Email Signature: Size, Format, Links and Each Network's Logo Rules

The best social media icons for an email signature are small PNG images, shown at 20 to 24 pixels with 8 to 12 pixels between them, each linked to the full web address of your profile. Two to four networks is plenty: pick the ones where you actually post or answer messages. If you want to follow each network's own logo rules to the letter, use their official colors: LinkedIn allows only blue, black or white, Facebook asks you not to recolor its logo, X's logo is black or white, and only Instagram allows any single solid color.

Below: why the format matters in Outlook, what LinkedIn, Instagram, Facebook, X and WhatsApp say about their logos (checked October 6, 2026), how to build links that work, and how icons survive dark mode.

Jane Cooper 
Jane Cooper
Owner
Cooper Plumbing
 
+1 555 0100
jane@cooperplumbing.com
cooperplumbing.com
12 Main St, Springfield
linkedinfacebookinstagram
Cooper Plumbing
ClassicFree· anyone adding a first row of social icons
free design with a small icon row under the contact details
Create my signature

Why icons are images, and why PNG beats SVG

An icon in an email signature is a tiny picture with a link around it. Email apps don't load icon fonts or web fonts reliably, so the "font icons" a website uses for social buttons don't work here. Every icon has to be an actual image file.

Designers like SVG, because it stays sharp at any size. Email apps are less keen. According to caniemail.com's tests (last run September 16, 2026):

  • Outlook 2007 to 2016 for Windows don't show SVG images at all.
  • Outlook 2016 for Mac doesn't show them either. Newer Outlook for Mac versions and Outlook 2019 for Windows do.
  • Gmail shows them, but converts them to PNG first.

So an SVG icon row can look perfect in your inbox and show as empty boxes for a client on an older Outlook. PNG works everywhere, supports transparency, and icon files stay tiny.

To keep a PNG icon sharp on high-density screens (phones, Macs, many laptops), save it at twice the size it will be shown: a 24 px icon as a 48 px file, with the HTML telling the email to display it at 24 px. Our email signature size guide explains why that width and height must be set as attributes, not only in CSS, for Outlook.

Signguin generates every social icon as a PNG file, hosts it, and gives it a fixed size, so this part is handled for you.

Icon size and spacing

Show icons at 20 to 24 px each, with 8 to 12 px of space between them. Below 20 px the logos turn into colored dots; above 24 px a row of five becomes the loudest thing in your signature. The space matters as much as the size: on a phone, icons that touch are easy to mistap.

Facebook's 16 px minimum fits easily inside that range; Instagram's 29 px minimum does not (more on that in the Instagram section). Numbers for logos, photos, banners and file sizes are in the email signature size guide.

How many social icons to include

Two to four. Every icon is a small request ("go and look at me over there"), and four requests is already a lot to put under every email you send. Include a network only if a client who clicks it will find something recent and relevant.

Your workIcons that usually earn their place
Sales, consulting, B2B servicesLinkedIn, plus a booking link
Freelancers in design, photography, illustrationBehance or Dribbble, Instagram, LinkedIn
Local trades and services (plumber, salon, cleaner)WhatsApp, Facebook, a reviews link
Restaurants, cafes, shopsInstagram, Facebook, a reviews link
DevelopersGitHub, LinkedIn
Creators and coachesYouTube or TikTok, Instagram, LinkedIn
RecruitersLinkedIn, plus Xing in German-speaking markets

A few rules of thumb:

  • Drop dead accounts. A profile whose last post is from 2022 tells clients more than you'd like.
  • Business beats personal. Link the profile you'd be happy for a client to read.
  • Keep the order stable. Most useful link first, same order for everyone at your company. Penguins have worn the same outfit for millions of years and nobody has ever mistaken one for a pelican; consistency works.

Signguin offers icons for LinkedIn, X, Facebook, Instagram, YouTube, TikTok, WhatsApp, Telegram, GitHub, Pinterest, Behance, Dribbble, Threads and Xing, plus a booking link and a reviews link. All of them are free.

Jane Cooper
Jane Cooper
Owner
Cooper Plumbing
  +1 555 0100
 
jane@cooperplumbing.com
cooperplumbing.com
12 Main St, Springfield
linkedinfacebookinstagram
Cooper Plumbing
Local proFree· local businesses whose customers message or review them
free design with WhatsApp, Facebook and reviews icons
Create my signature

Icon color: official colors or one matching color?

Most signature designs color all icons the same, often in the company's brand color. It looks tidy. It is also, strictly read, against the published logo rules of most of the big networks. Here is what each one said on October 6, 2026:

NetworkWhat colors the rules allowSource
LinkedInBlue, black or white onlybrand.linkedin.com
FacebookFacebook Blue (white "f"), or white on Facebook Blue. "Do not recolor our logo to your own brand colors."Meta Brand Resource Center, updated December 2024
XBlack or whiteX Brand Quick Guide, August 2023
WhatsAppNo color changes to the logoMeta Brand Resource Center
InstagramAny solid color; black or white recommendedMeta Brand Resource Center (archived June 2026)

Plenty of businesses use matching icons anyway. But if your workplace does things by the book (a law firm, a bank, a company with a brand team), official colors are the safe choice. Black icons satisfy LinkedIn, X and Instagram, though not Facebook or WhatsApp. In Signguin, the icon Colour setting has two options: Signature's (all icons in your signature's color) and Brand colours (each network in its own color, such as LinkedIn blue and WhatsApp green). Pick Brand colours if you want to follow the networks' rules.

Whatever you choose, use the official logo shapes. Every one of these guidelines asks you to keep the logo's form intact. Download from the brand's own site rather than an icon pack, because packs can contain old versions (the Twitter bird, an older Facebook "f").

LinkedIn icon for email signature: follow LinkedIn's brand guidelines

LinkedIn's brand guidelines (brand.linkedin.com, checked October 6, 2026) explicitly allow the [in] logo "in your email signature as a hyperlink to your LinkedIn profile, company page, and/or group page" and "in a series of social media icons." The rules that come with it:

  • Three colors only: blue, black or white. LinkedIn's preferred version is blue on a solid white background. In a row of social icons, LinkedIn says members "should use one of the three icon colors we provide for download", while "any background page color is acceptable."
  • Don't modify the color or the shape. If you need another color to match your other icons, LinkedIn asks you to email trademarkrequest@linkedin.com rather than recolor it yourself.
  • Don't combine it with other symbols, words or images, and don't use it in a way that suggests LinkedIn endorses you.

Strictly read, the shape rule also covers putting the [in] inside a circle, since the official logo is not round. To follow the guidelines to the letter, use the official logo file in LinkedIn blue. The official files are on LinkedIn's downloads page (brand.linkedin.com/downloads).

How to find your LinkedIn profile URL

Your public profile address looks like https://www.linkedin.com/in/your-name. To find or shorten it on a computer, LinkedIn's help center says: click the Me icon at the top of your homepage, click View Profile, then click the Edit icon next to Public profile & URL. On the phone app: tap your profile photo, tap View profile, tap the More icon next to Add section, tap Contact info, then Profile URL.

A custom URL can be 3 to 100 characters, without spaces, symbols or the word LinkedIn. Choose it before you put it in your signature: LinkedIn lets you change it only five times in six months, and old links stop working.

For a company page, use https://www.linkedin.com/company/your-company. Either way, open the link in a private browser window to check it doesn't land on a login wall or the wrong page.

Instagram icon for email signature

Meta's Instagram guidelines are the most flexible of the five. In the version of the Instagram icon page we could check (archived June 16, 2026; the live page returned an error on October 6, 2026):

  • Use the glyph (the camera outline), not the app icon, to point to your Instagram presence.
  • Any solid color is allowed, "as long as all other aspects of its design stay the same." Meta recommends black or white.
  • No call to action needed in a row of social icons. On its own, the glyph should come with a line such as "Follow us on Instagram!"
  • Don't alter, reshape or rotate the glyph.
  • Minimum size: 29 x 29 px, with clear space of half the glyph's size around it.

That minimum is the catch: most signature icon rows are 20 to 24 px. Your options are to size a short row of two or three icons at about 30 px, to accept that a 24 px icon sits under Meta's stated minimum (as most signature rows do), or to link Instagram as text ("Instagram: @yourstudio").

Your profile link is https://www.instagram.com/yourname. Links copied from the app's Share button can carry extra code after a question mark; delete everything from the ? onward.

Facebook icon for email signature

Facebook's logo page (marked "Updated December 2024", checked October 6, 2026) is strict about color:

  • Primary: a Facebook Blue logo with a white "f", ideally on white.
  • Secondary: a white logo on a Facebook Blue background.
  • Don't "recolor our logo to your own brand colors", outline it, add effects, use just the "f" without its circle, or swap in the thumbs-up symbol.
  • Minimum size for digital use is 16 px wide, with clear space of a quarter of the logo's width.

Facebook asks you to download the current logo from its Brand Resource Center, not from a Google image search. Link to your page's full address, such as https://www.facebook.com/yourbusiness.

X (Twitter) icon for email signature

X's Brand Quick Guide for external partners (version 1.0, August 2023, the latest version published on about.x.com when we checked on October 6, 2026) keeps it simple: "The X logo is black or white." It should be white on a black background or black on a white background, with clear space at least equal on all four sides.

Two practical points:

  • Replace the bird. If your signature still shows the blue Twitter bird, swap it for the X logo. The bird is no longer part of X's brand.
  • Watch it in dark mode. A black X on a transparent background can vanish when the email background turns dark. See the dark mode section below.

Link to https://x.com/yourhandle.

WhatsApp in your email signature

WhatsApp is the icon that turns a signature into a contact button: one tap on a phone opens a chat with you. It works through WhatsApp's click to chat links, which, according to WhatsApp's Help Center, work "on both your phone and WhatsApp Web."

The format is:

https://wa.me/<number>

where the number is your full phone number in international format. WhatsApp's instructions say to "omit any zeroes, brackets, or dashes." In practice:

Your number as you'd write itCorrect link
+1 (415) 555-0123 (US)https://wa.me/14155550123
+44 (0)7700 900123 (UK)https://wa.me/447700900123
0151 2345678 (Germany, written locally)https://wa.me/491512345678

The mistakes that break the link: leaving the plus sign or brackets in (WhatsApp's own "don't use" example is https://wa.me/+001-(XXX)XXXXXXX), forgetting the country code, and keeping the leading zero of your local number after the country code.

You can also pre-fill a message by adding ?text= and your URL-encoded text (spaces become %20): https://wa.me/14155550123?text=Hi%20there opens a chat with "Hi there" already typed.

The person needs an active WhatsApp account on that number, so test the link from another phone. If you use the WhatsApp Business app for work, use that number.

On the logo itself, Meta's WhatsApp guidelines say "you shouldn't modify any colors in our logos" or change the design. Like Facebook, the strict reading is: use the official green logo.

Phone and email icons

A small phone or envelope icon in front of a number or address helps people scan your signature. Two rules make them useful:

Make the text a link. Use a tel: link for a phone number and a mailto: link for an email address. On a phone, tapping a tel: link starts a call; on a computer it may open an app such as FaceTime, MDN notes. Write it in international format without spaces (tel:+14155550123) and keep the visible text readable: "+1 (415) 555-0123".

Keep the text next to the icon. Never replace your number or website with just an icon. Classic Outlook for Windows blocks automatic picture downloads by default, according to Microsoft, so many recipients first see an empty box with nothing to call.

Linking icons correctly

Most broken icon rows aren't broken images, they're broken links. Check these:

  1. Use the full address. Start every link with https://. Without it, linkedin.com/in/jane is not a complete web address, and depending on the app it may not work as a link at all.
  2. Link to your profile, not the network. An icon that opens linkedin.com's home page is a common copy-paste slip.
  3. Clean up shared links. Links copied from an app's Share menu can end with tracking code after a ?. Delete it, then test the shorter link.
  4. Add alt text. Give each icon alt text with the network's name ("LinkedIn"). When images are blocked, readers see the word instead of an empty square, and screen readers announce something useful.
  5. Add tracking only to your own website. To see visits from your signature, add UTM parameters to links that point to your site, where your analytics run: https://yoursite.com/?utm_source=email-signature&utm_medium=email&utm_campaign=signature. Google's Analytics help says to always include utm_source, utm_medium and utm_campaign, and that values are case sensitive. On a LinkedIn or Instagram link, UTM parameters won't reach your analytics.

Signguin doesn't add tracking or report clicks. If you need click data, the UTM approach above works with any signature.

Dark mode: keep your icons visible

In dark mode, email apps change the background behind your signature but generally leave images alone, as email testing company Litmus describes. For icons, that causes two problems:

  • Black icons on a transparent background disappear. A black X logo, for example, becomes nearly invisible on dark gray.
  • White icons disappear in light mode.

The fixes:

  • Use icons with a solid shape behind the glyph (a filled circle or square with the logo inside). The colored shape stays visible on both white and dark backgrounds.
  • Add a thin light outline to dark transparent icons, which Litmus recommends for transparent PNGs in general.
  • Preview before you install. Signguin's preview has a light and dark mode toggle, so you can see your icon row on both backgrounds before it goes out. Our guide to email signatures in dark mode covers logos and text as well.

How to add social icons in Gmail, Outlook and Apple Mail

With a generator, you paste or install the finished signature, icons and links included. To add icons by hand:

  • Gmail: in Settings > See all settings > General > Signature, use Insert image with the Web Address (URL) option to add each icon from a public link, then select the icon and use the link button in the editor toolbar to add your profile URL. Full steps: how to change your Gmail signature.
  • Outlook: Microsoft notes that "you can also add social media icons and links in your signature." In classic Outlook, add each image with the Image button and the link with the formatting bar under Edit signature. Steps for every Outlook version: how to add a signature in Outlook.
  • Apple Mail and others: paste a finished signature into the signature editor. Our hub on how to add a signature to an email covers each app.

Why icons sometimes arrive as attachments. An icon embedded in the signature, rather than linked from a web address, is often listed as an attachment (the familiar image001.png). Classic Outlook for Windows can even embed linked images when it sends, in some setups, as Microsoft MVP Robert Sparnaaij documents. Hosted icons avoid most of this, and they keep you under Gmail's 10,000-character limit, which Google says images count toward. If your icons still turn into attachments or show as red X's, see Outlook signature not showing.

Make the icon row without the fiddly parts

You can do all of this by hand, or let Signguin do the mechanical part. It's a free email signature generator: type your work email, it loads your logo and brand colors from your website, and you add your profiles. Icons come out as hosted PNG files with fixed sizes, in a Round, Square or Simple style, or the style that comes with your design, and either in your signature's color or in each network's own brand color. You preview on phone and desktop, in light and dark mode, then install it straight into Gmail or copy it into Outlook, Apple Mail and others. The free plan needs no sign-up and includes every social icon. Signguin is built for individuals and small businesses, so it doesn't offer team management or click analytics.

Every email, dressed to impress.

Works in Gmail, Outlook & Apple Mail

Create my signature

Want to see icon rows in finished signatures first? Browse our email signature examples, or read what else belongs in a professional email signature.

FAQ

How do I get social media icons on my email signature?

Add each icon as a small PNG image (20 to 24 px on screen), then link it to your full profile address. In Gmail, insert the image from a web address and use the link button; in Outlook, insert the picture and add a hyperlink. The quicker route is a signature generator that creates the icons and links, so you paste or install one finished signature.

Can I use the LinkedIn logo in my email signature?

Yes. LinkedIn's brand guidelines explicitly allow the [in] logo in your email signature as a hyperlink to your profile, company page or group. Use it only in blue, black or white, don't change its shape, and don't combine it with other words or images. Download the official file from brand.linkedin.com instead of an icon pack.

Use WhatsApp's click to chat format: https://wa.me/ followed by your full phone number in international format, with no plus sign, spaces, brackets, dashes or leading zero. For example, +1 (415) 555-0123 becomes https://wa.me/14155550123. Link your WhatsApp icon to that address and test it from another phone before you send emails with it.

Should social icons be in color or black and white?

For strict compliance, use each network's official colors: LinkedIn and X allow black, Facebook and WhatsApp ask you not to recolor their logos, and Instagram allows any solid color. Matching all icons to your brand color is common and looks tidy, but it goes against most of these rules. Whatever you pick, check the icons in dark mode.