How to Add Social Media Icons to Your Email Signature [+ Free Resources]

But even as we speak, the sheer volume of people already on some form of social media means it just makes sense to do business there in 2024.

That’s especially true if you want to increase brand exposure and improve traffic and lead generation.

• Automatically size the social media icons properly.
• Make sure your icons match your theme.
• Align the icons properly with the rest of the signature.
• Ensure your links are active.

Otherwise, you’ll have to manually add the social media icons to your email signature as images and link these images with your social profiles. This method requires more effort and technical know-how.

Using HubSpot’s free signature generator, you can save a lot of time and effort.

Follow these steps to add social media icons to your email signature with HubSpot’s free signature generator:

1. Choose your preferred email signature template.

2. Simply paste your social links into the correct fields. The generator does the rest. (I’ll cover where to find your social links below.)

3. Adjust the look to suit your brand or style.

4. Add your headshot, company logo, and CTA (optional).

5. Copy the image or the source code and paste it into your email client.

Make your email signature for free.

Method 2: Add an Image Within Your Email Client

Maybe you’re already happy with your existing signature, and you just need to add social media icons.

If that’s the case, most email clients (like Gmail, Outlook, etc.) will allow you to add them as an image to your signature. You can then link them with your social media channels.

But there’s a problem with this approach. Adding images as attachments to your outgoing emails can affect your delivery rates.

While Gmail allows you to add social media icons as images using the image address or URL, that’s impossible for other email clients like Outlook, Yahoo Mail, and Apple Mail.

To add social media icons as images to your email signature, follow these steps:

1. Find icons of the right size, shape, and color. (I’ve shared some options below).
2. Right-click the image of the icon and select “Copy image address” or “Copy image URL,” in case you’re looking to upload to Gmail. For other email clients, you’ll have to download the social media icons as images and link them to your profiles.
3. In your email client’s signature editor, click on “Insert image.”
4. Paste the image URL into the field given (in Gmail) or upload social media icons as images (in the case of other email clients).
5. Adjust the placement and alignment of the icon if needed.
6. Copy the social link that matches the icon you’re adding.
7. Highlight the newly added icon image and click “Insert link.”
8. Paste the social link into the field.

That being said, let’s understand how to add social media icons to your email signatures across Gmail, Outlook, and Apple Mail.

How to Add Social Media Icons to Gmail Signature

To add social media icons to your Gmail signature, follow these steps.

1. Click on the settings icon in the top-right corner.

2. Click on “See all settings.”

3. Scroll down until you see the email signature editor.

4. Click on “+ Create New” button.

5. You’ll be asked to name your new signature. In this case, I’ll name it “John Smith.” Once you type in the name, click on “Create.”

If you’re looking to add social media icons to your existing signature, just click on the edit icon for that particular signature.

6. Now, you can either paste the signature from HubSpot’s free signature generator. Or you can follow the instructions in Method II to add social media icons to your existing signature in the form of images.

7. Under “Signature defaults,” select your new signature. You can do it for both — new and reply/forwarded emails.

8. Scroll to the bottom and click “Save changes.”

See more detailed instructions on how to add a signature in Gmail.

How to Add Social Media Icons to My Outlook Signature

To add social media icons to your Outlook signature, follow these steps:

1. Click on the gear icon in the top-right corner.

2. Click on “View all Outlook settings.”

3. Select “Compose and reply.”

4. Under “Email Signature,” add your Signature name. In this case, I’ll name it “John Smith.” On the other hand, if you’re looking to edit your existing signature, choose the name of the signature you’re looking to edit from the drop-down menu.

5. Paste your email signature (the one we created in HubSpot’s free signature generator.)

Or, if you’re just looking to add social media icons to your existing signature in the form of images, follow the instructions mentioned in the Method II section.

6. Under “Select default signature,” select your new signature. You can do it for both – new and reply/forwarded emails.

7. Click on “Save” to save the changes.

See more detailed instructions on how to add a signature in Outlook.

How to Add Social Media Icons to Apple Mail Signature

1. Click on “Mail” and then “Settings” in the top-left corner.

2. Click on the “Signatures” tab.

3. Click on the “+” button, as displayed in the screenshot below.

4. Name your email signature. In this case, I’ll name it “John Smith.”

5. Paste your email signature (the one we created in HubSpot’s free signature generator). Or follow the instructions in the Method II section to add images.

