Base64 将普通文字或符号转换为特定的字母数字组合。利用此工具，您可以将文本转换为 Base64，或者将看起来像乱码的 Base64 还原为原始文字。
不是！Base64 只是一种防止数据在传输中受损的格式，并不具备保密加密功能。
这是用于补齐长度的填充字符，确保符合计算机的处理格式。
支持，完美兼容各种语言文字和 Emoji。
邮件附件、图片 data URI、JWT 令牌都离不开 Base64。本文说明 Base64 到底做了什么、为什么输出比输入更长，以及什么时候该用、什么时候不该用。
计算机中的一切数据归根结底都是字节。然而很多通道只能安全地传输文本，例如邮件正文、HTTP 头、JSON 文档和 URL。如果把原始图片字节或密文直接塞进这些通道，控制字符和换行可能会破坏数据，中间系统也可能擅自改写内容。
Man → TWFu
Hi → SGk=
한 → 7ZWc
안녕 → 7JWI64WV通过示例讲解 Base64 如何把 3 个字节变成 4 个字符、末尾的 = 是什么意思、Base64URL 有何不同，以及为什么 Base64 不是加密。阅读指南 →
想要自己的版本？把下面的任务提示词粘贴到 AI 聊天中，或将技能文件保存到 AI 编程助手。其中包含我们开发此工具时整理的功能、边界情况和测试用例。
提示词和技能以英文提供，AI 工具在任何语言环境下都能很好地理解。
直接粘贴到 Claude、ChatGPT、Gemini 等 AI 聊天中即可。
You are an experienced full-stack web developer. Build a web tool called "Base64 编码/解码器" that meets the requirements below.
## Goal
Build a two-way converter that encodes text to Base64 and decodes Base64 back to text.
## Core features
- Switch between encode and decode
- UTF-8 handling so non-English text and emoji work
- Choose standard Base64 or Base64URL (-, _)
- Option to keep or omit padding (=)
- Copy-to-clipboard button for the result
## Inputs
- Text or a Base64 string
- Mode (encode/decode), variant (standard/URL), padding on/off
## Outputs
- Converted string
- Byte length of input and output
## Edge cases and handling rules
- Strip spaces and line breaks before decoding
- Restore missing padding so the length is a multiple of 4
- Show an error with the position of any non-Base64 character
- Warn when decoded bytes are not valid UTF-8
## Implementation requirements
- Build it as a single page (HTML, CSS, JavaScript) that runs entirely in the browser, and never send the user's input to a server.
- Make the UI responsive and easy to use on mobile; label every input and keep everything keyboard accessible.
- Add a Copy button for results and show clear, friendly error messages for invalid input.
- Keep the core logic in functions separate from the UI so it can be unit-tested.
## Definition of done (test cases)
- 'Man' → 'TWFu' and 'Hi' → 'SGk='
- '한' → '7ZWc' and decodes back to '한'
- Bytes FB FF give '+/8=' in standard and '-_8=' in URL variant
First outline your implementation plan in at most five lines, then write the complete code, and finally explain how to check the test cases above.在 Claude Code 等 AI 编程助手中保存为 .claude/skills/build-base64-tool/SKILL.md，以后开发或修改此工具时可重复使用。
---
name: build-base64-tool
description: Use when building or changing a Base64 编码/解码器 tool. Build a two-way converter that encodes text to Base64 and decodes Base64 back to text.
---
# Build: Base64 编码/解码器
## Goal
Build a two-way converter that encodes text to Base64 and decodes Base64 back to text.
## Workflow
1. Review the required features, inputs and outputs below and ask about anything missing first.
2. Implement the core logic as pure functions separate from the UI.
3. Check the logic against the test cases in the verification list.
4. Build a responsive UI with an input form, a result area and a Copy button.
5. Reproduce each edge case listed under Rules and refine the error messages.
## Core features
- Switch between encode and decode
- UTF-8 handling so non-English text and emoji work
- Choose standard Base64 or Base64URL (-, _)
- Option to keep or omit padding (=)
- Copy-to-clipboard button for the result
## Inputs
- Text or a Base64 string
- Mode (encode/decode), variant (standard/URL), padding on/off
## Outputs
- Converted string
- Byte length of input and output
## Rules
- Strip spaces and line breaks before decoding
- Restore missing padding so the length is a multiple of 4
- Show an error with the position of any non-Base64 character
- Warn when decoded bytes are not valid UTF-8
- Build it as a single page (HTML, CSS, JavaScript) that runs entirely in the browser, and never send the user's input to a server.
## Verification
- [ ] 'Man' → 'TWFu' and 'Hi' → 'SGk='
- [ ] '한' → '7ZWc' and decodes back to '한'
- [ ] Bytes FB FF give '+/8=' in standard and '-_8=' in URL variant