Guide

Stop using a signature html generator. Build your own in one prompt.

Every tool in the top five results for "signature html generator" ships the same product: 12 preset templates, a paywall on logo upload, their domain, their analytics. None of them explain the one thing a junior on your team actually needs to know, which is why email signatures have to be nested tables with inline styles, not Tailwind classes. This page walks through the constraint, and then shows how to build a generator your team owns in a single mk0r prompt.

m
mk0r
7 min
4.8from 10K+ builders
No signup, no card
Vite + React + TS in the VM
Table HTML export

The constraint every hosted generator hides

Outlook 2007, 2010, 2013, 2016, and Outlook Classic on Windows render email with Microsoft Word, not a browser engine. Word does not do flexbox, does not do grid, drops most external stylesheets, and strips classes. Gmail webmail strips external styles on send. Apple Mail is the only major client that behaves like a browser, and even it is finicky about web fonts.

The only layout that renders identically across this set is a nested <table role="presentation"> with every style written inline on the element. That is why the HTML every hosted generator hands you looks like it was written in 2004. It has to.

The shape of an email-safe signature (canonical markup)

Here is the smallest table that renders the same in Gmail, Outlook, Apple Mail, and Yahoo Mail. Note the double nesting: an outer single-cell table to scope the layout, and an inner table to hold the columns. No CSS grid, no flexbox, no classes, no external stylesheet.

signature.html

Every property that matters lives inline on the element: font-family, color, padding, vertical-align, display:block on images to kill the 3-pixel phantom margin. This is the fixed point every generator's output has to satisfy.

What mk0r wires into the signature generator you build

Name, title, email
Logo URL
Brand color
Your generator (React + Vite)
Nested table HTML
Inline styles only
Clipboard + Resend

The prompt that actually works

The default mk0r system prompt says "Tailwind v4 is pre-configured, use utility classes." That is correct for the generator UI, and wrong for the export. Be explicit about the export format in your first message, and the agent will split them cleanly: Tailwind for the form, raw table HTML for the output.

prompt.txt

The two load-bearing sentences are "exactly the markup that will be copied" and "copy the stringified markup, not the rendered DOM." Without them, the agent will copy the Tailwind-rendered output, which Gmail will strip the moment you paste it into a new message.

What happens when you hit Enter

1

VM boots, no account asked

mk0r provisions a Vite + React + TS + Tailwind v4 project at /app in an E2B sandbox. Dev server comes up on port 5173 with HMR over WSS.

2

The HMR bridge installs itself

src/_mk0rBridge.ts wires four Vite lifecycle events (vite:beforeUpdate, vite:afterUpdate, vite:error, vite:beforeFullReload) into the preview iframe via postMessage. That is why the right pane updates as the agent types.

3

Agent writes SignatureForm.tsx and EmailSafeMarkup.ts

Two files: the Tailwind form component for humans to edit, and a string-building function that emits the nested-table HTML. Both get imported from App.tsx.

4

Playwright MCP verifies the rendered DOM

The agent opens Chromium inside the VM, loads http://localhost:5173, and reads the console. If vite:error fires, it fixes the file before reporting done.

5

You copy the HTML, you paste, it works

The clipboard contains a 40 to 60 line string of table markup with inline styles, which every major client renders the same.

mk0r session, abridged

The anchor fact nobody else is writing about

mk0r's VM is not a general-purpose Node sandbox. It is a Vite + React + TypeScript + Tailwind v4 project at /app, and there is a small file at src/_mk0rBridge.ts that every new project inherits. That bridge is 28 lines of TypeScript that listen for four Vite HMR events and postMessage them to the parent window. Without it, the preview pane on mk0r.com would not know when your edits land. With it, the agent can see vite:error the moment it happens and patch the file before the turn ends.

The second anchor is the pre-provisioned .env. By the time the agent starts writing your signature generator, four env vars are already populated: PostHog (analytics), Neon (Postgres), Resend (transactional email), and GitHub (GITHUB_REPO_URL). None of the hosted signature generators in the top SERP let you wire analytics, a database, email, and source control into your signature flow without a paid plan. mk0r does it because those credentials live inside the VM you are already renting for free.

You can see the scaffolded files in the mk0r source at docker/e2b/files/app/ (vite.config.ts, src/_mk0rBridge.ts, src/index.css, CLAUDE.md). Everything said on this page is verifiable against that directory.

0 linesmk0rBridge.ts, the HMR bridge
0 servicesPre-wired env (PostHog, Neon, Resend, GitHub)
0 sFrom first prompt to running VM
0+Email clients that render tables + inline styles

Rented generator vs. owned generator

The straight comparison between a SaaS signature HTML generator and the one you build with mk0r. "Competitor" here stands for the median of the top SERP results.

FeatureHosted signature SaaSmk0r (you build it)
What you actually getOne of 12 preset templates, hosted on their domainA private generator app, your code, your design, your fields
Logo uploadPaywalled or watermarked on the free tierFree, hosted wherever you want (Resend, S3, intranet)
Custom branding and fieldsLocked to their template schemaAdd or remove any field in a follow-up prompt
Team presetsPaid plan, usually per seatPersist in the pre-provisioned Neon Postgres, no per-seat fee
HostingTheir domain, their analytics, their adsYour domain, your PostHog, no third-party tracking
Export formatOpaque HTML blob, often with tracking pixelsPlain table HTML with inline styles, readable and auditable
Account requiredEmail, verification, and often a credit cardNone. VM boots on mk0r.com before you have a session key

