Upprepad övertoning (repeating-linear-gradient, repeating-radial-gradient)

Box 1

#box1 {
background:
repeating-linear-gradient(180deg,
rgba(255,255,255,1.00) 10%,
rgba(255,0,0,1.00) 20%);
}

Box 2

#box2 {
background:
repeating-linear-gradient(180deg,
rgba(255,255,255,1.00) 10px,
rgba(255,0,0,1.00) 20px);
}

Box 3

#box3 {
background:
repeating-linear-gradient(180deg,
rgba(255,255,255,1.00) 0px,
rgba(255,255,255,1.00) 10px,
rgba(255,0,0,1.00) 10px,
rgba(255,0,0,1.00) 20px);
}

Box 4

#box4 {
background: repeating-linear-gradient(45deg,
rgba(255,255,255,1.00) 0px,
rgba(255,255,255,1.00) 10px,
rgba(255,0,0,1.00) 10px,
rgba(255,0,0,1.00) 20px);
}

Box 5

#box5 {
background:
repeating-linear-gradient(180deg,
rgba(255,0,0, 0.50) 5px,
rgba(255,0,0, 0.50) 15px,
transparent 15px,
transparent 25px),
repeating-linear-gradient(90deg,
rgba(255,0,0, 0.50) 5px,
rgba(255,0,0, 0.50) 15px,
transparent 15px,
transparent 25px);
}

Box 6

#box6 {
background:
repeating-linear-gradient(45deg,
rgba(255,0,0, 0.50) 5px,
rgba(255,0,0, 0.50) 15px,
transparent 15px,
transparent 25px),
repeating-linear-gradient(135deg,
rgba(255,0,0, 0.50) 5px,
rgba(255,0,0, 0.50) 15px,
transparent 15px,
transparent 25px);
}

Box 7

#box7 {
background:
repeating-linear-gradient(180deg,
rgba(0,0,0, 0.50) 0px,
rgba(0,0,0, 0.50) 1px,
transparent 1px,
transparent 31px);
}

Box 8

#box8 {
background:
repeating-linear-gradient(180deg,
rgba(0,0,0, 0.50) 0px,
rgba(0,0,0, 0.50) 1px,
transparent 1px,
transparent 31px),
repeating-linear-gradient(90deg,
rgba(0,0,0, 0.50) 0px,
rgba(0,0,0, 0.50) 1px,
transparent 1px,
transparent 31px);
}