Bring in the image
Choose a file, drop it into the workbench, paste a clipboard image, or paste an existing image data URI.
← All workbenches
IMAGE TO DATA URI
Turn a local image into code-ready output.
Choose, drop, or paste one image. Prepare it on your Mac, then copy the raw data URI or a ready-made CSS, HTML, or Markdown snippet.
Download for Mac
Free download. Requires macOS 14 or later.
WHAT IT HELPS WITH
Move one image from your Mac into your code.
Prepare the output
Review the image, set its name and alt text, and resize PNG, JPEG, or GIF output when a smaller copy is needed.
Copy the right form
Use the raw data URI or copy a complete CSS, HTML, or Markdown snippet for the place where the image will be embedded.
SIZE AND FORMAT
Keep inline images practical.
Open PNG, JPEG, GIF, WebP, or SVG input through 10 MiB. The workbench shows image details and warns when the generated data URI grows beyond 1 MB.
Resize changes the image bytes for PNG, JPEG, and GIF. WebP and SVG keep their admitted source bytes in the generated output.
10 MiBMaximum source size
4 output formsRaw, CSS, HTML, and Markdown
Full-value copyEven when the on-screen preview is shortened
INCLUDED IN FREE
The complete one-image workflow.
Local input, metadata, output generation, supported raster resize, full-value copy, and saving the current image are all included in Free.
SESSION ONLY
The image is not added to a history.
Image bytes, pasted data URI text, generated output, and resize state stay in the current workbench session.
LOCAL BY DEFAULT
Your image stays on your Mac.
Reading, resizing, and generating output happen locally. Dev Workbench does not upload the image or generated data URI to a KeLoc server.
Read the Dev Workbench privacy policy