html {
  --u:  2vmax;
  --c1: #f13c3c;
  --c2: #c72f2f;
  --c3: #607d8b;
  --c4: #43687a;
  --bg: #460000;
  --circle1: var(--c3) 0% 15%, var(--c4) 16% 20%, var(--c3) 21% 21%, #fff0 22% 100%;
  --circle2: var(--c1) 0% 11%, var(--c2) 12% 16%, var(--c1) 16.5% 17%, #fff0 17.5% 100%;        
  --circle3: var(--c3) 0% 4%, var(--c4) 5% 8%, var(--c3) 8.5% 9.25%, #fff0 9.75% 100%;
  --circle4: var(--c1) 0% 4%, var(--c2) 5% 8%, var(--c1) 8.5% 9.25%, #fff0 9.75% 100%;
  --black-dot: var(--bg) 0% calc(var(--u) * 0.2), #0002 calc(var(--u) * 0.3) calc(var(--u) * 0.45), #fff0 4% 100%;
  --black-dot-small: var(--bg) 0% calc(var(--u) * 0.05), #0002 calc(var(--u) * 0.1) calc(var(--u) * 0.15), #fff0 2% 100%;
  --gp: 50%/calc(var(--u) * 10) calc(var(--u) * 10);
  height: 100vh;
  background: 
    /* mini holes */  
    radial-gradient(circle at 73.5% 23.5%, var(--black-dot-small)) var(--gp),
    radial-gradient(circle at 76.5% 23.5%, var(--black-dot-small)) var(--gp),
    radial-gradient(circle at 73.5% 26.5%, var(--black-dot-small)) var(--gp),
    radial-gradient(circle at 76.5% 26.5%, var(--black-dot-small)) var(--gp),  
    radial-gradient(circle at 23.5% 73.5%, var(--black-dot-small)) var(--gp),
    radial-gradient(circle at 26.5% 73.5%, var(--black-dot-small)) var(--gp),
    radial-gradient(circle at 23.5% 76.5%, var(--black-dot-small)) var(--gp),
    radial-gradient(circle at 26.5% 76.5%, var(--black-dot-small)) var(--gp),
    radial-gradient(circle at 73.5% 73.5%, var(--black-dot-small)) var(--gp),
    radial-gradient(circle at 76.5% 73.5%, var(--black-dot-small)) var(--gp),
    radial-gradient(circle at 73.5% 76.5%, var(--black-dot-small)) var(--gp),
    radial-gradient(circle at 76.5% 76.5%, var(--black-dot-small)) var(--gp),  
    radial-gradient(circle at 23.5% 23.5%, var(--black-dot-small)) var(--gp),
    radial-gradient(circle at 26.5% 23.5%, var(--black-dot-small)) var(--gp),
    radial-gradient(circle at 23.5% 26.5%, var(--black-dot-small)) var(--gp),
    radial-gradient(circle at 26.5% 26.5%, var(--black-dot-small)) var(--gp),   
    /* mini holes */

    /* mini buttons */
    radial-gradient(circle at 25% 25%, var(--circle3)) var(--gp),
    radial-gradient(circle at 25% 75%, var(--circle4)) var(--gp),
    radial-gradient(circle at 75% 25%, var(--circle4)) var(--gp),
    radial-gradient(circle at 75% 75%, var(--circle3)) var(--gp),
    /* mini buttons */
  
    /* blue holes */
    radial-gradient(circle at 4.5% 45.5%, var(--black-dot)) var(--gp),  
    radial-gradient(circle at 4.5% 54.5%, var(--black-dot)) var(--gp),  
    radial-gradient(circle at 95.5% 45.5%, var(--black-dot)) var(--gp), 
    radial-gradient(circle at 95.5% 54.5%, var(--black-dot)) var(--gp), 
    radial-gradient(circle at 50% 93.5%, var(--black-dot)) var(--gp), 
    radial-gradient(circle at 50% 6.5%, var(--black-dot)) var(--gp),  
    radial-gradient(circle at 56.5% 0%, var(--black-dot)) var(--gp),
    radial-gradient(circle at 56.5% 100%, var(--black-dot)) var(--gp),
    radial-gradient(circle at 43.5% 0%, var(--black-dot)) var(--gp),
    radial-gradient(circle at 43.5% 100%, var(--black-dot)) var(--gp),
    /* blue holes */
  
    /* red holes */
    radial-gradient(circle at 5% 95%, var(--black-dot)) var(--gp),
    radial-gradient(circle at 95% 5%, var(--black-dot)) var(--gp),
    radial-gradient(circle at 95% 95%, var(--black-dot)) var(--gp),
    radial-gradient(circle at 5% 5%, var(--black-dot)) var(--gp),
    radial-gradient(circle at 50% 56.5%, var(--black-dot)) var(--gp),
    radial-gradient(circle at 43.5% 50%, var(--black-dot)) var(--gp),
    radial-gradient(circle at 50% 43.5%, var(--black-dot)) var(--gp),
    radial-gradient(circle at 56.5% 50%, var(--black-dot)) var(--gp),
    /* red holes */

    /* blue buttons */
    radial-gradient(circle at 50% 0%, var(--circle1)) var(--gp),
    radial-gradient(circle at 50% 100%, var(--circle1)) var(--gp),
    radial-gradient(circle at 0% 50%, var(--circle1)) var(--gp),
    radial-gradient(circle at 100% 50%, var(--circle1)) var(--gp),
    /* blue buttons */

    /* red buttons */
    radial-gradient(circle at 0% 100%, var(--circle2)) var(--gp),
    radial-gradient(circle at 0% 0%, var(--circle2)) var(--gp),
    radial-gradient(circle at 100% 100%, var(--circle2)) var(--gp),
    radial-gradient(circle at 100% 0%, var(--circle2)) var(--gp),
    radial-gradient(circle at 50% 50%, var(--c1) 0% 23%, var(--c2) 24% 32%, var(--c1) 33% 34%, #fff0 35% 100%) var(--gp),
    /* red buttons */
  
    var(--bg);

}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.