Encoding and decoding operations are fundamental to web development, API integration, and security work. Whether you're debugging a JWT token, embedding images as Base64 data URLs, handling URL-encoded query parameters, or inspecting SSL certificates, understanding these transformations is essential.

This guide covers the encoding and decoding tools developers use daily — with practical examples showing when and how to apply each one.

Base64 Text Encoding & Decoding

Base64 is a binary-to-text encoding scheme that represents binary data using 64 ASCII characters. It's used whenever binary data needs to be transmitted over text-based protocols.

How Base64 Works

Base64 takes 3 bytes (24 bits) of input and encodes them as 4 ASCII characters. This results in ~33% size increase but guarantees the data survives text-based transmission.

# Original text
Hello, World!

# Base64 encoded
SGVsbG8sIFdvcmxkIQ==

# The == padding indicates the input wasn't
# a multiple of 3 bytes

Common Base64 Use Cases

• Email attachments — MIME encoding for binary files
• API payloads — Embedding binary data in JSON
• Basic authentication — Authorization: Basic base64(user:pass)
• Data URIs — Inline images in HTML/CSS
• Cryptographic operations — Encoding keys, signatures, hashes

Decoding Base64 in Different Contexts

When debugging, you'll often encounter Base64-encoded data in API responses, log files, or configuration values. The Base64 Text Decoder handles standard Base64 and URL-safe Base64 variants.

# Standard Base64 (uses + and /)
SGVsbG8rV29ybGQv

# URL-safe Base64 (uses - and _)
SGVsbG8tV29ybGRf

# Both decode correctly

Base64 Image Encoding

Converting images to Base64 creates data URLs that can be embedded directly in HTML, CSS, or JSON without separate HTTP requests.

Data URL Format

data:[media-type];base64,[base64-encoded-data]

# Example: PNG image
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA...

# Example: JPEG image
data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEASABIAAD...

When to Use Base64 Images

• Small icons and sprites — Reduces HTTP requests for tiny images
• Email HTML — Inline images that display without external hosting
• Single-file exports — Self-contained HTML documents
• API responses — Returning image data in JSON payloads
• CSS backgrounds — Embedding icons in stylesheets

When NOT to Use Base64 Images

• Large images — 33% size increase hurts performance
• Cacheable assets — Separate files can be browser-cached
• Frequently changing images — Forces full document re-download

The Base64 Image Encoder/Decoder converts between image files and data URLs, supporting PNG, JPEG, GIF, and WebP formats.

JWT Decoding & Inspection

JSON Web Tokens (JWTs) are the standard for stateless authentication in modern web applications. A JWT decoder is essential for debugging authentication flows, inspecting token claims, and verifying expiration times.

JWT Structure

A JWT consists of three Base64URL-encoded parts separated by dots:

header.payload.signature

# Example JWT
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.
eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.
SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c

Decoded JWT Parts

// Header (algorithm & token type)
{
  "alg": "HS256",
  "typ": "JWT"
}

// Payload (claims)
{
  "sub": "1234567890",
  "name": "John Doe",
  "iat": 1516239022,
  "exp": 1516242622
}

// Signature (verification)

Common JWT Claims

• sub — Subject (user ID)
• iat — Issued at (Unix timestamp)
• exp — Expiration time (Unix timestamp)
• nbf — Not before (Unix timestamp)
• iss — Issuer
• aud — Audience

The JWT Encoder/Decoder parses tokens, displays decoded headers and payloads, and converts timestamp claims to human-readable dates.

URL Encoding & Percent Encoding

URLs can only contain a limited set of ASCII characters. Special characters, spaces, and non-ASCII text must be percent-encoded (URL-encoded) before inclusion in URLs.

Percent Encoding Rules

# Space becomes %20 or +
Hello World → Hello%20World

# Special characters
& → %26
= → %3D
? → %3F
/ → %2F
# → %23

# Non-ASCII (UTF-8 bytes)
日本語 → %E6%97%A5%E6%9C%AC%E8%AA%9E

When URL Encoding Is Required

