# XYZ转HSL转换器

将XYZ颜色值转换为HSL用于屏幕显示

> 标准页面: https://elysiatools.com/zh/tools/xyz-to-hsl-converter

- **分类:** Design

- **关键词:** xyz, hsl, 颜色, 转换器, cie, 屏幕, 色彩空间, 色相, 饱和度, 亮度

## 概述

XYZ转HSL转换器是一款专业的色彩空间转换工具，旨在帮助设计师和开发者将CIE XYZ色彩空间数值精确转换为HSL（色相、饱和度、亮度）格式，以便在屏幕显示和Web开发中更直观地使用颜色。

## 输入项

- **XYZ输入** (textarea): Enter XYZ values, one per line: xyz(41.24,21.26,1.93) xyz(20.18,39.42,35.76) 95.05,100.00,108.88 X:41.24 Y:21.26 Z:1.93
- **输出格式** (select)

## 适用场景

- 需要将基于物理测量的XYZ颜色数据转换为适合数字屏幕显示的HSL格式时。
- 在进行色彩管理或跨设备颜色校准，需要调整颜色参数以匹配Web CSS标准时。
- 处理大量色彩数据，需要统一输出格式以方便前端代码集成时。

## 工作原理

- 在输入框中粘贴或输入XYZ颜色数值，支持多种格式如 xyz(x,y,z) 或直接输入数值。
- 在输出格式选项中选择所需的HSL表现形式，例如标准CSS格式或带标签的文本格式。
- 点击转换按钮，系统将自动计算并即时生成对应的HSL颜色值。

## 使用案例

- 网页设计师将印刷色彩标准（XYZ）转换为Web兼容的HSL颜色。
- 前端开发者快速批量生成符合设计规范的CSS颜色代码。
- 色彩研究人员将实验测得的XYZ数据转化为直观的视觉参数。

## 常见问题

### 什么是XYZ色彩空间？

XYZ色彩空间是由CIE定义的国际标准，代表了人眼可见的所有颜色，常用于色彩科学和设备无关的颜色描述。

### 为什么要将XYZ转换为HSL？

HSL格式更符合人类对颜色的感知（色相、饱和度、亮度），且在CSS和网页设计中更易于直接调用和调整。

### 工具支持批量转换吗？

支持，您可以在输入框中每行输入一个XYZ值，工具将一次性为您转换所有颜色。

### 转换后的HSL值可以直接用于CSS吗？

可以，选择“css”输出格式，即可直接获得符合 CSS 语法（如 hsl(0, 100%, 50%)）的颜色代码。

### 转换过程是否会丢失精度？

转换基于标准的色彩空间数学公式，在计算过程中保持了高精度，确保颜色在屏幕显示时的一致性。

## 相关工具

- [Adobe RGB转CMYK转换器](https://elysiatools.com/zh/tools/adobe-rgb-to-cmyk-converter): 将Adobe RGB颜色值转换为CMYK格式用于印刷，支持alpha通道处理
- [Adobe RGB转HEX转换器](https://elysiatools.com/zh/tools/adobe-rgb-to-hex-converter): 将Adobe RGB颜色值转换为HEX格式用于网页设计
- [Adobe RGB转HSL转换器](https://elysiatools.com/zh/tools/adobe-rgb-to-hsl-converter): 将Adobe RGB颜色值转换为HSL格式用于设计工作
- [Adobe RGB转HSV转换器](https://elysiatools.com/zh/tools/adobe-rgb-to-hsv-converter): 将Adobe RGB颜色值转换为HSV/HSB用于色彩操作
- [Adobe RGB转LAB转换器](https://elysiatools.com/zh/tools/adobe-rgb-to-lab-converter): 将Adobe RGB颜色值转换为LAB色彩空间用于颜色分析，支持alpha通道处理
- [Adobe RGB转LCH转换器](https://elysiatools.com/zh/tools/adobe-rgb-to-lch-converter): 将Adobe RGB颜色值转换为LCH色彩空间用于直观的颜色操作，支持alpha通道处理
- [Adobe RGB转RGB转换器](https://elysiatools.com/zh/tools/adobe-rgb-to-rgb-converter): 将Adobe RGB颜色值转换为sRGB格式用于网页显示
- [Adobe RGB转sRGB转换器](https://elysiatools.com/zh/tools/adobe-rgb-to-srgb-converter): 将Adobe RGB颜色值转换为sRGB格式用于网页显示

## 示例

- [Web Python 图像处理示例](https://elysiatools.com/zh/samples/web-image-processing-python): Web Python 图像处理示例，使用 PIL/Pillow 包括读取、保存、缩放和格式转换
- [XYZ Viewer Samples](https://elysiatools.com/zh/samples/xyz-viewer-samples): A XYZ 3D model sample for in-browser preview
- [Android Java 图像处理示例](https://elysiatools.com/zh/samples/android-image-processing-java): Android Java 图像处理示例，包括图像读取保存、缩放和格式转换
- [Android Kotlin 图像处理示例](https://elysiatools.com/zh/samples/android-image-processing-kotlin): Android Kotlin 图像处理示例，包括图像读取保存、缩放和格式转换

## 相关内容

- [面向网页与印刷的色彩空间转换工具](https://elysiatools.com/zh/hubs/design-convert): 围绕网页到印刷的色彩空间转换整理的一组工具。
- [CSS 效果、配色板与设计 Token 生成工具](https://elysiatools.com/zh/hubs/design-generate): 围绕CSS 视觉效果、配色构建与设计 Token 生成整理的一组工具。
- [网页无障碍审查与可读配色工具](https://elysiatools.com/zh/hubs/web-accessibility-audits): 在一个专题中检查 WCAG 问题、读屏顺序、低对比度区域、色觉缺陷风险和可读配色选择，适合网页与 UI 无障碍工作流。
- [颜色设计与颜色空间转换工具](https://elysiatools.com/zh/hubs/color-design-tools): 在一个专题里比较颜色转换器、调色板生成器、和谐色工具、无障碍检查器和颜色调整工具，适合设计师和开发者。
