色阶 50–900 是什么？

仿 Tailwind/Material 的命名色阶：50 最浅、900 最深、500 接近你的底色。做设计系统时用一套色阶能保证同色系深浅统一、语义清晰。

tints / shades / tones 有什么区别？

tint = 底色 + 白（变淡），shade = 底色 + 黑（变暗），tone = 底色 + 灰（降饱和、变柔和）。三者是从一个主色扩展出配色的经典手法。

选底色或填 HEX，下方各行实时生成变体，点任意色块复制 HEX。

不会。全部在浏览器本地计算，不上传、不追踪。

输入一个底色，自动生成 50–900 色阶与 tints / shades / tones 淡暗灰变体，点击即复制。纯前端。

点任意色块复制 HEX

色阶 50–900

淡色 Tints（+白）

暗色 Shades（+黑）

灰调 Tones（+灰）

色阶 50–900：50 最浅、900 最深、500 ≈ 底色，适合做设计系统的统一深浅体系。tint(+白)、shade(+黑)、tone(+灰) 则是从主色扩展配色的经典三招。

同类还有颜色格式转换、中国传统色、CSS 渐变生成器，均纯前端运行、不上传、不追踪。