What you get for free that hosted generators paywall

Because the VM mk0r boots has real credentials wired in, a signature generator built on top of it can do things the hosted tools gate behind paid plans. Not because mk0r is clever, but because it hands you a working environment instead of a template picker.

Pre-wired Postgres

Store team presets in Neon. The VM's .env already has DATABASE_URL and NEON_HOST, so the generator's 'Save as company default' button works out of the box.

Drop-in analytics

PostHog keys are pre-provisioned. You can track how often each department copies the HTML and which field is most often edited.

Email delivery

Resend API key is wired. Ask the generator to email the finished HTML to new hires on signup instead of chasing them over Slack.

GitHub push, no auth dance

GITHUB_REPO_URL is populated on boot. One prompt commits the generator to a private repo you can deploy from later.

When this is the wrong tool

If you need one signature for one person once, use HubSpot's free generator and move on. Fifteen minutes, done. mk0r is the right call when a team of 10 to 500 people needs a consistent, on-brand signature that HR can extend without filing a design ticket, and you do not want the company's employee contact list sitting on someone else's SaaS.

It is also the right call when you want to learn why email HTML looks the way it does. Building the generator forces you to face every quirk (vertical-align, display:block on images, system font stacks, the 600px rule) instead of having the SaaS hide them.

Want a live walkthrough on your team's branding?

Book a call and we will open a live mk0r session, paste your brand colors and logo into the first prompt, and hand you a working signature generator end-to-end. No slides.

Frequently asked questions

Why do email signatures have to be tables with inline styles?

Outlook 2007 through Outlook Classic uses Microsoft Word's rendering engine, which does not support modern CSS: no flexbox, no grid, no CSS vars, no external stylesheets, no media queries. Gmail strips classes and external styles on send. The lowest common denominator that renders identically in every major client is a nested table layout with every style written inline on the element. That is why every production signature generator, including the ones in the top SERP results, emits tables under the hood even though nobody explains it on the page.

Can mk0r actually emit table-based HTML? Isn't it a Tailwind React builder?

Yes. The preview UI runs on Vite, React, and Tailwind v4 inside an E2B VM (see docker/e2b/files/app/vite.config.ts in the mk0r repo). But what you export from the generator is whatever string your copy-to-clipboard function produces. If you prompt mk0r to build an EmailSafeSignature component that returns a nested table as a template string with inline styles, it does exactly that. The trick is being explicit about the export format in the prompt, because the default would be Tailwind utility classes that Gmail discards.

What does the HMR preview actually do?

The file at src/_mk0rBridge.ts is auto-inserted into every new mk0r project. It listens for four Vite HMR events, vite:beforeUpdate, vite:afterUpdate, vite:error, and vite:beforeFullReload, and postMessages them to the parent window. That is why edits to your signature generator show up in the right-hand preview without a refresh; the HMR stream is literally the thing the preview pane is watching.

How long does it take to build a working signature generator this way?

About one prompt. A starter generator with fields for name, title, email, phone, logo URL, a live preview, and a copy-HTML button lands in 30 to 90 seconds depending on session warmth. Extending it (custom fonts, a disclaimer, social icons, team presets) is an extra prompt each. There is no signup between the landing page and a running VM, so the first prompt is typed at mk0r.com and submitted.

Will my signature look the same in Outlook, Gmail, and Apple Mail?

If the generator follows two rules, mostly yes. Rule one: tables only, no CSS grid, no flexbox, no floats. Rule two: every style inline on the element, with pixel widths and absolute units (no rem, no percentages except width="100%" on the outer table). Web fonts will not load in Outlook Classic regardless, so pick a system-font stack like Arial, Helvetica, sans-serif. Keep images under 1 MB and under 600px wide for retina clients.

What about the logo? Every other generator paywalls it.

mk0r's VM has pre-provisioned env vars for Neon (Postgres), Resend (email), PostHog (analytics), and GitHub. You can ask the generator to upload the logo to a public bucket of your choice, or just paste a public URL into the form. Nothing is paywalled because mk0r never asked you to sign up; the VM just belongs to you until you close the tab.

Do I have to use your generator? Can I take the code and host it somewhere else?

You take the code. mk0r publishes the app you built to a preview URL, and you can copy the files out or push to GitHub. Since the tool is a plain Vite + React project, npm run build produces a static bundle that runs anywhere: Netlify, a company intranet, a single S3 bucket.

What are the right field defaults for a team signature generator?

Name (required), job title, email (auto-filled from SSO if you wire it up), direct phone, company name, a single CTA line (a link to your product, not five social icons), and a logo URL. Keep total height under 200 pixels so threads do not balloon. Avoid images with text on them, they break for screen readers and get flagged by spam filters.

One prompt, one VM, one generator your team owns. Zero accounts before the first line of code runs.

Start building

Numbers on this page: 0 seconds from prompt to running VM.

Book a walkthrough