Orodje vzorec sestavi kot navadno kodo SVG, zato je rezultat ostro izrisan pri vsaki povečavi ali gostoti zaslona in po navadi tehta le nekaj sto bajtov, kar je precej manj kot ploščica PNG. Kodo CSS prilepite naravnost v datoteko stylesheet za ponavljajoč se background-image, samostojno datoteko SVG pa uporabite kot ločeno grafično sredstvo. Nič od tega ne gre na noben strežnik: vzorec se v celoti izriše na vaši napravi, zato deluje tudi brez povezave, ko se stran enkrat naloži.
Brezplačen generator SVG vzorcev
Vse poteka v vašem brskalniku - brez nalaganja, brez registracije.
Vzorec
Slog
Ospredje
Ozadje
Kaj je generator SVG vzorcev?
Generator SVG vzorcev sestavi ponavljajoče se ozadje iz geometrijskih oblik, kot so pike, črte, mreže in cikcaki. Izberete obliko, barve, velikost ploščice in debelino črt, orodje pa izpiše majhen SVG, neodvisen od ločljivosti, in kodo CSS, pripravljeno za lepljenje. Vse nastane v brskalniku, zato se nič ne pošilja nikamor.
Kako uporabljati
- 1Izberite vzorec. Med vzorčnimi ploščicami izberite obliko - pike, obroči, mreža, diagonala, križno šrafiranje, plus, cikcak in drugo.
- 2Nastavite barve in obliko. Izberite barvo ospredja in ozadja (ali naredite ozadje prosojno), nato med sprotnim posodabljanjem predogleda prilagodite drsnike za velikost, debelino in prosojnost.
- 3Kopirajte ali prenesite. Preklopite med zavihkoma CSS in SVG, kopirajte kodo ali prenesite samostojno datoteko .svg za uporabo kjerkoli.
Komu je namenjeno
- Spletni razvijalci, ki dodajo diskretno, lahko teksturo ozadja v naslovni razdelek, kartico ali sekcijo brez nalaganja slikovne datoteke.
- Oblikovalci vmesnikov in znamk, ki preizkušajo brezšivne teksture v barvah znamke in jih izvozijo kot ostre datoteke SVG.
- Ustvarjalci e-pošte in predstavitev, ki potrebujejo majhen, ponavljajoč se vzorec, ki se ostro prikaže na vsakem zaslonu.
- Študenti in ljubitelji, ki se z nastavljanjem vrednosti in branjem izpisa učijo, kako delujeta SVG
<pattern>in mreženje ozadja v CSS. - Ustvarjalci vsebin, ki hitro naredijo dekorativna ozadja za sličice, pasice in maketne prikaze.
Pogosta vprašanja
Je generator SVG vzorcev brezplačen?
Da, popolnoma je brezplačen, brez prijave in brez omejitev. Vsak vzorec nastane v brskalniku, zato jih lahko ustvarite in kopirate kolikor želite, tudi brez povezave, ko je stran enkrat naložena.
So vzorci res brezšivni?
Da. Vsaka oblika je izrisana tako, da se njeni robovi natančno ujemajo s sosednjo ploščico, vzorec pa se ponavlja na fiksni mreži. Tako CSS background-image kot element SVG <pattern> ploščico postavita druga ob drugo brez vidnih šivov.
Naj uporabim izpis CSS ali SVG?
CSS uporabite, kadar želite ponavljajoče se ozadje prilepiti naravnost v stylesheet - za spletne strani je to najhitrejše. Prenos SVG uporabite, kadar potrebujete samostojno datoteko, na primer kot grafično sredstvo, v orodju za oblikovanje ali neposredno vgrajeno v HTML.
Zakaj uporabiti SVG vzorec namesto PNG?
SVG je vektorski format, zato ostane popolnoma oster pri vsaki povečavi ali gostoti zaslona in nikoli ne postane pikselast. Geometrijska ploščica SVG po navadi tehta le nekaj sto bajtov, precej manj kot enakovreden PNG, barve pa lahko kadarkoli spremenite brez ponovnega izvoza.
Lahko naredim ozadje prosojno?
Da. Označite možnost Prosojno in polnilo ozadja odpade, tako da vzorec prikazuje le oblike v ospredju. Tako lahko vzorec plastite čez obstoječo barvo, sliko ali preliv.
Se moja zasnova kam naloži?
Ne. Celoten vzorec nastane lokalno v vašem brskalniku z navadno kodo SVG in nič se ne pošlje na strežnik, zato vaše barve in nastavitve ostanejo zasebne na vaši napravi.