Here are just a few snippets of code to teach you how to use css gradients. Find examples of linear gradients, radial gradients, color stops and repeating gradients. Use rgba colors with transparency to enhance your css effects. Finally, let's make some plaid!
Here are a few helpful links:
MDN Using CSS Gradients https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Images/Using_CSS_gradients
MDN repeating-linear-gradient() https://developer.mozilla.org/en-US/docs/Web/CSS/repeating-linear-gradient
CSS-Tricks CSS Gradients https://css-tricks.com/css3-gradients/
CSS-Tricks background-image https://css-tricks.com/almanac/properties/b/background-image/
CSS-Tricks background-image https://css-tricks.com/stripes-css/
CSS-Tricks Why Do We Have ‘repeating-linear-gradient’ anyway https://css-tricks.com/why-do-we-have-repeating-linear-gradient-anyway/
and for inspiration:
Lea Verou CSS3 Patterns http://lea.verou.me/css3patterns/