html {
  --s: 222px; /* control the size */
  
  --_g: #7f727b 10%,#d6b4c2 10.5% 19%,#0000 19.5% 80.5%,#d6b4c2 81% 89.5%,#baa0ab 90%;
  --_c: from -90deg at 37.5% 50%,#0000 75%;
  --_l1: linear-gradient(145deg,var(--_g));
  --_l2: linear-gradient( 35deg,var(--_g));
  background: 
    var(--_l1), var(--_l1) calc(var(--s)/2) var(--s),
    var(--_l2), var(--_l2) calc(var(--s)/2) var(--s),
    conic-gradient(var(--_c),#7f727b 0) calc(var(--s)/8) 0,
    conic-gradient(var(--_c),#baa0ab 0) calc(var(--s)/2) 0,
    linear-gradient(90deg,#baa0ab 38%,#7f727b 0 50%,#baa0ab 0 62%,#7f727b 0);
  background-size: var(--s) calc(2*var(--s)/3);
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.