31 Free CSS Background Patterns 2026 ProofMatcher has 31 pure CSS background patterns — no image files, no SVG imports, infinitely scalable. Dot Grid .dots { background-color : #050505 ; background-image : radial-gradient ( rgba ( 255 , 255 , 255 , 0.15 ) 1px , transparent 1px ); background-size : 24px 24px ; } Enter fullscreen mode Exit fullscreen mode Line Grid .grid { background-image : linear-gradient ( rgba ( 255 , 255 , 255 , 0.04 ) 1px , transparent 1px ), linear-gradient ( 90deg , rgba ( 255 , 255 , 255 , 0.04 ) 1px , transparent 1px ); background-size : 32px 32px ; } Enter fullscreen mode Exit fullscreen mode Diagonal Stripes .stripes { background : repeating-linear-gradient ( 45deg , transparent , transparent 10px , rgba ( 255 , 255 , 255 , 0.03 ) 10px , rgba ( 255 , 255 , 255 , 0.03 ) 20px ); } Enter fullscreen mode Exit fullscreen mode Checkerboard .checker { background-color : #111 ; background-image : linear-gradient ( 45deg , #1a1a1a 25% , transparent 25% ), linear-gradient ( -45deg , #1a1a1a…