• Query parameters — Values containing special characters
• Form submissions — application/x-www-form-urlencoded
• Path segments — Filenames with spaces or special chars
• OAuth callbacks — Redirect URIs as parameters
• API requests — Search queries, filter values

The URL Encoder/Decoder handles both encoding and decoding, including nested URL-encoded values.

HTML Entity Encoding

HTML encoding converts special characters to their entity representations, preventing XSS vulnerabilities and ensuring correct rendering.

Essential HTML Entities

# Characters that MUST be encoded in HTML content
< → &lt;
> → &gt;
& → &amp;
" → &quot;
' → &#39; or &apos;

# Example: User input containing HTML
<script>alert('xss')</script>
→ &lt;script&gt;alert(&#39;xss&#39;)&lt;/script&gt;

HTML Encoding Use Cases

• User-generated content — Preventing XSS attacks
• Code display — Showing HTML/XML source in web pages
• Attribute values — Safely including quotes in attributes
• Email templates — Encoding special characters for HTML emails

The HTML Text Encoder/Decoder converts between raw text and HTML-safe representations.

Certificate Decoding

SSL/TLS certificates are X.509 documents encoded in PEM or DER format. A certificate decoder reveals the certificate's subject, issuer, validity period, and extensions.

PEM Certificate Format

-----BEGIN CERTIFICATE-----
MIIDXTCCAkWgAwIBAgIJAJC1HiIAZAiUMA0Gcx...
(Base64-encoded DER data)
...Md0aGlzIG
-----END CERTIFICATE-----

Key Certificate Fields

• Subject — Domain/entity the certificate identifies
• Issuer — Certificate Authority (CA) that signed it
• Validity — Not Before and Not After dates
• Serial Number — Unique identifier from the CA
• Public Key — RSA/EC key for TLS handshake
• Extensions — SANs, key usage, constraints

Certificate Debugging Scenarios

• Verifying certificate expiration dates
• Checking Subject Alternative Names (SANs) for multi-domain certs
• Inspecting intermediate certificates in a chain
• Debugging mTLS (mutual TLS) client certificates
• Examining code signing certificates

The Certificate Decoder parses PEM-encoded X.509 certificates and displays all fields in a readable format.

GZip Compression & Decompression

GZip is the standard compression algorithm for HTTP responses, log files, and data archives. Understanding gzip compression helps when debugging network traffic and optimizing payloads.

GZip in HTTP

# Request header indicating gzip support
Accept-Encoding: gzip, deflate, br

# Response header indicating gzip compression
Content-Encoding: gzip

# Original size: 100KB
# Compressed: 15KB (85% reduction for text)

GZip Use Cases

• API response compression — Reducing bandwidth for JSON/XML
• Log file compression — .gz files
• Embedded compressed data — Compressed payloads in messages
• Static asset compression — Pre-compressed JS/CSS files

The GZip Compress/Decompress tool handles text compression and decompression with Base64 encoding for the compressed output.

QR Code Encoding & Decoding

QR codes encode text data in a 2D barcode format readable by cameras. They're used for URLs, WiFi credentials, contact information, and authentication (TOTP).

QR Code Data Types

# URL
https://example.com/page

# WiFi credentials
WIFI:T:WPA;S:NetworkName;P:Password;;

# Contact (vCard)
BEGIN:VCARD
VERSION:3.0
FN:John Doe
TEL:+1234567890
END:VCARD

# TOTP (authenticator apps)
otpauth://totp/Service:user@example.com?secret=JBSWY3DPEHPK3PXP&issuer=Service

QR Code Use Cases

• Mobile deep links — App store or in-app URLs
• Two-factor authentication — TOTP setup codes
• Event tickets — Scannable ticket identifiers
• Payment systems — Payment URLs and identifiers
• WiFi sharing — Quick network credential sharing

The QR Code Encoder/Decoder generates QR codes from text (exportable as SVG) and reads QR codes from images.

Encoding & Decoding Reference

All Encoders & Decoders in DevToys Pro

These tools are part of the Encoders / Decoders collection in DevToys Pro. All encoding and decoding happens in your browser — sensitive data like JWT tokens and certificates never leave your machine.

Open Encoders / Decoders →