边做边查基于真实工具的操作指南
人人都遇到过的 7 种 JSON 校验错误（附一行修复法）JSON 校验失败 90% 落在这 7 种：中文引号、尾随逗号、单引号、注释、裸键、真实换行、非法数字——每种附一行修复，另加报错对照表、BOM 隐形杀手与「校验通过 ≠ 数据正确」的 schema 底线。
HTTP 状态码实战：真正常用的那些码，以及每个码背后的决策状态码不用背全表：记住分类口诀和十来个高频码，再看每个码背后的设计决策——401 还是 403、400 还是 422、301/302/307/308 怎么选、为什么「全部返回 200」是反模式。
贪婪、懒惰与灾难回溯：解释大多数正则 Bug 的三种行为正则匹配多了、匹配少了、偶尔永远跑不完——三种症状对应贪婪、懒惰与灾难回溯。讲清回溯怎么发生、如何一眼认出危险写法、以及三条上线前的自查清单。
Base64 的六个坑：中文乱码、加号变空格与 data URIBase64 本身只是查表替换，坑全在边界上：中文要先过 UTF-8、URL 里加号会变空格、atob 动不动报错、图片转 data URI 会膨胀三分之一——六个高频场景逐一讲清修法。
时间戳 10 位与 13 位：秒、毫秒与差 8 小时的真相10 位是秒、13 位是毫秒，混用就差一千倍；「差 8 小时」不是时间戳错了，是 UTC 与本地时区的展示错位。一篇讲清互转换算、各语言取值写法对照和存储选型。
UUID、ULID 与雪花 ID：数据库主键到底怎么选自增 ID 泄露量级、随机 UUID 打散索引、ULID 与雪花有序但各有代价——一张对比表加一个决策框架，把「主键怎么选」从玄学变成三道题。
JWT 速查手册：结构、声明与几个安全误区JWT 是「可验签的 JSON」而不是加密数据：三段结构怎么读、常用注册声明有哪些、HS256 与 RS256 怎么选、alg=none 与 localStorage 两个高频误区——一篇手册全部对齐。
中文乱码是怎么来的：看懂长相就能修「锟斤拷」是替换字符连环套，「æˆ‘」是 UTF-8 被 Latin-1 误读，「????」是写入时就丢了——乱码的长相对应固定的编码错位。一张长相速查表加三层排查法，多数乱码十分钟内可修。
SQL 注入怎么防：参数化查询、ORM 边界与五个仍然高危的写法根治手段只有参数化查询这一条。讲清单引号为什么会闭合、WHERE 后拼接与 ORDER BY 的本质区别、LIKE 通配符和数字类型的坑，以及 ORM 里哪些接口其实拼了字符串——附「症状 → 成因 → 修法」对照表和上线前自查清单。
CORS 报错怎么排查：从「预检过了还是失败」到一行响应头修好控制台那句 CORS policy 说的不是「服务器拒绝了你」，而是「服务器少回了一个响应头」。按症状反查：为什么 Access-Control-Allow-Origin: * 配了还失败、withCredentials 为什么不让用通配符、预检 OPTIONS 返回 200 但实际请求仍被拦、Vary: Origin 缺了导致缓存串味。
XSS 转义怎么做：别再手动 replace 尖括号，四个上下文各有各的规则记不住 < 不是问题，问题是不知道自己在哪个上下文里输出。HTML 正文、属性值、JavaScript 字符串、URL 四套规则各不通用：正文用 textContent，属性要加引号再转义引号，脚本里要转义斜杠和引号，URL 要做协议白名单。附上下文对照表与一份最小可用 CSP。
URL 特殊字符怎么编码：&、+、%、# 各走哪条路，一条规则说清参数莫名被截断、多出一个 key、加号变空格、中文变乱码、签名怎么都对不上——五个症状都源于「该用哪条编码路径」没分清。给出三条规则：哪些字符必须编码、encodeURI / encodeURIComponent / URLSearchParams 各自的分工、以及二次编码是在哪一层被叠加进去的。
图片格式怎么选：WebP、AVIF、SVG、JPEG 各自的取舍和转换时机格式选择不是「谁更先进」，而是「谁来解码」。给出一张真实对照表（体积、是否无损、透明、动画、兼容性），讲清 WebP 为什么能当默认项、AVIF 更大的收益要付出哪三个代价、JPEG 在哪些场景仍然是对的、SVG 什么时候值得退回位图，以及一张图「缩放 → 转格式 → 压缩」的正确顺序。
文件上传多大合适：体积、格式与限制一次说清「文件太大」不是一句提示能解决的。梳理真实存在的几档体积限制（1MB / 2MB / 5MB / 10MB 各适合什么场景）、Base64 为什么会涨三分之一、格式白名单怎么设计才不给后端留坑、图片先压到目标大小的顺序，以及批量上传时最常翻车的三个细节。
PDF 合并、拆分、加密与体积：一套能落地的处理顺序先弄清 PDF 为什么大，再按「合并 → 拆分 → 压缩 → 加密 → 导出」的顺序动手。讲清合并时页序和书签的处理、拆分按页码还是按书签、加密的真实能力边界（不是所有 PDF 都能加密）、扫描件压缩为什么常压不动，以及什么时候该停下来说「别压了」。
CSV 打开是乱码：编码判断、公式注入与导入 Excel 的完整排查CSV 乱码的根因只有一个——写文件和读文件用了不同编码。本文给一张「乱码症状反查真实编码」的对照表、Excel 导入的分隔符与列类型设置、以及公式注入（= + - @ 开头）的两种堵法，按顺序走一遍基本都能定位。
Cron 表达式 5 位还是 6 位：从入门到排错的完整对照同一个 */5 写法在 Linux 上是每 5 分钟、在 Java 里是每 5 秒——差别只在那一位可选的秒字段。本文讲清 5 位与 6 位两种方言的字段含义、四个容易写错的取值范围、@daily 这类简写，以及「任务不跑」时按什么顺序查。
SQL 索引与 EXPLAIN 入门：慢查询从哪看、索引建在哪最有用索引不是越多越好，加错索引比不加更慢。本文讲清 B+ 树索引为什么能加速、等值与范围查询的差别、联合索引的列序规则（最左前缀）、什么情况下索引会失效，以及用 EXPLAIN 的 type / rows / Extra 三列判断一条慢查询该优化什么。
文本、JSON、Markdown 差异对比：三类工具怎么选、结果怎么读同样是「比对两份文件」，文本要看行级增删、JSON 要按 key 对齐并把数组顺序影响降下来、Markdown 要按表格和标题结构看。选错工具的典型症状是：JSON 对比满屏都是改，因为它把数组重排当成了全部变化。
Git 误删文件怎么恢复：reset --soft 和 --mixed 差在哪结论先行：进过一次提交的东西都能靠 reflog 捞回来，只在工作区、从未 add 过的改动 Git 没有任何记录。本文按「误改工作区 / 误 add / 误 commit / 已 push」四种场景给出命令对照、reflog 抢救步骤，以及 reset --soft、--mixed、--hard 分别动到哪一层。
Linux 管道与重定向：grep 过滤日志的常见用法和六个坑管道就是「把左边命令的 stdout 接到右边命令的 stdin」，一句话讲清 |、>、2>&1 的真实语义。本文给出从日志里筛出目标行的三条命令链、grep 参数速查表，以及 grep 配管道最常踩的六个坑：stdin 被占用、SIGPIPE、xargs 与空格、2>&1 顺序、sort 吃内存和 sudo 的位置。
Address already in use 怎么解决：端口占用与进程排查顺序启动报 EADDRINUSE / Address already in use:8025，九成是上一个进程没退干净。本文按平台给出定位占用者的命令（lsof、ss、netstat -ano、tasklist）、kill 的正确顺序、kill -9 之后端口仍被占的 TIME_WAIT 原因，以及三个「不是端口问题」的假象。
chmod 755 和 644 的真实含义：权限位、目录 x 与 umaskPermission denied 的根因不止「权限不够」：755 是 rwxr-xr-x，644 是 rw-r--r--，目录没有 x 就进不去、文件没有 x 就不能执行，新文件的权限还受 umask 二次裁剪。本文给出数字到 rwx 的换算表、常见权限的适用场景，以及 chmod -R 777 为什么危险。
#999999 放在白底上为什么看不清？对比度怎么改到 4.5:1设计稿挑了一档灰做次要文字，肉眼「挺淡」，审计却判不过 AA——症结在相对亮度不在色号。本文讲清 WCAG 对比度的计算式、AA 与 AAA 四个阈值分别管什么、半透明色叠加后对比度为什么反而更差，以及不改设计稿也能把文字改到 4.5:1 的四步做法。
颜色格式互转：HEX / RGB / HSL / HSV 为什么来回转会变色把 #4f8cff 转成 hsl(219,100%,65%)，再用同一套公式转回来得到的是 #4d8bff——差三个色阶，不是公式写错，而是 8 位量化加四舍五入。本文给出四种格式的取值边界、可直接运行的互转函数、九个往返有色差的真实样本，以及「同一个色值在不同屏幕上不一样」的六个真实原因。
Markdown 转 HTML 粘进公众号：样式丢失、图片裂开与表格错位怎么修Markdown 转出的 HTML 一贴进公众号编辑器就变形：标题没层级、代码块塌成一行、外链图片全裂、表格串行。这四类症状各有具体成因——编辑器只认内联样式、图片要走 base64 或图床、表格先用对齐工具生成对齐标记，以及从网页反向抓回干净 Markdown 的完整流程。
Mermaid 渲染报错怎么排查：Parse error、空白字符与 flowchart 迁移粘进渲染器一片空白，日志只给一行 Parse error on line 7。八成原因不在图本身，而在节点文本里的中文括号与全角冒号、零宽空格、以及 graph 与 flowchart 的语法差异。本文给出最小可用模板、时序图五种常见错法、按报错信息反查病灶的对照表，以及一条从最小复现到定位行号的排查顺序。
密码怎么存才安全：加盐哈希、bcrypt / Argon2 与泄露后的补救顺序密码不能明文存，也不能只做一次 SHA-256、更不能用 MD5。讲清加盐到底解决什么、bcrypt 的 cost 怎么定、存量密码如何无感迁移，以及数据库已经泄露后的补救顺序，附算法对照表与能直接跑的 Node 代码。
MD5、SHA-1、SHA-256 怎么选：哈希不是加密，一次说清哈希是单向摘要，没有密钥就解不开；加密有密钥且可逆，Base64 是编码。讲清 MD5 还剩哪些合法用途、HMAC 防的到底是什么、为什么比较哈希要定长比较，以及文件校验最容易踩的换行与编码坑。
二维码扫不出来怎么办：纠错级别、模块尺寸与印刷的硬约束扫不出只有四类原因：模块太小、对比度不足、纠错级别不够、内容超容量。讲清 L/M/Q/H 分别能遮住多少、版本与容量的换算、条码和二维码怎么选，以及批量生成与嵌入页面的实际做法。
HTTPS 证书报错怎么排查：过期、域名不符、链不全浏览器报「你的连接不是私密连接」时，先分清是过期、域名不符还是链不全——三者的排查入口完全不同。给出 openssl s_client 一条命令拿到服务器真实下发的证书、五步排查顺序、链不全的根因与修法，以及指纹比对和换证顺序。
px、rem、em、vw 到底用哪个：CSS 单位选择与换算实战一份能落地的 CSS 单位决策：字号与间距优先 rem、组件内相对缩放才用 em、视口尺寸用 vw、边框阴影用 px；附 px↔rem 换算表、62.5% 方案的利弊、为什么纯 vw 伤害无障碍，以及用 clamp() 做流式缩放的完整写法。
CSS 居中怎么写：4 种方案按场景对号入座，不用再背十种别再背「CSS 居中的 N 种方法」：水平居中一行 text-align 或 margin auto，垂直居中首选 Flex 的 align-items，同时居中两手抓就 justify-content + align-items，绝对定位居中留给必须脱离文档流的浮层。每种方案附完整代码、适用边界与最常见的不生效原因。
Flex 布局十个常见翻车点：为什么它不换行、被压扁、撑不开Flex 十个高频翻车逐一对照：flex-direction 换轴后对齐反转、默认不换行、flex-shrink 把内容压扁、flex-basis 与 width 打架、margin auto 在主轴的魔法、gap 与 margin 的取舍、min-width:auto 撑爆容器——每个坑附最小修复代码。
z-index 写了 9999 还是被盖住：层叠上下文一次讲透z-index 无效的根因从来不是数值不够大，而是层叠上下文：z-index 只在同一个上下文里比较，transform、opacity、filter、position 都会凭空创建新上下文，把你的 9999 关进局部牢笼。本文给出层叠顺序七层图、常见「隐形上下文」清单、以及三步定位法。
Tailwind 上手 30 分钟：原子类思维、常用类名速查与迁移坑面向第一次写 Tailwind 的你：原子类思维的三个转变（不再起 class 名、样式跟着结构走、约束来自设计令牌），高频类名速查表（布局 / 间距 / 字体 / 颜色 / 状态），任意值语法与响应式、状态前缀，以及从手写 CSS 迁移时最容易踩的四个坑。
移动端适配从哪开始：viewport、安全区、1px 边框与流式字号一份按顺序执行的移动端适配清单：viewport meta 三要素、dip 与 DPR 的关系、100vh 在手机上的坑与 svh/dvh 修法、env(safe-area-inset-*) 刘海屏适配、1px 边框的三种实现取舍，以及 clamp() 流式字号让布局在 360–430px 宽度带内自然呼吸。
CSS 样式为什么不生效：特异性权重一次算清，别再堆 !important一份可执行的特异性排查指南：(ID, 类, 元素) 三元组怎么算、:where 归零与 :is 取最大、伪元素计在哪一位、内联样式和 !important 的真实顺序，以及「写了样式却没生效」的完整排查顺序。
白屏与布局跳动：骨架屏什么时候用、怎么做才不像摆设骨架屏的实操指南：它解决的是「布局可预期」而不是「等待变短」；哪些区域值得做骨架、DOM 到灰条/灰块的映射规则、shimmer 与 pulse 动画的取舍、显示时长与闪烁阈值，以及把现有 HTML 一键转成骨架的安全做法。
响应式字号别再堆媒体查询：clamp() 与 Type Scale 一套搞定一套能落地的流式排版方案：clamp(最小, 首选, 最大) 的几何意义、rem+vw 混合公式怎么推导、从 xs 到 4xl 的完整字号阶梯、为什么不能用裸 vw，以及 CSS 变量 / Tailwind / SCSS 三种落地写法。
OKLCH 与广色域：为什么你的颜色在别人的屏幕上不一样一篇讲透现代 CSS 颜色：sRGB 的历史包袱、OKLCH 的 L/C/H 三分量为什么对感知更均匀、display-p3 能多出哪些颜色、@media (color-gamut) 的回落写法、等感知明度色阶怎么做，以及检查颜色是否超出目标色域的完整流程。
分享出去没有卡片图：OG 协议、1200×630 与排查清单把链接分享出去该有的样子：OG 标签的最小集合、各平台的图片尺寸硬约束、为什么图必须是绝对地址、抓取缓存怎么刷新、X/Twitter 与微信的差异，以及一张合规分享图的完整制作流程。
JS 数组去重的 6 种写法：原始值 Set 一行搞定，对象数组按 key 去重要用 Map数组去重最常翻车的场景：对象数组用 Set 去不掉——Set 按引用比较，两个内容相同的对象也不相等。本文给出原始值一行去重、对象数组按 key 去重的 Map 写法、保留首次出现项的 filter 变体，附六种方法决策表与「去不掉」的排查清单。
防抖和节流的区别一次说清：搜索框用防抖、滚动监听用节流（附 10 行手写实现）防抖是「停下来了才执行」，节流是「固定频率执行」——搜索框要防抖，滚动监听要节流。本文给出一眼能懂的手写实现（含立即执行版），并整理最常见的翻车原因：在事件回调里现场创建防抖函数，等于没防抖。
JSON.parse(JSON.stringify) 深拷贝丢什么：undefined、Date、RegExp、循环引用四个坑JSON.parse(JSON.stringify) 会悄悄丢掉 undefined 字段和函数，把 Date 变成字符串、RegExp 变成空对象，遇到循环引用直接抛 TypeError。现代浏览器请直接用 structuredClone，本文逐项对照两种方式的差异并给出选型建议。
前端日期格式化别再拼字符串：toISOString 的时区坑、new Date 解析兼容性与手写 formatDatetoISOString 输出的是 UTC 时间，直接 slice(0,10) 取日期，在北京时间每天早上 8 点前都会退一天。本文讲清 new Date 的解析兼容性坑、秒/毫秒时间戳互转，并给一个支持非法输入兜底的手写 formatDate。
localStorage 五个坑：只存字符串、5MB 配额、隐私模式、跨标签页同步与过期策略localStorage 只能存字符串：对象直接 setItem 进去会变成 '[object Object]'。此外还有 5MB 配额写满抛错、隐私模式不可用、storage 事件本页不触发、数据永不过期四个坑，本文一次讲完并给出带过期时间的读写封装。
Grid 还是 Flex？一张场景决策表 + 混用时最容易踩的 3 个布局坑Grid 和 Flex 不是二选一的竞争关系，而是二维与一维的分工。本文先给一张「什么时候用 Grid、什么时候用 Flex」的场景决策表，再拆解两者混用时最常见的三个布局错误：用 flex 属性控制 grid 子项、justify-content 覆盖 justify-items 的居中错觉、以及 grid-template-columns 与 minmax 不当导致的溢出。每个错误都附一行修复方案与排查思路。
文字超出显示省略号：单行 white-space 写法、多行 line-clamp 与表格单元格失效原因text-overflow: ellipsis 看起来一行代码的事，实际有三种场景、三种写法，还有一堆「写了却不生效」的坑。本文给出单行截断的三件套写法、多行截断的 -webkit-line-clamp 现代方案，重点拆解表格单元格与 Flex/Grid 子项中省略号失效的根本原因（min-width: auto 与 table 布局的宽度算法），每个失效场景都配一行修复。
position: sticky 不生效的 7 个原因：父级 overflow、父容器高度与层叠上下文逐个排查position: sticky 的失效从来不是玄学，而是三个生效前提被打破：父级 overflow 不是 visible、父容器高度不足以产生滚动空间、或元素被 fixed/transform 的祖先带走。本文列出 7 个最常见原因并给出症状对照表与一行修复，附一套从 DevTools 到代码的逐层排查流程，两分钟定位粘住不动的问题。
CSS 变量实战：主题切换、calc 组合、继承回退与媒体查询里的限制CSS 自定义属性远不止「存个颜色」：它能在 :root 与 data-theme 之间实现零 JS 主题切换，能和 calc 组合成设计令牌系统，也有一套值得背下来的继承与回退规则。同时它有明确的能力边界——不能在媒体查询的条件里使用。本文把这些实战模式与限制一次讲清，附可用代码。
宽表格在手机上怎么办：横滑容器、粘性首列与卡片化三种方案取舍与实现数据表格是响应式设计里最难啃的组件之一。本文对比三种主流方案：外层横滑容器（改动最小）、粘性首列（保留表头语义）、移动端卡片化（体验最佳但成本最高），给出取舍决策表与完整实现代码，包括 sticky 首列在表格里的正确写法与卡片化的 data-label 技巧。
fetch 不报错却拿不到数据？404/500 不 reject 的原因与超时重试写法fetch 只有网络层失败才会 reject，404/500 一样走 then，这就是「不报错却拿不到数据」的根源。本文给出 res.ok 检查封装、JSON 安全解析、AbortController 超时中止与指数退避重试的完整可运行代码，附一张五步排查对照表，帮你快速定位问题出在哪一层。
script 的 defer 与 async 区别：为什么头部脚本拿不到 DOM 元素script 默认会阻塞 HTML 解析，这正是头部脚本 getElementById 拿到 null 的原因。本文用一张对照表讲清默认、defer、async 三种加载方式的执行时机差异，给出 DOMContentLoaded 标准写法、动态脚本顺序控制与现在的脚本放置建议。
别再用 scroll 事件监听滚动了：IntersectionObserver 四大高频场景scroll 事件每秒触发几十次，回调里读布局还会强制回流。IntersectionObserver 把可见性判断交给浏览器异步处理，主线程几乎零开销。本文覆盖图片懒加载、曝光埋点、吸顶导航（sentinel 哨兵法）、无限列表四个场景的完整代码与五个常见坑。
input 只能输入数字怎么写：type=number 的坑与 composition 事件处理type="number" 允许输入 e、滚轮会改值、maxlength 失效——它不是为输入校验设计的。本文给出 type="text" + inputmode + input 事件正则过滤的完整方案，重点讲清中文输入法 composition 事件的处理时机，附可直接复制的 bindNumberOnly 实现。
强缓存和协商缓存怎么配：Cache-Control、ETag 与 304 不生效的排查顺序强缓存命中不发请求，协商缓存命中返回 304。拆开每个 Cache-Control 指令的真实语义，给出 304 不生效时的排查顺序与四个高频误判。
LCP、CLS、INP 怎么量怎么修：三个核心指标的阈值、测量 API 与优化优先级LCP 2.5 秒、CLS 0.1、INP 200 毫秒，阈值都按 75% 分位算。拆开 LCP 四阶段、CLS 四来源与 INP 的真实计时范围，附可直接粘贴的采集代码。
require 与 import 混用报错：ESM、CJS 判定规则与 5 条报错逐条修扩展名和最近的 package.json 决定文件是 ESM 还是 CJS，混用报错九成源于此。五条报错原文对应根因与最小修复，附 __dirname 与 require 的替代写法。
^1.2.3 和 ~1.2.3 到底差在哪：版本范围、lockfile 与 ERESOLVE 冲突排查同一个 ^1.2.3，两台机器装出来的版本可能完全不同。把 semver 区间、lockfile 与 peerDependencies 三层机制拆开看，再谈 ERESOLVE 与 overrides，结论才不会正好相反。
SVG 导出后必须删掉的五类垃圾：viewBox、currentColor 与体积优化从 Figma、Sketch、Illustrator 导出的 SVG，一半体积和全部换色能力往往是被导出器自己弄丢的。删对五类内容即可恢复，并说清四种嵌入方式的边界。
字体加载慢导致文字闪一下：font-display、preload 与中文字体子集化的取舍文字先空白后跳动，多半不是字体太大，而是 font-display 和 preload 配错了。五个取值的行为差异，加上中文字体子集化的真实成本。
主线程卡住三秒：Web Worker 的适用边界、通信成本与五个必踩的坑Worker 只解决主线程被长任务占满这一类问题，代价是序列化、调试和构建复杂度。先量出任务耗时是否超过 5ms，再决定要不要把它搬走。
动画为什么会卡：transform/opacity 与 reflow、will-change 的正确用法卡顿通常不是性能不够，而是动错了属性。改 width 会让浏览器从布局阶段重跑，改 transform 只走合成。60fps 下每帧预算只有 16.7ms。
五个安全响应头怎么配：CSP、HSTS、X-Frame-Options 与上线前的自检顺序安全头的价值不在数量，而在顺序。先用 Report-Only 收集违规，再切强制，最后才碰 HSTS；preload 是唯一基本不可撤回的配置。
JSON Schema 校验怎么写：type、required 与 $ref 的四个常见误用多数 JSON Schema 失效不是写得太少，而是写错位置：required 塞进属性、用 nullable 代替 type 数组、oneOf 分支重叠。校验器不会报错，坏数据照过。

