JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head />
<body>
    <div id="pattern"></div>
</body>
</html>

CSS

#pattern {
    background-image: -webkit-repeating-linear-gradient(2deg, 
        rgba(31, 31, 31, 0.5) 0px, 
        rgba(127, 127, 127, 0.5) 1px, 
        rgba(95, 95, 95, 0.5) 2px, 
        rgba(255, 255, 255, 0.5) 3px,
        rgba(0, 0, 0, 0.5) 4px,
        rgba(15, 15, 15, 0.5) 5px,
        rgba(191, 191, 191, 0.5) 6px,
        rgba(95, 95, 95, 0.5) 7px
    ), -webkit-repeating-linear-gradient(88deg, 
        rgba(31, 31, 31, 0.5) 0px, 
        rgba(127, 127, 127, 0.5) 1px, 
        rgba(95, 95, 95, 0.5) 2px, 
        rgba(255, 255, 255, 0.5) 3px,
        rgba(0, 0, 0, 0.5) 4px,
        rgba(15, 15, 15, 0.5) 5px,
        rgba(191, 191, 191, 0.5) 6px,
        rgba(95, 95, 95, 0.5) 7px
    ); 
    height: 100px;
    width: 100px;
}