MotionShine01 / Formats
Five ways to paste
Data URL, plain Base64, CSS, HTML or Markdown, switched in one menu.
Free tool
Image to Base64, ready to paste.
Drop one or more pictures to turn each into Base64: a data URL, plain Base64, a CSS background line, an HTML img tag with the width and height, or a Markdown image. You see each file's size before and after, since Base64 is about a third bigger, and copy any of them with one click. PNG, JPG, WebP, GIF, SVG and ICO all work. Nothing is uploaded.
Inline small icons and logos; link big photos as files, because Base64 cannot be cached on its own and makes pages heavier.
Converted in your browser. Your pictures are never uploaded.
Pictures as text
Embed without a separate file.
02 / Size
Know the cost
Base64 text is about 33% bigger than the file. The sizes are shown side by side.
03 / Many
Several at once
Drop a batch of icons and copy each one.
Questions
Good to know.
How do I convert an image to Base64?
Drop the picture and copy the result. Pick the format you need under Give me.
What is a data URL?
The whole file written as text after data:image/png;base64, so it can sit inside HTML or CSS.
Why is the Base64 bigger than the file?
Base64 uses 4 characters for every 3 bytes, about a third more.
How do I turn Base64 back into a picture?
Use the Base64 decoder.
Are my pictures uploaded?
No.