Image ↔ Base64 — Free Online Tool

Image ↔ Base64: free online tool with examples and documentation. Convert, generate, format, or analyze data instantly in your browser.

Use this free online Image ↔ Base64 directly in your browser. No signup required, no data leaves your device. Part of Utilier — a collection of 133+ developer utilities.

What is Image ↔ Base64?

Converts images to Base64 data URIs for embedding in HTML or CSS, or decodes Base64 strings back to downloadable images. Supports PNG, JPEG, GIF, WebP, and SVG. Base64 represents binary image bytes as printable text; a data URI adds a MIME type so browsers can render it without fetching a separate file. It is useful for small, self-contained assets, but increases payload size compared with the original binary image.

Base64 represents binary image bytes as plain ASCII text. A data URI adds a MIME type and prefix such as data:image/png;base64, so the browser can decode and display the image without a separate file request. It is practical for small, self-contained assets, but the encoded form is larger than the original binary file.

Why use image base64?

Data URIs eliminate extra HTTP requests by embedding images directly in HTML/CSS. Useful for small icons, email templates, and single-page applications where reducing requests matters.

When to use image base64

Use when embedding small images in HTML emails (where external images may be blocked), creating self-contained HTML files, or debugging image data from APIs.

How to use image base64

Simple steps to use this tool effectively.

Enter input: Paste or type your input data into the input area. Supports various formats and encodings.
Configure options: Select format, encoding, or other options as needed. Sensible defaults are provided for quick start.
Process data: Click the convert, generate, or format button. Many tools show real-time results as you type.
Review output: Check the output for correctness. Validation errors are shown if any issues are detected.
Copy or export: Click copy button to clipboard or download results as a file for use in your project.
Try examples: Use provided examples to understand features and learn common patterns and use cases.

Key features

Fast processing: Quick and accurate image base64 operations with instant results.
Input validation: Validates input format and provides helpful error messages and suggestions for fixes.
Multiple formats: Supports various input and output formats for maximum compatibility and flexibility.
Built-in examples: Includes common use case examples to help you get started quickly and learn.
Copy & export: Easy copying to clipboard or downloading results as files for use in projects.
Real-time updates: See results instantly as you type or change options. No need to click buttons.
Client-side privacy: All processing happens in your browser. No data is uploaded to servers or stored.
Comprehensive docs: Detailed documentation, specifications, FAQs, and troubleshooting help included.

Common use cases

Web development: Use image base64 during coding, debugging, and testing web applications.
API integration: Test API requests and responses, validate data formats, debug integration issues.
Data conversion: Convert between different data formats, encodings, or representations as needed.
Learning & education: Understand concepts through interactive examples, experimentation, and documentation.
Documentation: Create clear examples and code samples for technical documentation and guides.
Troubleshooting: Debug issues in development or production by validating, converting, or analyzing data.
Quick prototyping: Rapidly test ideas, generate sample data, or validate approaches without writing code.

Examples

Convert images to/from Base64.

Image to data URI

icon.png (2 KB)

data:image/png;base64,iVBORw0KGgo...

Base64 to image

data:image/png;base64,...

(downloadable PNG image)

Technical reference

Image ↔ Base64 specifications, standards, and technical details.

Standards compliance: Follows industry standards, specifications, and best practices for compatibility and correctness.
Input formats: Supports common input formats used in web development, APIs, and data interchange.
Output formats: Provides multiple output format options for different use cases and requirements.
Character encoding: Handles UTF-8 and other character encodings correctly for international text support.
Browser support: Works in all modern browsers: Chrome, Firefox, Safari, Edge. Requires JavaScript enabled.
Performance: Optimized for fast processing of typical workloads. Large inputs may take longer depending on device.
Security & privacy: Client-side processing only. No data is uploaded to servers, stored, or transmitted externally.
Accuracy: Validated against test suites, specifications, and real-world examples to ensure correctness.
Limitations: Handles typical use cases efficiently. Extremely large inputs (megabytes) may be slower or hit browser limits.
Updates: Regularly updated with new features, improvements, bug fixes, and user-requested enhancements.

