Sea Breeze CSS Gradient

A blue, teal, fresh conic gradient you can drop into any project. Copy the CSS below and use it as a background for hero sections, cards, buttons, or full pages.

The CSS

background-image: conic-gradient(from 90deg, oklch(0.96 0.024 206.195), oklch(0.847 0.091 206.2), oklch(0.759 0.124 208.28), oklch(0.682 0.118 210.053), oklch(0.96 0.024 206.195));

The colors

The colors this gradient blends between. Open any of them for a full breakdown — shades, harmonies, and contrast.

Tags:bluetealfreshConic

Related gradients

Ocean Breeze
Citrus Slices
Deep Sea Cone
Ocean Sweep
Ice & Fire
Aurora Slice
Copper Patina
Blue Steel

More gradient tools

Browse the full gallery of CSS gradients, build animated backgrounds with the Shader Maker, or generate soft multi-color backgrounds with the Mesh Gradient Generator.