Element SVG nám umožňuje definovať vzory vo vnútri nášho označenia SVG a použiť ich ako a fill. Základný proces pre vzory je niečo ako:
- Definujte
vnútro SVG - Definujte tvary vo vnútri vzoru
- Použite tvary
- Vytvorte nový tvar a vyplňte ho vzorom
Toto je zbierka jednoduchých tvarov SVG používaných ako vzory. Tento zoznam sa môže časom rozrastať, ale myšlienkou nie je mať komplexnú zbierku, ako mať po ruke syntax ako východiskový bod pre vytváranie nových a vzrušujúcich vzorov.
Ich zbierku tiež uchovávame na serveri CodePen.
Kruhový vzor
Šachovnicový vzor
Šesťhranný vzor
Kockový vzor
Chevron vzor
Ak sa chcete v reálnom čase pohrať s rôznymi atribútmi vzoru, aby ste získali predstavu o tom, ako vzorovanie funguje, vyskúšajte toto: