CSS background pattern generator

Generate unique CSS background patterns effortlessly with our free tool. Customize colors, shapes, and styles for your website's design.

Pattern type

Pattern color

Background color

Pattern size

32px

background-image: repeating-conic-gradient(#474bff 0% 25%, #47d3ff 0% 50%);
background-position: 0 0, 32px 32px;
background-size: 64px 64px;
background-color: #47d3ff;