KolorPal

Dégradé #00BCD4 vers #2196F3

Un dégradé fluide allant de #00BCD4 vers #2196F3. Copiez le code CSS ci-dessous pour utiliser ce dégradé dans vos projets.

Couleurs du dégradé

Couleur de Début

#00BCD4

rgb(0, 188, 212)

hsl(187, 100%, 42%)

Couleur de Fin

#2196F3

rgb(33, 150, 243)

hsl(207, 90%, 54%)

Code CSS du dégradé

Linéaire (135deg)

background: linear-gradient(135deg, #00BCD4, #2196F3);

Horizontal

background: linear-gradient(to right, #00BCD4, #2196F3);

Radial

background: radial-gradient(circle, #00BCD4, #2196F3);

Classes Tailwind CSS

Tailwind

bg-gradient-to-r from-[#00BCD4] to-[#2196F3]

Variantes de direction

Horizontal

Vertical

Diagonal

Coin

Questions fréquentes

Comment créer un dégradé de #00BCD4 vers #2196F3 ?▾

Utilisez la propriété CSS : linear-gradient(135deg, #00BCD4, #2196F3). Appliquez-la à la propriété background de n'importe quel élément. Vous pouvez modifier l'angle (135deg) pour changer la direction du dégradé.

Quelle propriété CSS crée un dégradé ?▾

Les dégradés se créent avec la propriété CSS background ou background-image et des fonctions comme linear-gradient(), radial-gradient() ou conic-gradient(). Par exemple : background: linear-gradient(to right, #00BCD4, #2196F3);

Comment utiliser ce dégradé avec Tailwind CSS ?▾

Avec Tailwind CSS, utilisez les classes utilitaires : "bg-gradient-to-r from-[#00BCD4] to-[#2196F3]". Les classes from- et to- définissent les couleurs du dégradé. Remplacez bg-gradient-to-r par bg-gradient-to-br pour une direction diagonale.

Ressources associées