色阶生成器
从基础色生成明暗色阶。
Generate a full lightness scale (50 to 950, like a design-system color ramp) from a single base color. Copy any HEX value, or export the whole scale as CSS variables — ideal for theming buttons, surfaces and states consistently.
50–950 明度色阶，可直接用于设计系统和 UI 主题。
所有颜色转换均在你的浏览器本地完成 —— 不上传、不存储、不记录。
工作原理
- 1 Choose a base color.
- 2 Read the 50–950 shade scale.
- 3 Copy the HEX you need.
- 4 Export all shades as CSS variables.
常见用例
- Create a color ramp for a design system.
- Pick hover/active states from one color.
- Theme light and dark surfaces consistently.
- Generate Tailwind-style color steps.
常见问题
Is my color data sent anywhere?
No. Every conversion and calculation runs entirely in your browser — nothing is uploaded, stored or logged.
What do the numbers mean?
They're lightness steps (50 = lightest, 950 = darkest) following the convention used by many design systems, so the scale drops straight into UI themes.
How is each shade calculated?
The base color's hue and saturation are kept while lightness is set to each step, so the whole scale shares one consistent hue.
Is it really free?
Yes — free, with no signup, no watermark and no limits.