6. Uncheck the box that says “Always match my default message font.”

7. Close the pop-up window.

How can I create custom social media icons?

If you want to create custom social media icons and have the budget, I recommend working with a graphic designer.

They will a) know how to keep your custom social icons in line with your brand and b) have paid versions and knowledge of tools like Adobe Photoshop or Illustrator.

Overall, a good designer will make sure the icon designs are eye-catching, sleek, and professional.

That said, if you want to take a DIY approach, you can use Canva’s free plan to do simple icon customizations like color changes.

To create custom social media icons, load up Canva and then follow these steps:

1. Search for “email signature templates.”

If you don’t already have an email signature template, you can search for an existing one through Canva. To do this, enter “email signature” into the search bar.

Note: You can use Canva to create individual social icons so that you can use them for purposes outside of an email signature. For the purpose of this tutorial, I’m going to show you how to customize social media icons directly on an email signature template so you can see the whole thing in context.

But remember, adding images as attachments to your outgoing emails can affect your delivery rates.

2. Choose your preferred email signature template.

Now, there should be a range of templates to choose from.

If you have basic design skills, it’s probably best to choose an existing template that catches your eye. If you’re feeling confident, try a blank email signature.

Image Source

(I’m going to choose a blank one so it’s easier for you to see what I do with the social icons.)

3. Choose your social media icon(s).

So, your email signature template (in my case, a blank one) should be loaded up on the screen.

Now it’s time to browse social media icons. I’m starting with Instagram. To do this, I selected “Elements,” added “Instagram icon” into the search bar, and then clicked “See all.”

Image Source

(For context, I added that line into my blank template to help me visualize the email signature, specifically where to put the icons.)

Image Source

You should now be able to see the full range of Instagram icons.

Note: Even though I’m using the free variant of Canva, you might need to join the paid “Pro” plan to remove the watermark on some of the design elements. It all depends on which ones you choose.

4. Customize your social media icon(s).

Let’s start with a simple customization. I picked the top left variant of the Instagram icon, which looks like a simple black outline on the canvas.

Image Source

Now, I’m going to do a simple color customization. But, I want to use colors specifically from some of my artwork. To do this, I uploaded a picture of the piece in question, and the colors were then registered in “Photo colors.”

Image Source

Original Artwork Source

You can access “Photo colors” by clicking the “Colors” icon through the top menu bar.

Image Source

I’ve gone for the light beige color and shrunk the icon down to size. (There’s still a watermark on the Instagram icon if you’re wondering why it doesn’t look its best.)

Image Source

You can then rinse and repeat for all the social media icons that represent where you have a social presence. Or…

5. Bonus: Customize your social media icon background.

If you want to take it a step further, consider experimenting with the background of your social media icon(s).

Since I’ve already got some of my artwork loaded up on the canvas, I’ll show you what I mean. I’ve reverted the Instagram social icon back to a bigger size and placed my artwork behind the icon.

Image Source

To reposition your image, head to “Position,” click “Arrange,” and then either select “Backward” or “Forward,” depending on how you want to position the image. In this case, I clicked “Backward” to position the art behind the icon.

I then resized the background art so that it’s slightly bigger than the icon outline. You can now see the artwork behind the social media icon below.

Image Source

I’m happy with the alignment, so the next step is to join the elements together. To do that, I left-clicked and selected both images at once, then clicked “Group.”

I can now move the social icon and background art around the canvas together and resize them simultaneously.

Image Source

I’m not quite happy with this yet, as I think the artwork is overpowering the social icon. To counteract this, I will experiment with customizing the icon color and reducing the transparency of the background art.

(Below is a quick example of those changes.)

Image Source

I can then “Copy” and “Paste” this variant and “Ungroup” to replace the Instagram icon with other social icons.

Image Source

Free Social Media Icons for Email Signatures

Below, you’ll find links to each social media site’s brand kit. You’ll find other sizes, shapes, colors, and file types in each kit.

Please note: By downloading the icons from a brand kit and uploading them to your email client, you’ll be adding them as an attachment to all your outgoing emails. Adding attachments could affect your delivery rate.

You can avoid this by adding them using the method described earlier in the blog. However, that’s only applicable to Gmail and not other email clients. So, using HubSpot’s email signature generator is a better option.

Apart from this, you may have several questions, so I’ve answered some of the most common questions related to adding social media icons in email signatures below.

Here we go.

Should I put social media icons in my email signature?