CSS 压缩工具
用 CSSO 压缩 CSS：删除空白和注释、缩短颜色和值，并安全地合并规则，同时显示节省的字节数。免费，在浏览器中运行。
输出
完全在浏览器中运行，您的数据不会被上传。
相关工具
查看全部什么是 CSS 压缩？
CSS 压缩工具使用结构优化器 CSSO 来压缩样式表。除了删除空白和注释，它还会缩短值（#ff0000 → red，0px → 0）、合并重复规则，并在不会改变结果的前提下删除多余的声明。
如何使用 CSS 压缩
- 把 CSS 粘贴到输入框中。
- 点击 压缩（输入时输出也会更新）。
- 查看体积行了解节省的大小。
- 复制或下载压缩后的 CSS。
示例
输入
a { color: #ff0000; margin: 0px 0px; } /* c */ 输出
a{color:red;margin:0} 何时使用 CSS 压缩
适合小型网站的生产构建、内联的 <style> 代码块，或存放在 CMS 中的 CSS。如果你的构建流程已经使用带 cssnano/lightningcss 的打包工具，请继续使用它。如果许可证要求保留许可注释，请手动加回。
CSS 压缩 的工作原理
首先快速扫描大括号、字符串和注释，并报告不平衡的块及其位置。然后把 CSS 交给启用了重构的 csso.minify：CSSO 把它解析为 AST（css-tree），应用安全的值压缩和规则合并，再输出不含空白的结果。注释会被删除，包括 /*! … */ 这种许可证注释。
常见用例
- 压缩落地页的独立样式表
- 在内联之前缩小关键 CSS
- 压缩存放在数据库或 CMS 中的 CSS
- 对比优化后的体积与原始体积
安全提示
所有处理都在你的浏览器本地完成，粘贴的代码不会被上传。
常见问题
压缩会破坏我的 CSS 吗？
CSSO 只会应用不改变层叠结果的转换，但仍建议始终测试输出。
为什么 #ff0000 变成了 red？
red 更短，而且表示完全相同的颜色。
许可证注释会保留吗？
不会，所有注释都会被删除。如有需要，请手动补回许可证。
推荐的下一步
SVG 优化器
在浏览器中用 SVGO 优化并压缩 SVG 代码。删除编辑器元数据、注释和冗余标记，并通过预览显示节省的体积。
HTTP 响应头检测
获取任意公开 URL 的 HTTP 状态和响应头，并检查 HSTS、CSP、X-Frame-Options、nosniff 等安全响应头。
CSS 盒阴影生成器
可视化构建 CSS box-shadow：叠加多层阴影，设置偏移、模糊、扩展、内阴影和 RGBA 不透明度，实时预览并复制简洁的代码。
CSS 渐变生成器
设计线性、径向和锥形 CSS 渐变，支持可拖动色标、角度、重复模式和 OKLCH 插值。实时预览并复制代码。
CSS Flexbox 生成器
可视化设置弹性容器的方向、换行、主轴与交叉轴对齐、间距，以及每个项目的伸缩、顺序和自身对齐，实时显示子项并可复制 CSS。
CSS Grid 生成器
可视化构建 CSS Grid 布局：grid-template-columns/rows、带校验的命名区域、间距、对齐和每个项目的定位，复制简洁的 CSS。