🎨 颜色输入
📖 常见问题
什么是CSS明暗主题?
CSS明暗主题是指网页的亮色(light)和暗色(dark)两种配色方案。现代浏览器支持prefers-color-scheme媒体查询，可以根据用户系统偏好自动切换主题。CSS也原生支持light-dark()函数来定义双主题颜色。
如何实现暗色模式?
实现暗色模式有三种方式：1)CSS变量+媒体查询——定义两套颜色变量，用prefers-color-scheme切换；2)CSS light-dark()函数——一行代码定义双主题颜色；3)CSS类切换——通过JS添加/移除dark类来切换。本工具支持生成前两种方案。
颜色转换的原理是什么?
工具将颜色从HSL色彩空间进行转换：亮色转暗色时降低亮度、微调色相；暗色转亮色时提高亮度。同时保持色相和饱和度的一致性，确保两种主题下的颜色在视觉上协调。
数据会上传到服务器吗?
不会。所有颜色转换都在浏览器本地完成，不发送任何数据到服务器。
light-dark()函数的浏览器支持?
light-dark()函数已被Chrome 123+、Firefox 120+、Safari 17.5+支持。对于需要兼容旧浏览器的项目，建议使用CSS变量+媒体查询方案。