Email Signature Generator

Fill in your name, a title and a couple of links, and this tool hands you an HTML email signature ready to paste into Gmail, Outlook or Apple Mail. It is free, there is no signup, and the whole thing runs in your browser. Pick an accent color, watch the preview redraw as you type, then press Copy signature for a formatted block, or Copy HTML if you want the raw source.

Every other page about email signatures will teach you design. What actually decides whether yours survives the trip is the markup underneath it, so this page is about the markup you are about to paste, counted rather than described.

Put in a name, a job title, a company, an email address, a phone number, a website and a LinkedIn link, then press Copy HTML. What lands on your clipboard is 1,600 bytes on a single line: two nested tables, five rows, and no <style> block, no class names, no id attributes anywhere. The formatting lives in 12 style attributes written straight onto the elements they affect, and those 12 attributes are 998 of the 1,600 bytes. Nearly two thirds of your signature is styling that had to be repeated because it could not be shared.

That is not a taste decision. Outlook on Windows still renders mail through Microsoft Word's HTML engine, which throws away a stylesheet and ignores most modern layout, so a signature that keeps its formatting in one tidy block arrives with none of it. Writing every declaration onto its own element is the old and reliable answer, and it is why the output looks so repetitive when you read it.

Now the part I will not pretend about. I have not opened Outlook, Gmail and Apple Mail to watch these signatures land, and nobody can honestly test every mail client and every version of it. What I can do is tell you exactly what is in the file you are pasting, and that is what the rest of this page does.

1. Type your name and title. The name is the field you cannot skip. With every text box blank the tool produces nothing at all, and it stays that way even if you have filled in a photo URL, so a picture on its own will not give you a signature.
2. Add only the contact details you want used. Email, a phone you will answer, a website. Blank fields drop out completely, so you never end up with a label and nothing after it.
3. Drop in social links if they help. LinkedIn is the safe one. X and GitHub are there too, though see the byte table below before you add all three.
4. Pick an accent color. A preset swatch or the color picker. The accent colors your company name, your links and the bar down the left edge.
5. Choose a layout. Photo beside the text (the image comes out 72 pixels wide) or photo above it (64 pixels wide). Skip the photo and you get a text-only block.
6. Check the preview, then copy. Copy signature for Gmail and Apple Mail, Copy HTML for Outlook's source box. The same source sits in the text area if you want to grab it by hand.

Here is the whole anatomy of a signature with a name, title, company, email, phone, website and one social link, taken off the Copy HTML output rather than from the design:

• 1,600 bytes, and not one line break in it. Your editor will show it as a single unbroken run 1,600 characters wide.
• Two <table> elements, one holding the accent bar and the identity block, one holding the rows of text.
• Zero <style> blocks and zero class names. All 34 style declarations are written inline.
• The font list is 83 bytes long and it is written out four times, so 332 bytes of your 1,600 (about a fifth of the whole signature) is the same list of font names repeating.
• Three colors, and no more. Your accent appears in 5 places, #222222 carries the body text, and #666666 carries the muted role and contact line.
• No background color anywhere. The word background appears zero times and there is no bgcolor attribute, which matters for dark mode and gets its own section below.

Turn on every field, all three social links and a photo, and it grows to 2,278 bytes across 17 style attributes and 52 declarations, with the accent now in 7 places.

Everything you type is escaped before it goes in. A company called Smith & Sons <Ltd> comes out as Smith & Sons <Ltd> and reads correctly, and a <script> tag typed into the name field is neutered the same way. I typed four awkward names into it and decoded the output back: Smith & Sons <Ltd>, a name with curly quotes in it, a Japanese name, and a name with an emoji on the end. All four came back byte for byte identical to what went in. Accented letters, CJK and emoji pass through as themselves rather than as escape codes, which keeps the file smaller and readable.

There is no length cap either. A 200 character name comes through whole, with no truncation and no warning, taking the signature to 743 bytes. Whether your recipient's inbox can lay that out is a different question, and not one this tool has any say in.

Two buttons cover all three clients, and picking the wrong one is where most people get stuck. Copy signature puts a formatted block on your clipboard. Copy HTML puts the raw source there.

Gmail wants the formatted version. Press Copy signature, open Settings (the gear, then See all settings), scroll to the Signature block, create a new signature and paste. It lands with the colors and links intact. If you get a wall of code instead, you pressed Copy HTML, swap and redo it.

