Gradient #CDDC39 to #3F51B5
A smooth gradient transitioning from #CDDC39 to #3F51B5. Copy the CSS code below to use this gradient in your projects.
Color Stops
Start Color
#CDDC39
rgb(205, 220, 57)
hsl(66, 70%, 54%)
End Color
#3F51B5
rgb(63, 81, 181)
hsl(231, 48%, 48%)
CSS Gradient Code
Linear (135deg)
background: linear-gradient(135deg, #CDDC39, #3F51B5);
Horizontal
background: linear-gradient(to right, #CDDC39, #3F51B5);
Radial
background: radial-gradient(circle, #CDDC39, #3F51B5);
Tailwind CSS Classes
Tailwind
bg-gradient-to-r from-[#CDDC39] to-[#3F51B5]
Direction Variants
Horizontal
Vertical
Diagonal
Corner
Frequently Asked Questions
How to create a gradient from #CDDC39 to #3F51B5?▾
Use the CSS property: linear-gradient(135deg, #CDDC39, #3F51B5). Apply it to the background property of any element. You can change the angle (135deg) to adjust the gradient direction.
What CSS property makes a gradient?▾
Gradients are created using the CSS background or background-image property with gradient functions like linear-gradient(), radial-gradient(), or conic-gradient(). For example: background: linear-gradient(to right, #CDDC39, #3F51B5);
How do I use this gradient in Tailwind CSS?▾
In Tailwind CSS, use the utility classes: "bg-gradient-to-r from-[#CDDC39] to-[#3F51B5]". The from- and to- classes set the gradient stops. Change bg-gradient-to-r to bg-gradient-to-br for a diagonal direction.