Digital / Web UI
Aurora Gradient
Un gradiente atmosférico inspirado en auroras, útil para crear profundidad sin ilustración pesada.
Au
Usos
- Fondos hero
- Bandas de sección
- Estados vacíos
Parámetros
- color stops
- grain
- contrast
- field scale
- dark base
Prompt IA
Crea un fondo aurora con campos de color suaves, grano discreto, espacio negativo y buen contraste.
Notas Tailwind
Usa varios radial-gradient sobre una base oscura y añade grano sutil.
Rendimiento
Grandes gradientes estáticos suelen ser seguros. Evita blur animado en dispositivos débiles.
CSS
.aurora-gradient {
background:
radial-gradient(circle at 20% 20%, rgba(46, 255, 190, .42), transparent 32%),
radial-gradient(circle at 74% 34%, rgba(255, 94, 210, .28), transparent 34%),
radial-gradient(circle at 52% 78%, rgba(255, 211, 92, .22), transparent 32%),
#080b0a;
}Ejemplo React
export function AuroraSection({ children }) {
return <section className="aurora-gradient">{children}</section>;
}