返回首页

CSS压缩器

粘贴CSS后删除多余注释和空白,并可缩短HEX颜色、移除0单位,立即查看节省效果。

编码 正在等待结果
反馈问题

编程浏览器处理

压缩摘要

更小的CSS有助于渲染开始和缓存效率。生产环境仍需在真实浏览器中检查关键布局。

CSS结构检查

CSS结构看起来有效

原始大小

310 B

压缩大小

227 B

节省字节

83 B

节省比例

26.8%

gzip估算

73 B

规则数

2

声明数

10

删除注释

1

源CSS

粘贴需要压缩的CSS。支持普通CSS、媒体查询和CSS变量。

压缩结果

检查结果后复制或下载.min.css文件。

. product-card{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;padding:20px;border:1px solid #eee;border-radius:12px;background:#fff;color:#1f2937}.product-card:hover{border-color:#fc0;transform:translateY(-2px)}

部署前清单

  • 需要署名时请保留许可证注释。
  • SCSS、Less或CSS-in-JS请先编译成CSS。
  • 压缩后检查hover、媒体查询和calc()表达式。

简单压缩提示

本工具用于快速减小体积和审查。复杂PostCSS结果仍建议配合项目构建流程。

如何检查压缩CSS

工具只在浏览器中运行,不上传代码。它会尽量保留字符串和常见表达式,同时减少注释、换行和安全空白。

使用说明

  • 删除普通注释,可保留 /*! ... */ 许可证注释。
  • 减少大括号、冒号、分号和逗号周围空白。
  • 节省比例 = (原始大小 - 压缩大小) / 原始大小 x 100。

常见问题

CSS会上传吗?expand_more

不会。全部处理都在浏览器中完成。

能压缩SCSS吗?expand_more

本工具面向CSS。请先将SCSS、Less或CSS-in-JS编译成CSS。

能保留许可证注释吗?expand_more

可以。开启保留选项后,/*! 开头的注释会保留。

继续浏览

接下来可以试试的工具

继续浏览同类工具和 Gogotem 上人气较高的工具。

查看全部工具 arrow_forward