DevLab
Encoding

Base64 Encoding Explained

Understand what Base64 is, how it works, when to use it, and when not to.

What is Base64?

Base64 is an encoding scheme that converts binary data into a text representation using only 64 printable ASCII characters: A-Z, a-z, 0-9, +, and /. A 65th character, =, is used for padding.

The name comes from the fact that each Base64 character represents 6 bits of data (2⁶ = 64 possible values).

Why Base64?

Many systems and protocols are designed to handle only text, not arbitrary binary data. Email (MIME), HTTP headers, HTML data URLs, and many APIs are text-based. Base64 provides a way to safely transmit binary data (like images, files, or binary tokens) through these text channels.

Common uses include: embedding images in CSS/HTML, encoding JWT tokens, transmitting binary data in JSON APIs, and storing binary data in databases that don't support binary types.

How it Works

Every 3 bytes (24 bits) of input becomes 4 Base64 characters (4 × 6 bits = 24 bits). This means Base64-encoded data is always about 33% larger than the original binary data.

If the input is not divisible by 3, padding characters (= or ==) are added to make the output length a multiple of 4.

URL-safe Base64

Standard Base64 uses + and /, which have special meanings in URLs. URL-safe Base64 substitutes - for + and _ for /. This variant is used in JWTs and web authentication.

When NOT to Use Base64

Don't use Base64 as encryption — it's just encoding, not security. Anyone can decode it instantly. Don't use it to store passwords. Don't use it to "hide" sensitive data in URLs — the increase in size and false sense of security make it harmful.

Also avoid Base64-encoding data that's already text (like JSON) unless a specific protocol requires it.

Frequently Asked Questions

What is Base64 encoding?

Base64 is a binary-to-text encoding scheme that converts binary data into a string of 64 printable ASCII characters (A-Z, a-z, 0-9, +, /). It is used to safely transmit binary data over text-based protocols like email (MIME) and HTTP.

Is Base64 encryption?

No. Base64 is encoding, not encryption. Anyone can decode a Base64 string instantly without a key. It provides zero security. Never use Base64 to protect passwords, API keys, or sensitive data.

Why does Base64 increase file size?

Base64 encodes every 3 bytes of binary data into 4 ASCII characters, resulting in roughly a 33% size increase. This is the trade-off for making binary data safe to embed in text formats like JSON, HTML, and email.

When should I use Base64?

Use Base64 when you need to embed binary data (images, files, certificates) inside a text-based format. Common uses include data URIs in HTML/CSS, email attachments (MIME), and transmitting binary payloads in JSON APIs.

Practice with these tools

More Learning Topics

RegexRegex Basics: A Complete Beginner's GuideRegexRegex Special Characters: Complete ReferenceRegexRegex Groups and Captures ExplainedRegexRegex Quantifiers: Complete GuideCSSCSS Selectors: The Complete GuideCSSCSS Specificity: Why Your Styles Aren't ApplyingJSONJSONPath Syntax: Query JSON Like XPathTimeUnix Timestamps ExplainedEncodingJWT Structure and How It WorksEncodingJWT vs Session Tokens: Which Should You Use?EncodingJWT Refresh Tokens ExplainedCryptoHash Functions Explained: MD5, SHA-256, and When to Use EachEncodingURL Encoding Explained: What %20 Actually MeansJSONJSON Schema Explained: Validate Your JSON DataJSONJSON vs YAML: Which Should You Use?JSONJSON.stringify and JSON.parse: Edge Cases You Should KnowRegexRegex Lookahead and Lookbehind: Match Without ConsumingRegexRegex for Email Validation: The Right ApproachCSSThe CSS Box Model: margin, padding, border, and contentCSSFlexbox vs CSS Grid: When to Use EachCSSCSS Custom Properties (Variables) ExplainedTimeISO 8601 Explained: The Right Way to Format DatesTimeUnix Timestamps vs ISO 8601: Which to Use in Your API?EncodingUTF-8 Explained: How Computers Store TextTextCORS Explained: Why Your API Call is BlockedTextHTTP Status Codes: A Practical Developer GuideRegexNamed Capture Groups in Regex: Clean ExtractionsColorsColor Spaces Explained: RGB, HSL, HEX, and BeyondColorsColor Contrast for Developers: WCAG Rules and How to CheckNumbersNumber Bases Explained: Binary, Octal, Decimal, and HexNumbersBitwise Operations for Web DevelopersHTMLHTML Semantic Elements: A Complete ReferenceTextText Encoding for Developers: ASCII, UTF-8, and UnicodeRegexWhat is Regex? Complete Guide for DevelopersJSONJSON Format Explained: Structure, Syntax, and Common ErrorsEncodingHow JWT Works: Header, Payload, Signature DecodedHTMLHow to Convert Any Website to Markdown (for LLMs, RAG & Docs)TextPreparing Website Content for RAG: Clean Markdown Pipelines