ボーダー／ストライプ背景の作成（CSS)

「繰り返したい色と、その幅」と「角度」を指定するイメージ。

【基本形（文法）】

background:repeating-linear-gradient(角度, カラー1 開始位置, カラー1 終了位置, カラー2 開始位置, カラー2 終了位置,…);

【横ストライプ例】
角度は「0」指定なので省略。

background:repeating-linear-gradient(#e79901 0, #e79901  10px, #e2e7eb  10px, #e2e7eb  20px);

【縦ストライプ例】
角度は「90」指定。

background:repeating-linear-gradient(90deg, #e79901  0, #e79901  10px, #e2e7eb  10px, #e2e7eb  20px);

【ななめストライプ例】
角度は「45」指定。

background:repeating-linear-gradient(45deg, #e79901  0, #e79901  10px, #e2e7eb  10px, #e2e7eb  20px);

【縦横ストライプ　イメージ例】

【出典】
https://www.wan55.co.jp/column/detail/id=659