html {
    --u:  3.12vmin; /* size */
    --c1: #dce9ef;
    --c2: #7d9099;
    --c3: #142f3c;
    --c4: #2a4856;
    --gp: 50%/ calc(var(--u) * 10) calc(var(--u) * 5.71);
    height: 100vh;
  background: 
    conic-gradient(from 60deg at 66.5% 100%, var(--c1) 0 30deg, #fff0 0 360deg) var(--gp),
    conic-gradient(from 270deg at 33.5% 100%, var(--c2) 0 30deg, #fff0 0 360deg) var(--gp),
    radial-gradient(circle at 99.5% 53%, var(--c3) 0 calc(var(--u) * 1.65), #fff0 calc(var(--u) * 1.65 + 1px) 100%) var(--gp),
    radial-gradient(circle at 0.5% 53%, var(--c3) 0 calc(var(--u) * 1.65), #fff0 calc(var(--u) * 1.65 + 1px) 100%) var(--gp), 
    radial-gradient(circle at 50% 100%, var(--c3) 0 calc(var(--u) * 1.65), #fff0 calc(var(--u) * 1.65 + 1px) 100%) var(--gp), 
    conic-gradient(from 120deg at 50% 50%, var(--c4) 0 120deg, #fff0 0 360deg) var(--gp),
    conic-gradient(from 90deg at 82.85% 50.5%, var(--c3) 0 90deg, #fff0 0 360deg) var(--gp),
    conic-gradient(from 180deg at 17.15% 50.5%, var(--c3) 0 90deg, #fff0 0 360deg) var(--gp),
    conic-gradient(from 120deg at 50% 17.5%, var(--c2) 0 60deg, var(--c1) 0 120deg, #fff0 0 360deg) var(--gp),
    linear-gradient(90deg, #fff0 0 33.5%,  var(--c3) 0 66.5%, #fff0 0 100%) var(--gp),
    conic-gradient(from 0deg at 50% 50%, var(--c1) 0 60.5deg, var(--c4) 0 299.5deg, var(--c2) 0 360deg) var(--gp);
}

// Inspired by this image from Pinterest:
// https://www.pinterest.com/pin/473370610840671204/