Common mistakes to avoid

Embedding large images

Base64 adds 33% overhead. A 100KB image becomes 133KB of inline text. Only embed images under 10KB. Larger images should be separate files with caching.

Frequently asked questions

Why do email templates use Base64 images?

Many email clients block external images by default. Base64-encoded images are inline and always display, though they increase email size.

References

Privacy and availability

Runs entirely in your browser — zero server processing
No signup or account required
Works offline once loaded
Fast, lightweight, no external dependencies
Available as a browser extension for Chrome and Firefox

All developer tools

JSON Beautifier & Validator — Format, minify and validate JSON. Reports the exact error location.
HTML Beautifier & Minifier — Indent or minify HTML. Content of pre/script/style is preserved.
CSS Beautifier & Minifier — Pretty-print or minify CSS. Handles comments, strings, and nested at-rules.
JavaScript Beautifier & Minifier — Format, minify, or obfuscate JavaScript. String, template, regex and comment aware.
SQL Formatter — Format SQL queries: clauses on new lines, keywords uppercased.
SQL Converter — Convert SQL INSERT statements or SELECT results to CSV, JSON, XML, YAML, or HTML.
Markdown Preview — Live GitHub-flavoured-ish Markdown rendering (safe, HTML-escaped).
Diff Checker — Compare two texts line by line with additions and deletions highlighted.
Base64 / Base32 / Base58 / Base85 Encoder — Encode and decode text using Base64, Base32, Base58, Base85, or ASCII85.
URL Encode / Decode — Percent-encode or decode text and query components, in any character set.
HTML Entity Encode / Decode — Escape/unescape HTML special characters and numeric entities.
ROT13 / ROT-N Encoder — Apply the ROT13 letter cipher (or any ROT-N shift) to text. ROT13 is its own inverse.
JWT Decoder — Decode a JWT's header and payload. Optionally verify an HMAC signature.
JWT Generator — Create a signed JWT (HS256/384/512) from a JSON payload and secret.
Hash Generator — Compute MD5, SHA-1, SHA-256, SHA-384, SHA-512, and CRC-16 digests of text.
HMAC Generator — Compute a keyed HMAC signature of a message (SHA-1/256/384/512).
CRC32 Generator — Compute the CRC-32 (IEEE 802.3) checksum of text, shown as hex and decimal.
Hash Verification — Compute a hash of your text (MD5, SHA-1/256/384/512 or CRC-32) and compare it against an expected value to confirm a match.
Checksum Calculator — Upload a file to compute its SHA-1, SHA-256, SHA-384, SHA-512 and CRC-32 checksums for integrity verification.
Text Compression — Compress and decompress text using GZip, Deflate, or Deflate-Raw algorithms.
BCrypt Generator — Hash a password with bcrypt (Blowfish-based, salted) at a configurable cost, or verify a password against an existing bcrypt hash.
AES Encrypt / Decrypt — Encrypt or decrypt text with AES-256-GCM using a password (PBKDF2-SHA256 key derivation). Output is base64 packing salt + IV + ciphertext.
RSA Encrypt / Decrypt — Generate an RSA keypair and encrypt/decrypt short messages with RSA-OAEP (SHA-256). Keys are PEM. Best for small payloads (≈190 bytes at 2048-bit).
UUID Generator — Generate cryptographically-random version 4 UUIDs in bulk.
Password Generator — Generate strong random passwords with configurable character sets.
Regex Tester — Test JavaScript regular expressions with live match highlighting and groups.
Unix Timestamp Converter — Convert between Unix timestamps and human-readable dates (local & UTC).
Timezone Converter — Convert a date and time between any two IANA time zones (DST-aware).
Date Difference Calculator — Calculate the elapsed time between two dates as a calendar breakdown and in total units.
QR Code Generator — Turn text/URLs into a QR code, optionally with a centered logo. Download as PNG.
Color Picker & Converter — Convert between HEX, RGB(A), HSL(A), HSV, and CMYK. Pick a color visually.
cURL Converter — Convert a curl command to fetch, Axios, React, Python, Go, PHP, Java or Rust — and fetch back to curl.
JSON ↔ YAML — Convert JSON to YAML and YAML back to JSON.
TOML Converter — Convert TOML to JSON or YAML and JSON/YAML back to TOML, with validation.
JSON ↔ CSV / SQL — Convert JSON array to CSV, TSV, or SQL INSERT statements. Parse CSV/TSV back to JSON.
Lorem Ipsum Generator — Generate placeholder text by paragraphs, sentences or words.
Case Converter — Convert text between camelCase, snake_case, kebab-case, Title Case and more.
Number Base Converter — Convert integers between binary, octal, decimal, hexadecimal, and custom bases (radix 2-36).
Text / Binary / Hex / Decimal / Octal Converter — Convert between text, binary, hexadecimal, decimal, and octal. Auto-detects the input format.
Slug Generator — Convert titles into clean, URL-friendly slugs. Strips accents and punctuation.
CSS Unit Converter — Convert between px, rem, em, %, pt, pc, in, cm, mm, vw and vh.
Image Converter — Turn an image into a Base64 data URI, CSS background, <img> tag or an SVG wrapper.
Unicode Encoder / Decoder — Convert text to and from \uXXXX escapes, or list its Unicode code points.
UTF-8 Encoder / Decoder — Convert text to its UTF-8 bytes (hex, decimal or binary) and decode bytes back to text.
ASCII Converter — Convert text to and from character codes in decimal, hexadecimal or binary.
Escape / Unescape — Escape and unescape strings for JSON, XML, JavaScript, CSV, and SQL contexts.
Word & Character Counter — Live count of words, characters, lines, sentences, paragraphs and reading time.
Text Formatter & Cleaner — Clean up text: remove blank lines, trim spaces, strip line numbers, sort/shuffle/reverse lines or words, remove punctuation, flip upside down.
Advanced String Tools — Advanced string manipulation: remove accents, extract delimited text, filter lines, calculate similarity, character diff.
Emoji Picker — Browse and click an emoji to copy it to your clipboard.
Nano ID Generator — Generate compact, URL-safe unique IDs with a configurable size and alphabet.
ULID Generator — Generate ULIDs — 128-bit, lexicographically sortable IDs (48-bit time + 80-bit randomness) in Crockford Base32, with an optional monotonic mode.
UUID Validator — Check whether a string is a valid UUID and detect its version and variant.
Random Number Generator — Generate cryptographically-random integers, decimals, primes, or fractions within a range.
Random String Generator — Generate random strings from selectable character sets, or special formats (hex, binary, MAC address).
Random Regex Generator — Generate random strings that match a regular expression pattern. Perfect for test data generation.
ASCII Art Generator — Turn text into a figlet-style banner or convert an image into ASCII art. Copy, download as text or image, and share.
Snowflake ID Generator — Generate and decode Twitter/Discord-style Snowflake IDs with a configurable epoch and bit layout.
CSS Gradient Generator — Design linear or radial gradients with live preview and copy the CSS.
Box Shadow Generator — Visually build a CSS box-shadow and copy the rule.
CSS Grid & Flexbox Generator — Generate CSS Grid templates or Flexbox layouts with a live preview, then copy or download the CSS.
Query Parameter Parser — Break a URL or query string into its individual parameters.
Query String Builder — Assemble a URL-encoded query string from key/value pairs.
robots.txt Generator — Generate a robots.txt with allow/disallow rules, crawl-delay and sitemap.
sitemap.xml Generator — Turn a list of URLs into a valid XML sitemap.
.gitignore Generator — Combine common .gitignore presets for languages, OSes and editors.
Dockerfile Generator — Scaffold a Dockerfile for many stacks with multi-stage builds, env vars, ports, a non-root user and healthcheck.
.htaccess Generator — Generate common Apache .htaccess rules (HTTPS, www, caching, compression).
Server Config Generator — Generate nginx, Apache or Tomcat configs for HTTPS, reverse proxy, load balancing, API gateway, caching and rate limiting.
XML Beautifier / Minifier — Pretty-print, minify, validate XML. Convert to JSON or CSV.
Cron Expression Parser — Translate a cron expression into a plain-English schedule.
Cron Expression Generator — Build a cron expression from simple schedule fields with a live description.
Regex Generator — Pick a common validation pattern and test it against sample text.
CIDR Calculator — Expand an IPv4 CIDR block into network, broadcast, host range and mask.
Subnet Calculator — Enter an IP and a subnet mask (dotted or prefix) to compute the subnet details.
IP Address Converter — Convert IPv4 addresses to and from decimal, hexadecimal, octal, and binary formats.
Punycode Converter — Convert internationalized domain names (IDN) to and from Punycode (xn--) ASCII form.
CSP Generator & Evaluator — Build a Content-Security-Policy from directives and lint any pasted CSP for common weaknesses.
Kubernetes Manifest Generator — Generate a Kubernetes Deployment + Service manifest (image, replicas, ports, env vars) as YAML.
Docker Compose Generator — Build a docker-compose.yml with a primary service plus optional Postgres, MySQL, Redis or Mongo add-ons.
Terraform (AWS) Generator — Generate Terraform HCL for common AWS resources: EC2 instance, S3 bucket or security group.
GitHub Actions Generator — Generate a CI workflow (.github/workflows/ci.yml) for Node, Python, Go, Java or Rust with push/PR triggers.
AWS IAM Policy Generator — Generate AWS IAM policy JSON documents with common actions for S3, EC2, Lambda, DynamoDB, and more.
GitLab CI Generator — Generate .gitlab-ci.yml pipeline configurations for Node.js, Python, Docker, Terraform, and Go projects.
Nginx Config Generator — Generate production-ready Nginx server blocks for reverse proxy, SPA, or static sites with SSL, gzip, and security headers.
SSL/TLS Certificate Decoder — Decode PEM-encoded X.509 certificates — view subject, issuer, validity, SAN, and expiration status.
Helm Chart Generator — Generate Kubernetes Helm chart scaffolding (Chart.yaml, values.yaml, deployment template) with configurable options.
Dockerfile Linter — Lint Dockerfiles offline — checks for best practices like pinned tags, apt cleanup, COPY vs ADD, exec-form CMD, and more.
Terraform Backend Config — Generate Terraform backend configuration for S3, GCS, Azure, Consul, or local state storage with provider setup.
Kubernetes Policy Checker — Analyze Kubernetes YAML offline for risky security settings, mutable images, missing resources, and production-readiness gaps.
Terraform Static Analyzer — Scan Terraform HCL offline for risky AWS patterns such as public admin ingress, unencrypted storage, missing provider pins, and static credentials.
IAM Policy Risk Analyzer — Review AWS IAM policy JSON offline for wildcard permissions, broad resources, escalation-sensitive actions, and risky trust patterns.
Architecture Diagram Generator — Create Mermaid architecture diagrams offline from service and dependency lists for system design, DevOps handoffs, and runbooks.
Incident Runbook Builder — Generate practical incident response runbooks offline with triage, diagnosis, rollback, communication, validation, and follow-up sections.
SLO Error Budget Calculator — Calculate availability, allowed downtime, error budget consumption, remaining budget, and burn rate for SRE and operations planning.
Image Resizer & Compressor — Crop, resize an image to exact pixel dimensions and re-encode it at a chosen quality to shrink the file size.
Image Cropper — Crop an image with a draggable, resizable selection box. Move it, drag any of the 8 handles, and lock to a fixed aspect ratio or crop freely.
SVG Viewer — Paste SVG markup to preview it live and export it as a data URI or PNG.
Barcode Generator — Generate a Code 128 barcode from text and export it as PNG.
Favicon Generator — Create favicon PNGs from a letter or emoji with custom colors, in every common size.
Fake Data Generator — Generate mock people or products (JSON/XML/CSV) or placeholder images (PNG/JPG/WEBP/GIF) for prototyping.
SQLite Viewer — Open a .sqlite/.db file in the browser, browse tables and run SQL — fully client-side.
Clipboard History — The last 10 things you copied from any tool. Click to copy again.
HTTP Status Codes — Searchable reference of HTTP response status codes with their names and meanings.
Keyboard Event Tester — Inspect key events (key, code, keyCode, modifiers) and browse the ASCII chart with code↔character conversion.
Developer Calculator — Evaluate math expressions with functions (sqrt, sin, cos, log), constants (pi, e), operators (^, %, /), and bitwise operations (and, or, xor, not, shl, shr).
OpenAPI / Swagger Viewer — Browse an OpenAPI/Swagger document's endpoints and schemas in a readable list — paste JSON or YAML, entirely offline.
OpenAPI to cURL Inspector — Convert OpenAPI/Swagger JSON operations into ready-to-run cURL request starters — a lightweight inspector, not a full spec browser.
JSON & HAR Secret Redactor — Redact likely secrets, authorization headers, and email addresses locally before sharing data.
SVG Optimizer & Inspector — Minify SVG markup locally and flag common preview and accessibility gaps.
Web Manifest Validator — Validate a PWA web manifest locally and inspect essential install metadata.
CSS Specificity Calculator — Compare CSS selectors locally and see the cascade specificity tuple.
Cookie Parser & Set-Cookie Builder — Parse Cookie and Set-Cookie values, then build a standards-friendly response header locally.
Unicode Security Inspector — Find invisible Unicode, bidi controls, mixed scripts, and common confusable characters locally.
Regex Extractor — Extract every regex match and capture group with locations, then export JSON or CSV locally.
Cron Expression Explainer — Explain five-field cron schedules and preview the next 10 runs in a selected timezone.
CSS clamp() Fluid Scale Generator — Generate a responsive CSS clamp() value from minimum and maximum viewport and size targets.
Unit Converter — Convert between units of length, weight, temperature, area, volume, speed, time, data size, and pressure.
JSONPath Query — Query JSON data using JSONPath expressions ($, dot notation, arrays, wildcards, recursive descent).
HTML ↔ Markdown Converter — Convert HTML to Markdown and Markdown to HTML. Handles headings, lists, tables, links, images, and code blocks.
HAR File Analyzer — Inspect a browser HAR capture locally: slow requests, failures, domains, and transfer size.
.env Parser & Converter — Validate environment variables locally and convert .env entries to JSON or Docker Compose YAML.
JSON Schema Validator — Validate JSON locally against a practical JSON Schema subset and see precise field-level errors.
HTTP Header Analyzer — Parse HTTP headers locally and identify caching, CORS, cookie, and security-header concerns.
Cheat Sheets — Instant-search reference cards for git, docker, kubectl, terraform, vim, bash, and regex. Click any command to copy.
Kubernetes YAML Generator — GUI wizard to generate production-ready Kubernetes manifests: Deployment, Service, Ingress, ConfigMap, Secret, PVC, HPA.
Markdown Writer — Write markdown with a quick-action toolbar. Preview as rendered HTML, copy or download in multiple formats.
API Tester — Lightweight REST, GraphQL & WebSocket client with auth, body types, query params, and request history.
JSON to TypeScript — Convert JSON objects to TypeScript interfaces. Handles nested objects, arrays, and optional/null fields.
CSS Animation Generator — Create CSS animations with live preview. Adjust timing, pick presets, upload an image to test. Copy the generated CSS.
Image ↔ Base64 — Convert images to Base64 data URIs, or paste a data URI to preview and download the image. Max 2MB.
HTML Table Generator — Visual table builder — set rows and columns, fill in data, generate clean HTML table code.
Credit Card Validator — Validate card numbers using the Luhn algorithm. Identifies card type (Visa, Mastercard, Amex, Discover, etc.).