radial-gradient(circle, #FF9A9E 0%, #FECFEF 50%, #FECFEF 100%)
Peach Fuzz 9
radial
Back to gradients
#FDDB92
Light
#D1FDFF
Dark
CSS Code
Golden Hour 51
RADIAL
CIRCLE
3,075
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 Yellow #FDDB92 at the start to Light Teal #D1FDFF at the end. Because it spans a warm and a cool tone, the transition feels dynamic and eye-catching.
The colours
The gradient is built from Light Yellow (#FDDB92), Light Teal (#D1FDFF). Light Yellow is a light, airy tone — ideal for backgrounds and subtle fills. Light Teal 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 Teal end.
Frequently asked questions
How do I use this gradient in CSS?
Copy the radial-gradient(circle, #FDDB92 0%, #D1FDFF 100%) value and apply it to any element with the background property, for example: background: radial-gradient(circle, #FDDB92 0%, #D1FDFF 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 (#FDDB92 and #D1FDFF) and the shape can be edited directly in the CSS to fine-tune the blend for your own design.
Related Gradients
radial-gradient(circle, #FFECD2 0%, #FCB69F 100%)
Sunrise 38
radial
radial-gradient(circle, #FF9A9E 0%, #FECFEF 100%)
Solar Wind 45
radial
radial-gradient(circle, #EE9CA7 0%, #FFDDE1 100%)
Aurora 37
radial
radial-gradient(circle, #F953C6 0%, #B91D73 100%)
Color Drift 36
radial
radial-gradient(circle, #FDDB92 0%, #D1FDFF 100%)
Winter Frost 6
radial
radial-gradient(circle, #FDDB92 0%, #D1FDFF 100%)
Winter Frost 6
radial
radial-gradient(circle, #FFA751 0%, #FFE259 100%)
Moon Glow 9
radial
radial-gradient(circle, #FDDB92 0%, #D1FDFF 100%)
Thunder Storm 11
radial
radial-gradient(circle, #FF9A9E 0%, #FECFEF 50%, #FECFEF 100%)
Light Burst 19
radial
radial-gradient(circle, #F953C6 0%, #B91D73 100%)
Purple Rain 16
radial
radial-gradient(circle, #FFB347 0%, #FFCC33 100%)
Pulse 20
radial
radial-gradient(circle, #FDDB92 0%, #D1FDFF 100%)
Chroma Flow 36
radial
radial-gradient(circle, #FDA085 0%, #F6D365 100%)
Autumn Fire 16
radial
radial-gradient(circle, #FF9A9E 0%, #FECFEF 50%, #FECFEF 100%)
Spectrum 29
radial
radial-gradient(circle, #FF6B6B 0%, #FFE66D 100%)
Summer Haze 23
radial
radial-gradient(circle, #F6D365 0%, #FDA085 100%)
Cosmic Ray 14
radial
radial-gradient(circle, #F7797D 0%, #FBD786 50%, #C6FFDD 100%)
Hue Shift 14
radial
radial-gradient(circle, #FDDB92 0%, #D1FDFF 100%)
Lava Flow 36
radial
radial-gradient(circle, #FBC2EB 0%, #A6C1EE 100%)
Midnight 37
radial
radial-gradient(circle, #FBC2EB 0%, #A6C1EE 100%)
Solar Wind 7
radial
radial-gradient(circle, #FAD0C4 0%, #FFD1FF 100%)
Mint Breeze 19
radial
radial-gradient(circle, #FFB347 0%, #FFCC33 100%)
Forest Mist 40
radial
radial-gradient(circle, #EE9CA7 0%, #FFDDE1 100%)
Desert Sand 47
radial