Elige colores. Copia el CSS. Listo.
background: linear-gradient(135deg, #6366F1, #EC4899);GradientLab te ayuda a crear hermosos gradientes CSS sin escribir código a mano. Elige dos colores, establece la dirección y previsualiza instantáneamente el resultado. La herramienta soporta tanto gradientes lineales como radiales, permitiéndote cambiar entre ellos con un solo clic. Una vez que estés satisfecho con el aspecto, copia el CSS listo para producción y pégalo directamente en tu hoja de estilos o configuración de Tailwind. Todo funciona localmente en tu navegador, así que tu trabajo permanece privado.
Un gradiente lineal hace la transición entre colores a lo largo de una línea recta en un ángulo específico, ideal para fondos, secciones hero y banners. Un gradiente radial irradia hacia afuera desde un punto central, lo que funciona bien para efectos de foco y elementos de interfaz circulares. GradientLab te permite controlar el ángulo de los gradientes lineales y previsualizar la opción radial en tiempo real, para que puedas comparar ambos estilos antes de decidirte por uno.
¿No sabes por dónde empezar? Explora 12 preajustes de gradientes seleccionados para el diseño web moderno, o presiona el botón Aleatorio para descubrir combinaciones de colores inesperadas. Cada preajuste es completamente editable, así que puedes usarlo como punto de partida y ajustar los colores y el ángulo. Cuando estés listo, el botón de copia con un clic coloca la regla CSS completa en tu portapapeles, incluyendo el color de fondo de respaldo para navegadores antiguos.
¿Necesitas elegir colores exactos primero? Prueba el Selector de colores para encontrar los valores HEX o RGB perfectos. Una vez que tu diseño esté finalizado, enmarca tus capturas de pantalla con la herramienta Screenshot Mockup para presentar tu gradiente en un marco de navegador pulido para portfolios y redes sociales.
Generate a matching favicon using the favicon generator or optimize your exported images with the image compressor.