html {
  --s: 100px;   /* control the size */
  --c: #1BB0CE; /* first color */
  
  --_g1: 
    var(--c)   calc(25%/3) ,#0000 0 calc(50%/3),
    var(--c) 0 25%         ,#0000 0 75%,
    var(--c) 0 calc(250%/3),#0000 0 calc(275%/3),
    var(--c) 0;
  --_g2: 
    #0000   calc(25%/3) ,var(--c) 0 calc(50%/3),
    #0000 0 calc(250%/3),var(--c) 0 calc(275%/3),
    #0000 0;
  background:
    linear-gradient( 45deg,var(--_g2)),linear-gradient( 45deg,var(--_g1)),
    linear-gradient(-45deg,var(--_g2)),linear-gradient(-45deg,var(--_g1))
    #DAD6CA; /* second color */
  background-position: 0 0,var(--s) var(--s);
  background-size: calc(2*var(--s)) calc(2*var(--s));
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.