从样式表中提取 CSS 渐变，可视化预览并一键复制
开发者工具
关于此工具
渐变 CSS 提取器扫描你的 CSS 代码，查找并可视化所有渐变定义。它检测 linear-gradient、radial-gradient、conic-gradient 及其重复变体，为每个渐变显示可视化预览、类型标签和完整 CSS 值。粘贴样式表，点击提取，复制所需渐变——一切在浏览器本地运行。
主要功能
- 从粘贴的 CSS 中检测 linear、radial、conic 和 repeating 渐变
- 可视化预览框展示每个渐变的效果
- 渐变类型标签（linear、radial、conic、repeating）便于快速识别
- 一键复制单个渐变 CSS 值
- 示例 CSS 按钮可立即试用工具
- 状态栏显示找到的渐变数量或错误信息
使用场景
- 审查和编目大型 CSS 代码库中的所有渐变
- 从现有网站样式表中提取渐变灵感
- 调试和验证复杂 CSS 文件中的渐变值
- 从现有项目构建可复用的渐变库
- 快速查看第三方 CSS 框架使用了哪些渐变类型
css
gradient
extractor
常见问题
渐变 CSS 提取器可以检测哪些渐变类型？
工具可以检测 linear-gradient、radial-gradient、conic-gradient 及其重复变体（repeating-linear-gradient、repeating-radial-gradient、repeating-conic-gradient）。
如何从 CSS 中提取渐变？
将 CSS 代码粘贴到输入文本框中，点击提取按钮。工具会扫描代码并显示每个渐变的可视化预览、类型标签和完整 CSS 值。
可以复制单个渐变值吗？
可以，每个提取的渐变旁边都有复制按钮，点击即可将完整的渐变 CSS 值复制到剪贴板，可直接粘贴到样式表中。
示例按钮有什么用？
示例按钮加载一段预写的 CSS 代码片段，包含多种渐变类型（linear、radial、conic 和 repeating-linear），无需提供自己的 CSS 即可快速了解提取器的工作方式。
CSS 代码会发送到服务器吗？
不会，所有渐变提取和解析都在浏览器本地完成，CSS 代码不会上传或传输到任何服务器，样式表完全保密。