全部工具（96）

密码生成器生成密码学安全的随机密码，可自定义长度和字符集
哈希生成器一次计算 SHA-1 / SHA-256 / SHA-384 / SHA-512，支持文本与文件输入、hex / Base64
JWT 解码器解码 JWT Token 的 Header 和 Payload，查看过期时间
Base64 编解码文本 / 文件与 Base64 互转，支持 UTF-8 与 URL-safe 变体，可预览图片
URL 编解码百分号编码和解码 URL 特殊字符
HTML 实体HTML 特殊字符转义与反转义
UUID 生成器生成 UUID v4 / v7，可调大小写、连字符、花括号与 URN 前缀，实时批量
Lorem Ipsum按段落 / 句子 / 单词生成占位文本，数量可调并统计字数
JSON 格式化格式化、压缩、实时校验 JSON，缩进可调，支持转 YAML / SQL
HTML 格式化美化 / 压缩 HTML，缩进可调、内嵌预览
CSS 格式化美化 / 压缩 CSS，实时预览、缩进可调
SQL 格式化格式化 / 压缩 SQL，关键字大小写与缩进可选
颜色转换器HEX / RGB / HSL 颜色格式互转
进制转换二/八/十/十六进制互转
时间戳转换Unix 时间戳与日期互转
大小写转换9 种命名格式并行展示，输入即转换，可逐个复制
正则测试实时测试与替换正则，高亮匹配、匹配列表与捕获组，内置常用表达式
字符统计统计字符数、单词数、行数、字节数
文本去重实时去除重复行，支持忽略大小写、去空行、首尾清理与升 / 降序
二维码生成文本/URL 实时生成二维码，可调尺寸、纠错级别与配色，支持下载与复制 PNG
图片 Base64图片与 Base64 双向互转，自动识别 MIME 与尺寸，支持预览与下载
IP 信息查询本机公网 IP 与地理位置（国家 / 省 / 城市 / 运营商）
XML 格式化XML 美化 / 压缩，语法校验、缩进可调
YAML 转换YAML⇄JSON 互转与格式化，缩进可选
URL 解析拆解 URL 的协议、主机、端口、路径、查询参数与锚点，逐项展示
Cron 解析解析 Cron 表达式各字段含义，并计算未来 5 次执行时间
文本 Diff实时逐行对比两段文本，忽略大小写 / 空白差异，统计增删并导出 unified diff
HTTP 状态码全量 HTTP 状态码速查手册：按类别分组展示、可搜索过滤，一键复制 Markdown / JSON 清单
JSONPath / jq用 JSONPath 表达式实时查询、筛选、提取 JSON 数据，支持递归与通配符、表格 / 纯文本视图与多组示例数据
JSON 转 TS 类型把 JSON 示例一键生成 TypeScript 接口定义，实时合并数组元素、标记可选字段，支持 readonly 与多种示例
乱码修复 / 编码检测识别并修复 UTF-8 与 GBK、Big5、Latin1 等编码互转造成的乱码，给出多个候选结果
正则替换库内置 18 条常用正则，在线匹配高亮、捕获组明细、批量替换及多语言代码导出
WCAG 颜色对比度计算前景与背景色的 WCAG 对比度，判定 AA / AAA 是否达标，并给出修正建议色
文件批量拖入一次拖入多个文件，批量统计、格式化并逐个下载处理结果，文件不会上传
JSON / CSVJSON 与 CSV 双向转换：自动检测方向、可选分隔符、嵌套值序列化并统计行列
Markdown 预览实时分屏预览 Markdown 渲染效果，支持导出 HTML / 下载源码，并统计字数与行数
Token 估算估算 Token 数并对比常见模型成本：区分中英文、显示上下文占用、参考输入/输出费用，支持导入 .txt
Prompt 清洗实时清理提示词：去多余空行 / 缩进 / 零宽字符，统一换行与空格
Markdown 表格把 TSV / CSV（含引号）/ 竖线 / 对齐文本实时转为 Markdown 表格，支持对齐与下载
HTML 转 Markdown实时把 HTML 转为干净 Markdown，链接 / 图片 / 标题 / 列表风格可选，支持参考式链接与 HTML 文件导入
在线剪贴板多栏临时剪贴板，本地保存多条文本，配合分享链接跨设备传输
cURL 转代码粘贴 cURL 命令，一键转为 Python、JavaScript、Go、Java 等语言的等价请求代码
日志速析快速梳理日志：统计错误等级、识别重复报错与高频词、汇总来源 IP，可一键脱敏敏感信息
报错转搜索词实时把报错信息整理成可直接粘贴的搜索词，结构化展示异常、错误码与直达链接
地理坐标互转WGS84 / GCJ-02 / BD-09 三种坐标系经纬度互转，支持国测局与百度坐标偏移转换
代码块转 AI 输入实时把多段代码、日志整理成 AI 友好的 Markdown：自动识别语言、压缩空行、标注各语言块统计
正则转 AI 说明实时把正则拆解为完整语法说明（分组/前瞻/反向引用/量词），样本文本高亮匹配并生成可粘贴给 AI 的提示词
词频统计与去噪实时统计词频与占比条、过滤停用词、去标点重复，导出 CSV 与清洗后文本，更省 Token
Prompt 压缩按可开关的规则压缩提示词：去客套话与冗余修饰、合并中文叠词与重复强调、压缩空白与标点，代码块与行内代码自动豁免不被改坏
提示词版本对比逐行对比两版提示词的增删改，统计 Token 差异与节省比例，按 LCS 对齐不乱序，可导出 unified diff
提示词模板库内置写作、编程、总结、翻译等常用 AI 提示词模板，可搜索、分类筛选、替换占位符并记录最近使用，含占位符/字符统计
图片压缩用 Canvas 重绘 + 质量滑块压缩 JPG/PNG/WebP，可预览体积对比并下载
图片格式转换PNG / JPEG / WebP / AVIF 互转，质量可调，实时预览与体积对比
图片缩放裁剪按宽度 / 长边等比缩放或居中裁剪，支持 PNG / JPEG / WebP 输出与质量调节
PDF 工具箱合并、拆分、压缩、转图片与加水印，全部在浏览器本地完成，无需上传文件
图片压缩到指定大小批量拖入图片并设定目标 KB，自动迭代压缩质量直到达标，显示前后对比，支持逐个或打包下载
SVG 优化实时清理 SVG 冗余属性与空白、压缩数值精度，步骤可开关并预览效果
二维码 / 条形码解码上传或粘贴含码图片，在浏览器本地解码二维码与常见条形码（EAN / Code128 等），图片不离开设备
EXIF 查看与清除本地读取图片 EXIF 元数据（相机型号、拍摄时间、GPS 位置）并一键清除，避免原图泄露隐私
图片隐私打码与水印框选区域打马赛克 / 模糊，或批量添加文字水印，全部本地处理并下载
Markdown 转公众号排版把 Markdown 一键转为带内联样式的富文本，适配微信公众号，可复制粘贴到编辑器
花式字体 / 特殊符号把文本转为花式 Unicode 字体（上下颠倒、加圈、脚本体等）与特殊符号，适合社交分享
本地 TTS 朗读用浏览器内置 Web Speech API 朗读文本，可选语速、音调与声音，零依赖、无需联网
密码强度检测本地规则实时评估密码强度：熵值、字符集覆盖、常见密码黑名单与破解耗时估算
雪花 / ULID / NanoID生成雪花 ID / ULID / NanoID，并反解雪花 ID 的时间戳、数据中心 ID、机器 ID 与序列号
JSON 转 Go / Java / Python / Rust把 JSON 示例一键生成 Go struct / Java POJO / Python dataclass / Rust struct，自动区分整数与浮点、合并数组元素、标记可选字段
随机测试数据生成批量生成姓名、手机号、地址、邮箱、身份证、银行卡等测试数据，身份证与银行卡带真实校验位，可导出 JSON / CSV / SQL
GIF 压缩 & 视频转 GIF本地压缩 GIF（减色、缩放、抽帧）并把 MP4 / WebM 视频转成 GIF，全程浏览器内完成，无需上传也不依赖云端转码
Markdown 转 PDF / 长图把 Markdown 导出为 PDF 或整页长图 PNG：PDF 文字可选中可搜索，长图自动量高拼接，全部在浏览器本地完成
选择器特异性计算实时计算 CSS 选择器特异性三元组并排序，支持 :is / :not / :has / :where 与嵌套语法，解释样式为什么不生效并给出修复建议
骨架屏生成器粘贴 HTML / JSX 实时生成骨架屏：保留盒模型与布局类名，shimmer / pulse 动画可切换，可导出 React / Vue 组件
流式排版 Type Scale生成整套 clamp() 流式字号阶梯（xs → 4xl）：7 种比例、CSS 变量 / Tailwind / SCSS 三种导出、视口滑块实时预览与公式解释
OKLCH 广色域转换任意 CSS 颜色格式互转 OKLCH / OKLAB / P3：色域越界警告与最近 sRGB 替代色、sRGB vs OKLab 渐变插值对比、Tailwind v4 主题片段
OG 分享图生成在浏览器本地渲染 Open Graph 分享图：1200×630 实时预览、8 套主题、多尺寸导出 PNG / JPG，附完整 OG / Twitter Card meta 片段与平台卡片模拟
Favicon 图标生成从图片 / 文字 / Emoji 生成整包网站图标：favicon.ico 多分辨率 + PNG 全家桶 + SVG + PWA maskable + webmanifest，ZIP 一键下载，附极小尺寸放大镜预览
px / rem 换算px、rem、em、% 双向实时换算，基准字号可调，支持整表批量换算并复制
clamp() 流式尺寸输入视口区间与最小最大值，生成 clamp() 流式字号 / 间距 CSS，附 vw 中间值预览
chmod 计算器勾选读写执行实时得到 chmod 数字与 rwx 符号串，支持 setuid / setgid / sticky 与常用预设，双向换算
JSON 对比对比两份 JSON 的增删改，数组按 LCS 对齐不乱位，输出彩色差异视图与 RFC 6902 Patch
条形码生成输入内容生成 CODE128 / EAN-13 / UPC / CODE39 / ITF-14 等条形码，可调宽高与文字，导出 SVG 或 PNG
ZIP 压缩 / 解压拖入多个文件打包成 ZIP 或拖入 ZIP 逐个还原，压缩率可选，全程浏览器内存完成不上传
Mermaid 渲染器粘贴 Mermaid 代码实时渲染流程图、时序图、甘特图，导出 SVG 或高清 PNG，绘图库按需懒加载
CSV + SQL 查询粘贴 CSV 直接跑 SQL：WHERE 筛选、GROUP BY 汇总、ORDER BY 排序，结果可下载为 CSV
常用端口速查常用端口号速查：服务名、传输协议、是否知名端口，按端口或服务名搜索
MIME 类型速查MIME 类型与文件扩展名双向查表：按类型或扩展名搜索，含常用文档、音视频与压缩格式
正则语法速查JS / PCRE / Go 三方言正则语法对照表：命名分组、前瞻后顾、Unicode 类逐一标注支持差异，可一键插入正则测试器
Git 命令速查高频 Git 命令按场景分组：基础、分支、远程、撤销、暂存、标签、排查，可搜索、一键复制完整命令
Linux 命令速查Linux 高频命令按文件、文本、进程、网络、磁盘、权限、压缩、系统分组，带参数说明与示例，可搜索复制
ASCII 码表完整 ASCII 码表：十进制 / 十六进制 / 字符 / 名称对照，含全部控制字符，可按数字或字符搜索、点击复制
Unicode / Emoji 速查输入任意字符查码点、UTF-8 字节与转义写法，或按分类浏览常用 Emoji，点击即复制
中文标点与符号中文标点、序号、单位、箭头与数学符号速查面板：按类分组、可搜索，点击即复制，写作排版不缺字
HTTP 方法与 HeaderHTTP 方法的安全性与幂等性对照，常用请求 / 响应 Header 的作用与示例，与状态码速查组成三件套
音频剪辑拖入音频文件本地解码：设置起止时间裁剪片段、调节音量增益、添加淡入淡出，导出标准 WAV，全程零上传
CSS 生成器可视化生成 box-shadow 多层阴影、圆角、线性/径向渐变、clip-path 裁剪与过渡动画，参数实时预览并复制即用
Tailwind 类名转换Tailwind 原子类与原始 CSS 双向互转：类名转等价 CSS，或粘贴 CSS 反推可用类名，支持任意值语法与 md:/hover: 等变体前缀
CSS 兼容性检查扫描 CSS 找出属性名拼写错误、已废弃写法、缺失厂商前缀与新特性浏览器支持度，逐条给出正确写法与替代方案

网站地图

首页与站点页面

分类

边做边查（指南）

全部工具（96）

松开以自动格式化