CSS 格式化工具
用 Prettier 美化 CSS：每条声明一行、间距统一，可选 2 或 4 个空格或制表符，媒体查询嵌套清晰。在浏览器中运行。
输出
完全在浏览器中运行，您的数据不会被上传。
相关工具
查看全部什么是 CSS 格式化？
CSS 格式化工具使用 Prettier 把压缩过或风格不一致的样式表变成易读的 CSS：每条规则和声明各占一行，冒号和选择器周围的间距统一，嵌套的 @ 规则会缩进。
如何使用 CSS 格式化
- 把 CSS 粘贴到输入框中，或点击 加载示例。
- 选择 缩进。
- 点击 格式化（输入时输出也会更新）。
- 复制或下载格式化后的 CSS。
示例
输入
a{color:red;margin:0 auto} 输出
a {
color: red;
margin: 0 auto;
} 何时使用 CSS 格式化
适合阅读网站上被压缩的 CSS、在审查前统一手写样式表，或为文档格式化 CSS 片段。它不检查属性名或值，需要的话请使用 CSS 验证器。SCSS 或 Less 请在代码美化工具中选择对应语言。
CSS 格式化 的工作原理
样式表由 Prettier 基于 PostCSS 的解析器解析，并按 Prettier 的 CSS 规则输出：冒号后加一个空格，每条声明以分号结尾，选择器列表中的每个选择器单独成行。未闭合的块或其他语法错误会连同行号和列号一起报告。
常见用例
- 展开压缩过的 CSS 以调试线上网站
- 在代码审查前统一格式
- 为博客文章格式化 CSS 片段
- 整理设计工具导出的 CSS
安全提示
所有处理都在你的浏览器本地完成，粘贴的代码不会被上传。
常见问题
会重新排列属性吗？
不会，声明保持原来的顺序。
能格式化 SCSS 或 Less 吗？
请使用代码美化工具，并选择 SCSS 或 Less。
注释会保留吗？
会，注释都会保留。
推荐的下一步
CSS 转义
像 CSS.escape() 一样为 CSS 标识符和选择器转义文本，或用于带引号的 CSS 字符串；也可反转义 \HEX 序列。支持数字、表情符号、# 和 .
日期格式化工具
用 Moment.js、strftime 或 Unicode LDML 模式格式化任意日期，查看 ISO 8601、RFC 2822、HTTP 和 Unix 格式，并解析自定义日期字符串。
HTTP 响应头检测
获取任意公开 URL 的 HTTP 状态和响应头，并检查 HSTS、CSP、X-Frame-Options、nosniff 等安全响应头。
CSS 盒阴影生成器
可视化构建 CSS box-shadow：叠加多层阴影，设置偏移、模糊、扩展、内阴影和 RGBA 不透明度，实时预览并复制简洁的代码。
CSS 渐变生成器
设计线性、径向和锥形 CSS 渐变，支持可拖动色标、角度、重复模式和 OKLCH 插值。实时预览并复制代码。
CSS Flexbox 生成器
可视化设置弹性容器的方向、换行、主轴与交叉轴对齐、间距，以及每个项目的伸缩、顺序和自身对齐，实时显示子项并可复制 CSS。