Developer toolbox

Online Image Tools for Developers

Prepare Base64 images and ID photos with practical browser-based image utilities.

Image Tools

Choose a tool

2 tools

Pixels, millimetres, and DPI are three different constraints, and a form usually cares about all three.

Two tools here, and they barely overlap. Base64 Image Encoder & Decoder is about representation: turning image bytes into a Data URL you can embed, or turning a payload back into a file. ID Photo Size & Layout Tool is about a physical artifact: background, crop, millimetre dimensions, resolution, and a print sheet. Pick by the destination, because a document and a printer want completely different things.

Data URLs are convenient and larger than the file

Base64 Image Encoder & Decoder reports the detected media type and produces a Data URL you can paste into CSS, HTML, an email template, or a test fixture. The encoding adds roughly a third to the size and the result cannot be cached separately from the document that contains it, which makes it a good fit for a small icon and a poor one for a photograph.

Decoding preserves the bytes it was given. The tool is not a format converter, so a payload that was originally a PNG comes back as a PNG. If you need a different format or a smaller file, that is an image editor's job and should happen before encoding, not after.

ID photos: the requirements live at the destination

ID Photo Size & Layout Tool handles background replacement, cropping to a millimetre size, resolution, and arranging several copies on a print sheet. Those are separate constraints and satisfying one does not satisfy the others. A 35 by 45 millimetre photo at 300 DPI is roughly 413 by 531 pixels, and a form may state its requirement in any of the three units.

Background colour, head height as a proportion of the frame, and the acceptable margin above the head vary by authority and change over time. The tool applies what you tell it, so check the published requirement of the specific form or office on the day you submit rather than relying on a size someone remembered.

Judge the export, not the preview. A browser preview is scaled and can hide a soft edge left by background replacement or a crop that clipped an ear. Open the full-resolution file before you print or upload it.

Before you rely on a result

  • Confirm pixel dimensions, physical size in millimetres, and DPI separately. Meeting one of the three does not mean you have met the others.
  • Check the head-size and background rules published by the authority or form you are submitting to, on the day you submit.
  • Inspect the full-resolution export rather than the on-page preview, especially along the edges after background replacement.
  • Use Data URLs for small inline assets only. Anything sizable should stay a linked file so a browser can cache it.
  • Clear identity photos from the page when you are finished, and do not paste a Data URL containing one into a shared document or chat.

Frequently asked questions

Does Base64 make an image smaller?

No, it makes it about a third larger. Base64 exists to move binary data through channels that only accept text, not to compress. If size is the problem, resize or re-encode the image itself before converting it.

Why does my photo fail even though the pixel size is right?

Because pixel dimensions, physical size, and resolution are independent. A file can be exactly the required pixel count and still carry the wrong DPI metadata, so a printer produces the wrong physical size. Set all three, and check the specification rather than inferring it.

Are my images uploaded?

No. Both tools read the image in this browser tab and do the work locally, with nothing sent to a server and nothing kept between visits. An identity photo is still sensitive data on your own device, so clear it when you are done.

Browse all developer tools or read the developer tool guides for worked examples.