# 灰度转换器

将颜色转换为灰度，支持多种转换方法和强度控制

> 标准页面: https://elysiatools.com/zh/tools/color-grayscale-converter

- **分类:** Design

- **关键词:** 颜色, 灰度, 黑白, 转换器, 单色, 去饱和, 灰色, 设计, 界面

## 概述

灰度转换器是一款专业的在线颜色处理工具，能够将任意颜色精确转换为灰度值。它提供多种转换算法和强度控制，帮助设计师、开发者和内容创作者快速获得所需的单色效果。

## 输入项

- **基础颜色** (color): #FF5733
- **转换方法** (select)
- **灰度强度(%)** (range)
- **单通道选择** (select)
- **自定义RGB权重** (textarea): Enter custom weights as JSON format. Example: {"red": 30, "green": 59, "blue": 11}
- **保持原始亮度** (checkbox)
- **批量颜色（可选）** (text): 输入多个颜色，用逗号分隔（例如：#FF0000, #00FF00, #0000FF）
- **包含原始颜色** (checkbox)
- **显示并排对比** (checkbox)

## 适用场景

- 需要为UI界面、图标或插图创建单色或黑白版本时。
- 在打印前预览彩色设计稿的灰度效果，确保对比度和可读性。
- 为设计系统或品牌创建一套基于单一颜色的灰度调色板。

## 工作原理

- 输入一个基础颜色（如HEX值），或选择批量输入多个颜色。
- 从多种转换方法中选择一种，如光度法、平均值法或去饱和法。
- 通过强度滑块精确控制灰度转换的程度，或使用自定义RGB权重进行高级调整。
- 工具即时计算并输出对应的灰度颜色值，支持并排对比查看效果。

## 使用案例

- UI/UX设计师为深色模式或无障碍设计准备单色资源。
- 印刷行业人员预览彩色文档的黑白打印效果。
- 品牌设计师基于主色生成一套协调的灰度辅助色系。

## 常见问题

### 支持哪些灰度转换方法？

支持平均值、光度（加权）、去饱和（HSL）、最大/最小值分解、单通道提取以及自定义RGB权重等多种方法。

### “灰度强度”参数有什么作用？

强度参数控制颜色去饱和的程度。100%为完全灰度，0%则保持原始颜色不变，可用于创建部分去饱和的效果。

### 可以一次转换多个颜色吗？

可以。在“批量颜色”输入框中，用逗号分隔多个颜色值（如 #FF0000, #00FF00），即可一次性获得所有颜色的灰度结果。

### “保持原始亮度”选项是什么意思？

勾选此选项后，转换算法会尝试保持原始颜色在人眼感知上的亮度，使灰度结果更符合视觉习惯。

### 输出结果是什么格式？

结果以可视化HTML形式展示，清晰对比原始颜色与转换后的灰度颜色，并显示对应的HEX色值。

## 相关工具

- [颜色 Token 级联生成器](https://elysiatools.com/zh/tools/color-token-cascade-generator): 输入一个主色 Hex，自动生成主色、辅助色、中性色和语义化设计 token，并输出 CSS 变量与 Style Dictionary JSON
- [ECharts 主题 Token 抽取器](https://elysiatools.com/zh/tools/echarts-theme-token-extractor): 从 ECharts 主题 JSON 抽取设计 token——颜色、数字、字号与字符串——并直接导出到你的设计系统。粘贴一个主题对象（即通过 echarts.init(dom, themeName) 注册的那种），工具遍历每个叶子节点，为每个颜色（可选地将命名色/rgb 规范化为 hex）、间距数字、字号与字符串打标，然后输出干净的 CSS 变量、Tailwind theme.extend 配置、Style Dictionary tokens.json 或 SCSS 变量。在 ECharts 可视化主题与 Figma/CSS/Tailwind 设计 token 之间架桥，无需逐个手抄。
- [Figma Tokens 导出](https://elysiatools.com/zh/tools/figma-tokens-export): 粘贴 Figma / Tokens Studio 变量 JSON，导出为 Tailwind、shadcn CSS 变量、Style Dictionary 或 SCSS。通过类型推断保留颜色、间距与字体 token。
- [图片调色板转设计令牌](https://elysiatools.com/zh/tools/image-to-design-tokens): 从图片中用 k-means 聚类提取主色，导出为 CSS 变量 / SCSS 变量 / Tailwind 配置 / JSON 设计令牌，并自动为每个颜色生成命名色阶
- [象形图生成器](https://elysiatools.com/zh/tools/pictograph-generator): 使用图标/符号创建象形图来表示数量，支持自定义图标、颜色和布局
- [BSON转换器](https://elysiatools.com/zh/tools/bson-converter): 将数据编码/解码为BSON（Binary JSON）格式
- [CSV转JSON转换器](https://elysiatools.com/zh/tools/csv-to-json): 将CSV数据转换为JSON格式，支持自定义解析选项
- [CSV转换器](https://elysiatools.com/zh/tools/csv-transformer): 转换和处理CSV数据，支持列操作、计算和数据类型转换。 操作示例： • 重命名列: \[{"type": "rename", "column": "旧列名", "new_name": "新列名"}\] • 添加计算列: \[{"type": "add_column", "new_column": "总计", "formula": "价格 * 数量"}\] • 删除列: \[{"type": "remove_column", "remove_column": "要删除的列名"}\] • 转换数据类型: \[{"type": "convert_type", "convert_column": "年龄", "target_type": "number"}\] • 计算值: \[{"type": "calculate", "target_column": "总计", "expression": "价格 * 税率 + 运费"}\] • 过滤行: \[{"type": "filter_values", "filter_column": "状态", "operator": "equals", "value": "激活"}\]

## 示例

- [Grafana 高级应用示例](https://elysiatools.com/zh/samples/grafana-samples): 全面的 Grafana 示例，涵盖高级仪表板设计、告警配置、数据源集成和插件开发
- [二维码示例](https://elysiatools.com/zh/samples/qrcode-samples): 用于测试二维码读取和生成工具的示例二维码图像
- [D3.js 数据可视化示例](https://elysiatools.com/zh/samples/d3js-data-visualization): 全面的D3.js数据可视化示例，包括图表、地图、动画和交互式可视化
- [Rome JavaScript 工具链示例](https://elysiatools.com/zh/samples/rome): Rome JavaScript 工具链示例，包括配置、代码检查、格式化、打包和项目管理

## 相关内容

- [JSON 交换与格式翻译工具](https://elysiatools.com/zh/hubs/json-convert): 在一个专题里比较 JSON 与 CSV、YAML、TOML、GraphQL、XML、Markdown、Excel、BSON、EDN 等结构化格式之间的转换工具。
- [JSON 检查、对比与转换工具](https://elysiatools.com/zh/hubs/json-utility): 把 JSON 格式化、差异对比、路径检查、Schema 校验、合并、转换和导出工具集中到一个专题中，适合 API 与数据处理流程。
- [JSON Schema、Mock 数据与 API 夹具生成工具](https://elysiatools.com/zh/hubs/json-generate): 围绕JSON Schema 生成、Mock 负载构建与 API 夹具准备整理的一组工具。
- [JSON 格式化、对比与规范化工具](https://elysiatools.com/zh/hubs/json-format): 在一个专题中比较 JSON 格式化、差异对比、日志审查、配置比较和数据规范化工具，适合需要让 JSON 更易读、更易审查的流程。