Elysia Tools
导航
Design
· 最后更新：2025-01-11
将6位HEX代码简化为3位代码（如#FFFFFF到#FFF）
执行
填写表单、运行工具，并在同一页面查看结果。
案例
相关内容
工具使用指南
颜色缩短器是一款高效的开发辅助工具，旨在帮助前端开发者和设计师将冗长的 6 位 HEX 颜色代码快速转换为简洁的 3 位简写格式，从而优化 CSS 代码体积并提升代码可读性。
背景
项目 CSS 文件中存在大量重复的 6 位颜色定义，导致文件体积过大。
问题
需要快速将所有可简写的颜色（如 #FFFFFF, #FF0000）转换为 3 位格式以优化加载速度。
如何使用
将样式表中的颜色列表粘贴到输入框，选择“#FFF (CSS format)”格式并执行转换。
format: css结果
成功将 #FFFFFF 转换为 #FFF，#FF0000 转换为 #F00，显著精简了样式代码。
背景
正在整理一份包含数十种品牌色的设计规范，希望代码部分保持简洁统一。
问题
手动检查哪些颜色可以简写非常繁琐，且容易出错。
如何使用
输入所有品牌色 HEX 代码，开启“显示无法缩短的颜色”选项，快速筛选出可优化的颜色。
includeUnshortenable: true结果
一键获取了所有可简写的颜色列表，并明确了哪些颜色必须保留 6 位格式，提升了文档专业度。
3 位 HEX 代码是 6 位代码的简写形式。当 6 位代码的每对字符相同时（如 #AABBCC），可以简写为 #ABC。
如果 HEX 代码的每对字符不完全相同（例如 #123456），则无法将其压缩为 3 位格式，因为这会改变颜色值。
支持。您可以一次性输入多个 HEX 代码，工具会逐行处理并输出结果。
您可以选择大写、小写、是否包含井号（#）以及 CSS 标准格式等多种输出方式。
不会。缩短后的 3 位代码在浏览器中渲染出的颜色与原 6 位代码完全一致。