Skip to content
This repository has been archived by the owner on May 7, 2023. It is now read-only.

Latest commit

 

History

History
29 lines (25 loc) · 715 Bytes

stripes-pattern.md

File metadata and controls

29 lines (25 loc) · 715 Bytes
title type tags cover dateModified
Stripes background pattern
snippet
visual
jars-on-shelf
2021-01-11 09:51:43 +0200

Creates a stripes background pattern.

  • Use background-color to set a white background.
  • Use background-image with a radial-gradient() value to create a vertical stripe.
  • Use background-size to specify the pattern's size.
  • Note: The fixed height and width of the element is for demonstration purposes only.
<div class="stripes"></div>
.stripes {
  width: 240px;
  height: 240px;
  background-color: #fff;
  background-image: linear-gradient(90deg, transparent 50%, #000 50%);
  background-size: 60px 60px;
  background-repeat: repeat;
}