JSFiddle - React, Tailwind, and code Playground

HTML

<ol>
  <li> с префиксом -moz-
    <div id="grad1"></div>
  </li>
  <li>без префикса -moz-	  
    <div id="grad2"></div>
  </li>	    
</ol>
<ol>
  <li>с префиксом -moz-
    <div id="grad3"></div>
  </li>
  <li>без префикса -moz- 
    <div id="grad4"></div>
  </li>	    
</ol>

CSS

body { background: #efe; }
div {
    width: 50px;
    height: 50px;
}
#grad1 {
  background-image: -moz-repeating-linear-gradient(180deg,transparent,transparent 7%, rgb(100,100,100) 10%);
}

#grad2 {
  background-image: repeating-linear-gradient(180deg,transparent,transparent 7%, rgb(100,100,100) 10%);
}
#grad3 {
  background-image: -moz-repeating-linear-gradient(-45deg, #ccc, #ccc 25px, transparent 25px, transparent 50px);
}

#grad4 {
  background-image: repeating-linear-gradient(-45deg, #ccc, #ccc 25px, transparent 25px, transparent 50px);
}