Outlook splits depending on which Outlook you have. New Outlook and Outlook on the web want Copy HTML: open Settings, Mail, Compose and reply, find the signature editor, click the source button marked <> and paste there. Be ready for it to look alarming, since the whole thing is one line with no breaks in it. The classic desktop app has no source view at all, so the honest route is to save the HTML as a .htm file into Outlook's Signatures folder, or paste the formatted version and accept that Word's engine may nudge the spacing.

Apple Mail strips formatting out of its own signature editor the moment you paste, so the dependable route goes around it. Create a placeholder signature in Mail settings, quit Mail completely, replace the contents of the saved signature file with your HTML, then relaunch. It stays put once it is in, the setup is just more of a shuffle than the other two.

The signature never embeds your picture. It writes a link to wherever you said the picture lives, so the file stays small and your recipient's mail client fetches the image itself. That also means the URL you paste has to be one a stranger can reach.

I typed nine kinds of address into the photo box and recorded what came out of each:

what you paste	what ends up in the signature
https://example.com/me.jpg	used exactly as typed
example.com/me.jpg	https:// added for you
http://example.com/me.jpg	left on http, not upgraded
https://drive.google.com/file/d/abc/view	passed straight through, public or not
/Users/you/Pictures/me.jpg	https:///Users/you/Pictures/me.jpg, broken for everyone including you
C:\Users\You\Pictures\me.jpg	no image at all
file:///C:/Users/You/me.jpg	no image at all
data:image/png;base64,iVBOR...	no image at all
blob:https://example.com/abc-123	no image at all

Those last four are the honest catch, and I would rather you hear it here than find it in a sent folder. A pasted-in encoded image, a local file path, and a temporary browser link are all rejected on the way in, and nothing tells you it happened. The preview just has no picture in it, and if you were not specifically looking for one you would sail past it. Anything that is not an ordinary web address is dropped, so if your photo vanished, that is why.

The image also carries a width and deliberately no height. This tool used to set a fixed square with a crop instruction on it, which looked perfect in the preview and then came out stretched for anyone reading in Outlook, because Word's engine ignores that instruction and keeps the box. Setting one dimension and letting the other follow is the sizing rule email developers have settled on for exactly that reason, so that is what it does now. Which means a non-square photo does not get cropped square for you. It stays a non-square photo, so crop it to the shape you want before you host it.

Advice about keeping a signature short is everywhere and it is always vague. So I added one field at a time and weighed the output after each:

after adding	signature size	cost
name alone	550 bytes
job title	742 bytes	+192
company	798 bytes	+56
email	1,079 bytes	+281
phone	1,196 bytes	+117
website	1,316 bytes	+120
tagline	1,540 bytes	+224
LinkedIn, X and GitHub	2,090 bytes	+550
a photo	2,278 bytes	+188

Two things fall out of that. Opening a new line is expensive and joining an existing one is cheap. Your email address costs 281 bytes because it starts a fresh table row and drags the whole font list in with it. Your phone number and website then cost 117 and 120, because they slot into the row your email already paid for. Same for the job title at 192 and the company at 56.

And three social links cost 550 bytes, which is the entire name-only signature all over again. That is the argument for stopping at one. Four phone numbers and a fax line only tell the reader you do not know which one you answer, and now you can see the weight of them too.

Two facts about color, both taken off the output rather than assumed.

The signature never paints its own background. No bgcolor attribute, no background declaration, zero occurrences of either. So it sits on whatever your reader's inbox is using instead of flashing a white rectangle into the middle of a dark thread.

It does name its text colors, and you do not choose them. Your name and phone number are fixed at #222222 and the role and contact line at #666666, both near enough to black. Whether near-black text stays readable on a dark background comes down to whether that particular client rewrites colors for dark mode, and I have no way to test that from here. What I can tell you is which two colors are in the file, so you know what is riding on it.

The accent is the part you can genuinely get wrong. There is no contrast check on it at all. I set it to pure white and the tool accepted it without a word, which puts your company name and every one of your links in white on a white inbox. Pick something dark enough to read against plain white, and check the preview rather than the swatch, since a color that looks strong in the picker can wash out badly at 13 pixels.