radial-gradient(circle, #4B79A1 0%, #283E51 100%)
Cherry Blossom 14
radial
Back to gradients
#C9D6FF
Light
#E2E2E2
Dark
CSS Code
Winter Frost 47
RADIAL
CIRCLE
3,568
Views
Copy & Download
About this gradient
This is a radial CSS gradient that blends two colours. The colour transitions outward from the centre in smooth concentric rings, moving from Light Blue #C9D6FF at the start to Light Gray #E2E2E2 at the end. The result is a soft, versatile blend that works across many design styles.
The colours
The gradient is built from Light Blue (#C9D6FF), Light Gray (#E2E2E2). Light Blue is a light, airy tone — ideal for backgrounds and subtle fills. Light Gray is a light, airy tone — ideal for backgrounds and subtle fills.
Where to use it
Radial gradients like this one work well as spotlight backgrounds, soft card glows, button hovers and hero backdrops where you want attention drawn toward a central focal point. Apply it to a full-width section for a subtle depth effect, or to a smaller element for a glowing accent.
Text & accessibility
The colours are close in tone, so this gradient works best as a decorative background rather than behind small text. If you do place text over it, use a solid overlay or pick text colour that clears the 4.5:1 WCAG contrast ratio against the Light Gray end.
Frequently asked questions
How do I use this gradient in CSS?
Copy the radial-gradient(circle, #C9D6FF 0%, #E2E2E2 100%) value and apply it to any element with the background property, for example: background: radial-gradient(circle, #C9D6FF 0%, #E2E2E2 100%);
Is this a linear or radial gradient?
It is a radial gradient — the colour radiates outward from a central point in concentric rings, which suits circular highlights, spotlights and soft backdrops.
Can I change the colours or direction?
Yes. The two hex stops (#C9D6FF and #E2E2E2) and the shape can be edited directly in the CSS to fine-tune the blend for your own design.
Related Gradients
radial-gradient(circle, #5C258D 0%, #4389A2 100%)
Prism 37
radial
radial-gradient(circle, #89F7FE 0%, #66A6FF 100%)
Lavender Dream 5
radial
radial-gradient(circle, #89F7FE 0%, #66A6FF 100%)
Nebula 45
radial
radial-gradient(circle, #E0C3FC 0%, #8EC5FC 100%)
Honey Glow 12
radial
radial-gradient(circle, #E0C3FC 0%, #8EC5FC 100%)
Tone Fade 22
radial
radial-gradient(circle, #4568DC 0%, #B06AB3 100%)
Shadow Play
radial
radial-gradient(circle, #4B79A1 0%, #283E51 100%)
Rose Petal 44
radial
radial-gradient(circle, #E2B0FF 0%, #9F44D3 100%)
Nebula 27
radial
radial-gradient(circle, #373B44 0%, #4286F4 100%)
Coral Reef 15
radial
radial-gradient(circle, #4CA1AF 0%, #C4E0E5 100%)
Flux 40
radial
radial-gradient(circle, #373B44 0%, #4286F4 100%)
Ocean Wave 45
radial
radial-gradient(circle, #134E5E 0%, #71B280 100%)
Golden Hour 45
radial
radial-gradient(circle, #00B4DB 0%, #0083B0 100%)
Prism 13
radial
radial-gradient(circle, #005C97 0%, #363795 100%)
Thunder Storm 2
radial
radial-gradient(circle, #1FA2FF 0%, #12D8FA 50%, #A6FFCB 100%)
Crimson Tide 11
radial
radial-gradient(circle, #2BC0E4 0%, #EAECC6 100%)
Nebula 36
radial
radial-gradient(circle, #3494E6 0%, #EC6EAD 100%)
Wave Form 30
radial
radial-gradient(circle, #4776E6 0%, #8E54E9 100%)
Candy Pop 32
radial
radial-gradient(circle, #E2B0FF 0%, #9F44D3 100%)
Cherry Blossom 17
radial
radial-gradient(circle, #005C97 0%, #363795 100%)
Purple Rain 22
radial
radial-gradient(circle, #4CA1AF 0%, #C4E0E5 100%)
Vortex 30
radial
radial-gradient(circle, #E0EAFC 0%, #CFDEF3 100%)
Electric Blue 18
radial
radial-gradient(circle, #1CB5E0 0%, #000851 100%)
Solar Wind 48
radial