#4466EEBase color#5775F010%#6985F120%#7C94F330%#8FA3F540%#A2B3F750%#B4C2F860%#C7D1FA70%#DAE0FC80%#ECF0FD90%#FFFFFF100%#4466EEBase color#3D5CD610%#3652BE20%#3047A730%#293D8F40%#22337750%#1B295F60%#141F4770%#0E143080%#070A1890%#000000100%#4466EEBase color#4A69E310%#506BD820%#566ECD30%#5C70C240%#6273B750%#6876AC60%#6E78A170%#747B9680%#7A7D8B90%#808080100%Color shades生成器采用一种基本颜色,并构建一个更浅和更深版本的单色尺度,从#4466EE等单个输入中,它产生一排朝白色迈进的色调,一排朝黑色迈进的色调,一排朝灰色迈进的色调。每个色谱都是真正的颜色,您可以复制为HEX,RGB或HSL,并直接放入CSS,设计文件或主题配置中。
3个音阶来自色彩理论中使用的经典定义,色调是基色混合白色,在保持相同色调的同时提高了它的亮度,色调是基色混合黑色,使它变暗,色调是基色混合灰色,降低了它的强度,并给出了一个静音的,更精致的颜色版本,从一个输入中拥有所有三个,就是让你构建一个连贯的调色板:一个按钮及其悬停状态,一组图表系列,或者一个界面的明暗表面,都源自单一品牌颜色。
Generator 完全在你的浏览器中运行,你输入的颜色被解析,比例尺是用客户端 JavaScript 计算的,所以什么都没有上传,没有账号,你的工作也从来没有被跟踪,它接受 HEX,rgb(),hsl(),和常见的 CSS 颜色名称,让你设置每个比例尺包含多少步,并立即更新每个样本,一旦页面加载了它,它就会离线工作。
在任何常见语法中键入或粘贴颜色:像 #4466EE 这样的 HEX 代码、rgb() 或 hsl() 值或 CSS 颜色名称(例如 teal)。
选择每个音阶应包含多少种变化。更多的步骤给出了从基部到白色、黑色或灰色的更细梯度。
该工具并排显示三个比例,每个样本都标有其 HEX 值和朝向目标颜色混合的百分比。
单击任意样本来复制其值。在 HEX、RGB 和 HSL 之间切换复制格式以匹配项目期望的语法。
一种基色同时产生三种完整的音阶:浅色、深色和向灰色的柔和色调。
每个样本都有 HEX、RGB 和 HSL 版本,因此您可以将其直接粘贴到 CSS、设计工具或主题文件中。
2到20步设置为每个比例,以控制基色和白色,黑色或灰色之间的梯度有多细。
接受 3 位和 6 位 HEX、rgb() 和 hsl() 值以及常见的 CSS 颜色名称,所有这些都标准化为相同的样本。
Check the contrast ratio between a text color and its background against WCAG 2.2 AA and AAA thresholds, with a live preview and one-click accessible-color suggestions.
Convert color codes between HEX, RGB, HSL, HWB, and CMYK instantly
Generate harmonious color palettes from any base color - shades and tints, complementary, analogous, triadic, and monochromatic - with HEX, RGB, and HSL values you can copy.
Pick colors and convert between HEX, RGB, and HSL formats
0 comments
No comments yet. Be the first to share your thoughts!