Saltar al contenido
🌈

Generador de Gradientes Aleatorios

Genera gradientes CSS aleatorios — lineales, radiales, cónicos. Combinaciones de colores armónicas, código CSS listo para pegar. En tu navegador.

background: linear-gradient(45deg, #000, #fff);
bg-gradient-to-br from-[#000] to-[#fff]
Historial

¿Cómo funciona el generador de gradientes?

Esta herramienta elige 2-3 colores usando teoría del color armónica (relaciones análogas, complementarias o triádicas) con rotaciones de tono HSL. Los ángulos o posiciones aleatorios se eligen con crypto.getRandomValues(). La salida se renderiza como una vista previa en vivo junto al código CSS listo para pegar.

Tipos de gradiente

  • Lineal — los colores se mezclan a lo largo de una línea recta con un ángulo configurable.
  • Radial — los colores irradian desde un punto central.
  • Cónico — los colores giran alrededor de un centro, como una rueda de color.

Usos comunes

  • Hero sections — fondos llamativos para páginas de aterrizaje.
  • Tarjetas y botones — acentos UI modernos con profundidad.
  • Inspiración de diseño — descubre combinaciones de color inesperadas.
  • Fondos de pantalla y banners — genera activos visuales únicos.

Privacidad

Todos los gradientes se generan 100% en tu navegador. No se envían datos a ningún servidor.