Email Signature Generator CSS icons

Nikolay Sabev — Thu, 10 Sep 2026 15:12:56 +0000

Back in 2017, I was experimenting with something that was pretty fun for the CSS we had at the time — building icons without using images.

Using mainly CSS, :before, :after, borders, shadows and a bit of creativity, I managed to create a set of icons that didn't depend on external image files. The interesting part for email was simple: no images to load or block — the icons are always visible.

You can still see that old experiment here:

Fast forward to 2026

At my last job, I decided to apply some of that old knowledge to an email signature.

And then I met Classic Outlook again. :D

What looked like a simple signature quickly turned into dealing with Outlook's rendering limitations, different behaviour between email clients, px → pt conversions, table rendering and weird spacing issues.
A few survival tricks

Along the way I found a few useful tricks — one of my favourites being that line-height: 0.5pt can practically zero out a line in Classic Outlook, which solved one of the most annoying spacing problems I had.

Eventually, that little fight turned into a complete email signature generator: SimpleSignature

nikolaisabev.eu

If you'd like to check out the source code or contribute, you can find the repository on GitHub

k0ko / SimpleSignature

Simple Email Signature with CSS Icons

It's not trying to be the prettiest or the most complicated signature generator out there. It's simple, effective and built around what I learned from actually fighting with email clients.

It's completely free, there's no registration, and I don't store the data you enter. Feel free to use it!

If you find a bug, have an idea, or think something could work better, leave a comment here or send me an email. Feedback is more than welcome.

And if it saves you some time and you feel like supporting the work, there's a Buy Me a Coffee button. If you wish. :)

What's the worst email client rendering bug you've ever had to deal with? Do you still rely on table-based layouts, or have you found a cleaner workaround? Let me know in the comments!

Cheers,
Nikolay

DEV Community: Nikolay Sabev

Email Signature Generator CSS icons

k0ko / SimpleSignature

Simple Email Signature with CSS Icons