Generador de Tonos de Color
Genera una escala de tonos desde un color base.
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.
Una escala de luminosidad 50–950 lista para design systems y temas de UI.
Todas las conversiones de color se ejecutan localmente en tu navegador — nada se sube, guarda ni registra.
Cómo funciona
- 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.
Casos de uso comunes
- 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.
Preguntas frecuentes
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.