Color points

Drag the dots on the preview, or use the sliders.

  • Point 1
    8%
    12%
    55%
  • Point 2
    88%
    8%
    50%
  • Point 3
    78%
    86%
    55%
  • Point 4
    14%
    92%
    50%

Preview

CSS

background-color: #e8f1fb;
background-image:
  radial-gradient(at 8% 12%, #2875c5 0px, transparent 55%),
  radial-gradient(at 88% 8%, #7dd3fc 0px, transparent 50%),
  radial-gradient(at 78% 86%, #a7f3d0 0px, transparent 55%),
  radial-gradient(at 14% 92%, #c4b5fd 0px, transparent 50%);

Positions are percentages of the box, so the same CSS looks a little different on a tall phone than on a wide screen. The phone preview shows how it reflows.

Free Mesh Gradient Generator by Hiyaly