Whether you're a front-end developer working with API data, a back-end engineer transferring binaries, or an average user needing to convert a piece of text format, Base64 encoding and decoding is a fundamental skill to master. This guide takes a holistic look at Base64 from principle to practice.
Base64 is an encoding method for representing binary data based on 64 printable characters. It converts arbitrary binary data into ASCII strings consisting of letters (A-Z, a-z), numbers (0-9), and "+" and "/". The core purpose of this encoding is to ensure that data is not garbled or lost when passing through text-only transport protocols.
Base64 was originally defined in the MIME (Multipurpose Internet Mail Extensions) protocol (RFC 2045) for secure transmission of binary attachments in email. It is now widely used in embedded data in HTML/CSS, JWT tokens, API authentication, database storage, and many other fields.
Data in computers is essentially binary (0 and 1), but many communication protocols and storage systems only support text characters. If binary data is transmitted directly, some special bytes, such as control characters, may be interpreted as commands by the protocol, resulting in data corruption. Base64 solves this problem once and for all by mapping binary data to a plain text character set.
Base64's encoding process follows a clear three-step conversion rule:
Step 1: Group Read— Break the raw data into groups every 3 bytes (24 bits).
Step 2: Split into 6-bit units— Split the 24 bits of each group into 4 6-bit units.
Step 3: Lookup Table Mapping— Each 6-bit unit has a value range of 0-63, corresponding to one character in the Base64 character table.
Let's look at a concrete example of encoding the string "Man" as Base64:
| characters. | ASCII value | binary |
|---|---|---|
| M | 77 | 01001101 |
| a | 97 | 01100001 |
| n | 110 | 01101110 |
Combined 24 bits: 01001101 01100001 01101110
Split into 4 groups of 6: 010011 | 01 0110 | 0001 01 | 101110
Check the table: 19→ T, 22→ W, 5→ F, 46→ u, the result isTWFu
Base64 populates with the "=" character when the number of bytes in the original data is not a multiple of 3:
| Remaining Numeric Sections | processing mode | EXAMPLE |
|---|---|---|
| 0 | No need to fill | "Man" → TWFu |
| 1 | Make up 2 "=" | "M" → TQ== |
| 2 | Make up 1 "=" | "Ma" → TWE= |
Standard Base64 needs to be adjusted in specific scenarios, so a variety of variants are derived:
| variant | substitution character: | Padding | Application Scenarios |
|---|---|---|---|
| Standard Base64 | + / | Yes | MIME, email, generic scenarios |
| URL Security Base64 | - _ | Optional | URL parameters, JWT token |
| No Fill Base64 | + / | No | Partial API, data URL |
| Base64url (RFC 4648) | - _ | No | Modern Web Standards |
HTTP Basic Authentication Base64 encodes the username and password in the request header after connecting with a colon:
Authorization: Basic dXNlcjpwYXNzd29yZA=="user: password" after decoding.
Small images and icons can be directly embedded in HTML or CSS after Base64 encoding, reducing the number of HTTP requests:
<img src="data:image/png;base64,iVBORw0KGgo..." />The Header and Payload sections of the JSON Web Token use URL-safe Base64 encoding. The JWT is made up of three Base64 strings connected by dots.
When some databases or systems do not support storing binary data directly, you can use Base64 encoding to store it as text, such as storing encryption keys, certificates, etc.
const encoded = btoa('Hello, World!');
console.log(encoded); // SGVsbG8sIFdvcmxkIQ==
const decoded = atob('SGVsbG8sIFdvcmxkIQ==');
console.log(decoded); // Hello, World!import base64 # encoded = base64.b64encode (b 'Hello, World! ') print (encoded) # b 'SGVsbG8sIFdvcmxkIQ = =' # decoded = base64.b64decode (b 'SGVsbG8sIFdvcmxkIQ = = ') print (decoded) # b 'Hello, World!'import java.util.Base64;
String encoded = Base64.getEncoder().encodeToString("Hello".getBytes());
byte[] decoded = Base64.getDecoder().decode(encoded);The Base64 encoded data volume is about 133% of the original data (an increase of about 33%). For large file transfers, this is an overhead to consider.
| Original size | After Base64 encoding | increased by |
|---|---|---|
| 1 KB | 1.33 KB | +333 B |
| 100 KB | 133 KB | +33 KB |
| 1 MB | 1.33 MB | +333 KB |
| 10 MB | 13.3 MB | +3.3 MB |
Base64 encoding does not provide any security. The encoded data can be restored instantaneously. Base64 does not apply in the following scenarios:
Base64 uses 64 characters, 4 characters per 3 bytes, 33% more volume; hexadecimal uses 16 characters, 2 characters per 1 byte, 100% more volume. Base64 is more efficient, but hexadecimal is more intuitive and easy to read, and is often used to display hashes and debug.
Yes, but you need to ensure that Chinese is correctly converted to UTF-8 byte sequences before Base64 encoding. In JavaScript, btoa () does not support direct encoding of Chinese, and you need to convert the string to a UTF-8 byte array first with the help of TextEncoder.
JWTs are often transmitted in the URL (such as query parameters), and the "+" and "/" in standard Base64 have a special meaning in the URL, and "=" is encoded in the URL. These problems are avoided with Base64url (substitute "-" for "+", "_" for "/", remove padding "=").
Base64 encoding itself has distributed the data evenly over 64 characters, which actually reduces the entropy of the data, making the compression effect of traditional compression algorithms (such as gzip) on Base64 data poor. If both encoding and compression are required, the original data should be compressed before Base64 encoding.
For the built-in Base64 implementation of modern programming languages, the encoding of 100MB files is usually completed in 1-3 seconds, and performance is not an issue. However, the encoded 133MB volume may take up more memory. It is recommended to use streaming for large files to avoid one-time loading into memory.
You don't need to install any software to use our Base64 codec directly in your browser. Supports text, URL Safe Mode, Live Preview.
Home© 2026 Risetop Risetop.top — Making Tools Simpler