How to Make a Transparent Signature PNG (Free)

To make a transparent signature PNG, draw your signature on a canvas that has no background and export it as PNG, not JPG. Our free signature generator does exactly that: sign with your mouse, trackpad or finger, open Download, choose Download as PNG, and you get an image where every pixel around the ink is fully transparent. Drop it into a PDF, a Word file or a Google Doc and the signature sits on the line without a white box around it.

The signature generator is free, needs no account and runs entirely in your browser. Visitors get 5 tool uses a day, and a free My Botsy account (100% free, no spam) removes that cap. Everything below was tested on October 31, 2026 on the live tool in headless Chrome: we drew test signatures, exported all four formats and opened the files to check every pixel.

How to make a transparent signature PNG, step by step

1. Set up the screen first. Open the signature generator and put the window at the size you'll use. On a phone, pick portrait or landscape before you sign. Resizing the window or rotating the phone clears the pad (more on that below).
2. Pick the ink color before you draw. The color picker under the pad only affects strokes drawn after you change it. Black or a dark navy prints best.
3. Sign large. Use most of the pad. A big signature scaled down in a document looks smoother than a small one scaled up.
4. Fix mistakes with Undo. Undo removes the last stroke (one continuous line from press to release). Clear wipes everything.
5. Download as PNG. Open Download and choose Download as PNG. The file is saved as download.png, so rename it to something like signature.png.
6. Crop and place it. The PNG is the size of the whole pad, so crop the empty area in your document editor (steps below) and position it on the signature line.

The white you see behind the pad is only the page behind the canvas. The canvas itself is transparent, which is why the PNG comes out without a background.

What we measured: PNG vs JPG vs WEBP vs SVG

We drew the same three-stroke test signature in black and exported each format from a 1280-pixel-wide Chrome window (a standard, non-Retina display). The pad measured 1110 × 502 pixels, and so did every raster file:

The JPG result needs a warning of its own. JPEG has no transparency, and when a browser turns transparent pixels into JPEG it fills them with black. Our black-ink JPG contained 557,220 pixels and every single one was black: the signature was invisible. With navy ink (#1a3c8f) the ink survived, but as blue lines on a black rectangle, which is useless on a white page. If a form insists on JPG, export the PNG and convert it after flattening it onto white in an image editor.

WEBP keeps transparency and is the smallest file, but Adobe Acrobat's signature import, for example, lists JPG, JPEG, PNG, GIF, TIFF, TIF and BMP, and WEBP is not on that list. PNG is the format that works everywhere.

The SVG is a true vector file: our test signature became 118 short curved <path> elements, each with its own stroke width, because the line gets thinner the faster you move. That variable width is what makes it look like ink rather than a uniform marker. Use the SVG when the signature has to scale cleanly, for example on a website or in a design app.

Retina screens and phones give you more pixels

The canvas is sized to your screen's pixel density. Running the same test at 2× density (as on most modern laptops and phones), the PNG came out at 2220 × 506 pixels and 44,960 bytes, with the signature itself about 1,100 pixels wide. That is plenty for print. One quirk we found: on 2× and 3× screens the drawing area is shorter than on a 1× screen (257 CSS pixels tall instead of 506 on a laptop, and 360 × 173 on a phone-sized screen), so leave a little margin above and below your strokes.

How to crop and insert the signature

In our test the ink only covered 500 × 128 pixels of the 1110 × 502 image. Cropping to that area produced a 5,882-byte PNG and, more importantly, an image box that hugs the signature, so it's easy to position.

Microsoft Word

1. Go to Insert > Pictures > This Device and pick your PNG.
2. With the picture selected, open Picture Format > Crop and drag the handles in to the edges of the ink.
3. Choose Wrap Text > In Front of Text so you can drag it over the signature line, then resize from a corner to keep the proportions.

Google Docs

1. Choose Insert > Image > Upload from computer.
2. Click the image and select In front of text in the bar that appears under it. Google notes that wrapping and position options aren't available in pageless documents, so switch the file to pages format if you don't see them.
3. Double-click the image to crop it, then drag it onto the line.

A PDF in Adobe Acrobat Reader

1. Open the PDF and choose Fill & Sign.
2. Click the Sign icon, then Add Signature, and choose Image.
3. Select your PNG, click Apply, then click where the signature goes. You can move and resize it afterwards.

Pitfalls we hit while testing

• Resizing clears the pad. The tool redraws the canvas whenever the window changes size, and that wipes the signature. In our test, shrinking the window from 1280 to 1000 pixels wide left an empty pad. Download before you rotate your phone or resize the window.
• Color changes are not retroactive. When we switched to navy halfway through, the SVG contained 107 black segments and 11 navy ones. Pick the color first, or Clear and redraw.
• Every download is called download.png. If you make several versions, rename each one right away so you don't overwrite or mix them up.
• Mouse signatures look shaky. A trackpad, stylus or finger on a phone gives smoother lines. Draw it a few times and keep the best one.
• Undo works per stroke. One stroke is everything between pressing and releasing, so a signature written in one continuous movement disappears in one Undo.

Is a drawn signature image legally valid?

Often yes, but not always. In the US, the ESIGN Act (15 U.S.C. § 7001) says a signature or contract in interstate or foreign commerce "may not be denied legal effect, validity, or enforceability solely because it is in electronic form." In the EU, Article 25 of the eIDAS Regulation (910/2014) says the same about electronic signatures as evidence, and gives the full legal effect of a handwritten signature only to a qualified electronic signature. A pasted image proves little about who added it, so for contracts that matter, use a service that records an audit trail, and check what the other party accepts. Treat the PNG like your pen signature: keep it private and only insert it into documents you mean to sign.

Your signature stays on your device

We monitored the browser's network traffic while drawing and exporting in all four formats: the tool made zero requests. Drawing and file creation happen in the page itself, and nothing is uploaded to our server. The file only exists where you save it.

Related free tools and guides

• Shrink the PNG further with the image optimizer, also in your browser. Our guide on how to compress images for a website explains the settings.
• Need the signature inside an HTML email template? Turn it into a data URI with image to Base64.
• Scanned a paper signature with your phone? Check it with the EXIF reader first, and see how to check if a photo has location data.
• Building a contact button for the same email? The mailto link generator and our guide to mailto links cover it.

Frequently asked questions

How do I make my signature background transparent?

Draw it in the signature generator and download it as PNG. The canvas has no background, so everything except the ink is fully transparent. Don't choose JPG: JPEG can't store transparency and the background turns black.

Why is my signature JPG completely black?

JPEG has no transparency, so the browser fills the transparent area with black. With black ink, the signature vanishes; in our test all 557,220 pixels were black. Download as PNG instead.

Which format should I use for a PDF?

PNG. Adobe Acrobat's image signature import accepts JPG, PNG, GIF, TIFF and BMP, not WEBP or SVG, and PNG is the only one of those that keeps the transparent background from our tool.

Can I create a signature on my phone?

Yes. Open the tool in your phone's browser and sign with your finger. Choose portrait or landscape before you start, because rotating the phone clears the pad.

Is my signature uploaded anywhere?

No. In our network test the tool sent zero requests while drawing and exporting. The image is created in your browser and saved straight to your device.

Is the signature generator free?

Yes. It's free with no account needed. Visitors get 5 tool uses a day, and a free account (no spam) removes the limit.

Ready to sign? Open the free signature generator, draw your signature, download it as PNG and crop it in your document.