JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="fr">
<meta charset="UTF-8"/>
<head>
  <title>Dégradés répétitifs page 134 html5 et css3</title>

  <style>
    .degrade-repetitif-lineaire {
      background: repeating-linear-gradient(-45deg, red, blue 20px, red 30px);
      border: 5px solid #f1f317;
      width: 600px;
      height: 300px;
      }
    
    .degrade-repetitif-radial {
      position: absolute;
      top: 330px;
      background: repeating-radial-gradient(red, green 20px, red 10px);
      border: 5px solid #f1f317;
      width: 600px;
      height: 300px;
      }
           
  </style>
</head>

<body>
    <div class="degrade-repetitif-lineaire"></div>
    <div class="degrade-repetitif-radial"></div>
</body>
</html>