KolorPal

Degradado de #9C27B0 a #00BCD4

Un degradado suave que pasa de #9C27B0 a #00BCD4. Copia el código CSS de abajo para usar este degradado en tus proyectos.

Puntos de color

Color de Inicio

#9C27B0

rgb(156, 39, 176)

hsl(291, 64%, 42%)

Color de Fin

#00BCD4

rgb(0, 188, 212)

hsl(187, 100%, 42%)

Código CSS del degradado

Lineal (135deg)

background: linear-gradient(135deg, #9C27B0, #00BCD4);

Horizontal

background: linear-gradient(to right, #9C27B0, #00BCD4);

Radial

background: radial-gradient(circle, #9C27B0, #00BCD4);

Clases de Tailwind CSS

Tailwind

bg-gradient-to-r from-[#9C27B0] to-[#00BCD4]

Variantes de dirección

Horizontal

Vertical

Diagonal

Esquina

Preguntas frecuentes

¿Cómo crear un degradado de #9C27B0 a #00BCD4?▾

Usa la propiedad CSS: linear-gradient(135deg, #9C27B0, #00BCD4). Aplícala a la propiedad background de cualquier elemento. Puedes cambiar el ángulo (135deg) para ajustar la dirección del degradado.

¿Qué propiedad CSS crea un degradado?▾

Los degradados se crean con la propiedad CSS background o background-image junto con funciones de degradado como linear-gradient(), radial-gradient() o conic-gradient(). Por ejemplo: background: linear-gradient(to right, #9C27B0, #00BCD4);

¿Cómo uso este degradado en Tailwind CSS?▾

En Tailwind CSS, usa las clases de utilidad: "bg-gradient-to-r from-[#9C27B0] to-[#00BCD4]". Las clases from- y to- definen los puntos del degradado. Cambia bg-gradient-to-r por bg-gradient-to-br para una dirección diagonal.

Recursos relacionados