Met het SVG- element kunnen we patronen binnen onze SVG-opmaak definiëren en die patronen gebruiken als een fill. Het basisproces voor patronen gaat ongeveer als:
- Definieer een
binnenkant van de SVG - Definieer de vormen in het patroon
- Gebruik de vormen
- Maak een nieuwe vorm en vul deze met het patroon
Dit is een verzameling eenvoudige SVG-vormen die als patronen worden gebruikt. Deze lijst kan in de loop van de tijd groeien, maar het idee is niet zozeer om een uitgebreide verzameling te hebben als wel om de syntaxis bij de hand te hebben als uitgangspunt voor het creëren van nieuwe en opwindende patronen.
We houden er ook een verzameling van op CodePen.
Cirkel patroon
Dambordpatroon
Zeshoekig patroon
Kubus patroon
Chevron patroon
Als je in realtime wilt spelen met de verschillende attributen van een patroon om een idee te krijgen van hoe het patroon werkt, probeer dan dit: