Element SVG pozwala nam definiować wzorce wewnątrz naszych znaczników SVG i używać tych wzorców jako pliku fill. Podstawowy proces tworzenia wzorów wygląda mniej więcej tak:
- Zdefiniuj
wnętrze SVG - Nakreśl kształty wewnątrz wzoru
- Użyj kształtów
- Utwórz nowy kształt i wypełnij go wzorem
To jest zbiór prostych kształtów SVG używanych jako wzorce. Lista ta może się z czasem rozrastać, ale chodzi o to, aby mieć obszerny zbiór, ale żeby składnia była przydatna jako punkt wyjścia do tworzenia nowych i ekscytujących wzorców.
Przechowujemy ich również kolekcję w CodePen.
Wzór koła
Wzór szachownicy
Sześciokątny wzór
Wzór kostki
Wzór Chevron
Jeśli chcesz bawić się w czasie rzeczywistym różnymi atrybutami wzoru, aby poczuć, jak działa wzór, spróbuj tego: