跳到主要内容
项目详情

Scale 是一个在线颜色工具,由 Hayk 制作,页面通过一个可调整的 Color 输入和一组颜色参数,帮助用户围绕指定颜色生成深浅变化的配色序列。它不是静态展示单组色板,而是将基色、深色数量、明暗程度、色相角度和饱和度等参数集中在同一界面中,用户可以直接修改数值,观察由深色与浅色组成的结果。页面还提供复制 SVG、复制颜色和随机生成全部参数的操作,适合需要快速调整颜色阶梯、查看色板变化或提取颜色值的场景。

核心功能

基色输入与颜色预览

页面顶部以 Color 作为主要输入区域,并展示当前颜色的十六进制值,同时提供 R、G、B 三个颜色通道字段。当前页面示例颜色为 #1D9A6C,旁边还能看到对应的 RGB 标签区域,用户可以围绕指定基色继续调整配色参数。

深色配色生成

Scale 提供 Dark colors amount、Darkness、Dark colors hue angle 和 Dark colors saturation 四项深色控制。页面示例中深色数量为 4,Darkness 为 50%,色相角度为 -51º,饱和度为 14%。生成结果中包含从 #0A2F51#188977 的深色部分,具体色值会随页面参数变化。

浅色配色生成

浅色部分由 Light colors amount、Lightness、Light colors hue angle 和 Light colors saturation 控制。示例设置为浅色数量 6、Lightness 80%、色相角度 67º、饱和度 20%,结果中可见 #39A96B#56B870#74C67A#99D492#BFE1B0#DEEDCF 等浅色值。

随机生成全部参数

界面提供 Randomize all 操作,可以对整组颜色和相关设置进行随机化。这个入口与当前的颜色预览和参数控制位于同一页面,适合在不固定基色或不想逐项设置时快速查看新的颜色组合。

复制颜色与 SVG

页面提供 Copy SVG 和 Copy colors 两个复制操作。Copy colors 用于复制当前色板中的颜色,Copy SVG 则对应当前配色结果的 SVG 内容,页面同时以多个十六进制色值展示生成结果。

使用方式

Scale 的正文展示为直接操作颜色和参数的网页界面,页面中可编辑颜色相关数值,并通过 Randomize all 生成随机结果。生成后可以使用 Copy colors 或 Copy SVG 复制内容。正文没有提到注册、客户端、浏览器插件、API、命令行、自备模型 Key 或导入功能;页面底部提供 GitHub 项目链接、Gallery 链接以及作者 Hayk 的链接。

适用人群与场景

需要围绕一个基色制作深浅色阶的设计人员,可以通过 Darkness、Lightness、色相角度和饱和度等参数调整色板。需要获取具体十六进制颜色值的用户,可以直接使用页面展示的颜色序列和 Copy colors 操作。需要复制可缩放图形内容的用户,可以使用 Copy SVG;而希望快速浏览不同组合的用户,则可以使用 Randomize all。

基色与 RGB 调整围绕指定 Color 输入查看十六进制值,并提供 R、G、B 颜色通道区域。
深色参数控制支持设置深色数量、明暗程度、色相角度和饱和度。
浅色参数控制支持设置浅色数量、Lightness、色相角度和饱和度。
随机生成配色通过 Randomize all 快速随机化颜色与相关参数。
复制颜色与 SVG提供 Copy colors 和 Copy SVG 操作,用于复制生成的颜色或 SVG 内容。

用户评论 (0)

还没有用户评论

成为第一个分享使用体验的人

查看更多

Scale 截图

官网首页截图

写评论

分享你的使用体验,至少 10 个字。评论可以发多条,打分在右侧卡片单独进行。

还需 10 个字 · 0 / 500