Generador de gradiente radial
Crea gradientes CSS radiales circulares o elípticos en vivo
도구를 불러오는 중…
🔒 Todo se procesa 100 % en tu navegador. Tus archivos y datos nunca se suben a ningún servidor.
Esta herramienta permite crear un gradiente radial circular o elíptico ajustando la forma, la posición inicial y hasta cinco paradas de color, mostrando el resultado al instante. Es útil para diseñadores y desarrolladores frontend que necesitan código CSS listo para fondos, botones o tarjetas. Todo el procesamiento ocurre en el navegador, sin enviar datos a ningún servidor.
Cómo usar
- Elige la forma: círculo o elipse
- Haz clic en la cuadrícula 3x3 para fijar la posición inicial del gradiente
- Ajusta el color y la posición (%) de cada parada, añadiendo o quitando paradas si lo necesitas
- Revisa la vista previa y copia el código CSS generado
Preguntas frecuentes
- ¿Cuántas paradas de color puedo añadir?
- Puedes usar entre 2 y 5 paradas de color, cada una con su propio color y posición ajustable.
- ¿Cómo uso el CSS generado?
- Pulsa el botón de copiar para obtener un valor radial-gradient listo para la propiedad background.
- ¿Cómo funciona la selección de posición?
- Haz clic en una de las nueve posiciones de la cuadrícula 3x3, como top left, center o bottom right.