What it does
Hero Patterns is Steve Schoger’s free collection of repeating SVG backgrounds. Each pattern has foreground and background colours plus an opacity control, with generated CSS for a web page and an unstyled SVG download. The artwork uses the Creative Commons Attribution 4.0 licence.
A pattern’s contrast can change its role in a layout. Select a motif, set the two colours and lower Foreground Opacity for a quieter background behind text. Reset returns the appearance settings to their starting point.
Use the generated CSS for a repeating web background, or take the unstyled SVG into a vector editor for further treatment.
Credit travels with the pattern
CC BY 4.0 allows adaptation and commercial reuse. Give appropriate credit, link the licence and identify changes. The credit must not imply that the creator endorses the project.
Strengths
- Colour and opacity controls change the treatment without redrawing the motif
- Both generated CSS and unstyled SVG are available
Watch out for
- Reuse requires attribution and a licence link
Best for
- Repeating web backgrounds
- Vector textures for layouts with an attribution route
Sources
- Hero Patterns appearance controls, downloads and licence link (Oct 27, 2026)
- Creative Commons Attribution 4.0 terms (Oct 27, 2026)