CSS Gradient
Cotton Candy Gradient
Spin up some sweetness with this cotton candy gradient. Soft pink melts into baby blue, creating the instantly recognizable two-tone of carnival cotton candy. It is playful, nostalgic, and universally charming. Use it for children's products, sweet treats, and designs that need to spark joy.
background: linear-gradient(135deg, #ff9a9e 0%, #fecfef 40%, #a8d8f0 70%, #89cff0 100%);Color Stops
Frequently Asked Questions
›What colors make a cotton candy gradient?
The classic cotton candy look uses soft pink (#FF9A9E, #FECFEF) and baby blue (#A8D8F0, #89CFF0). Add a white or very pale middle stop for a fluffier feel.
›How do I make this gradient more subtle?
Reduce the saturation of each stop by 20-30% in HSL. This creates a muted, sophisticated version that still reads as cotton candy but works in more mature contexts.
›What design contexts suit cotton candy gradients?
Children's brands, bakeries, gender reveal events, Y2K-inspired design, social media graphics, and playful mobile apps. The gradient works best when the overall tone is light and fun.