Tööriist paneb mustri kokku lihtsa SVG-märgistusena, mistõttu tulemus jääb teravaks igal suumitasemel ja ekraani tihedusel ning kaalub tavaliselt vaid mõnisada baiti - palju vähem kui PNG-plaat. Kopeeri CSS-kood, et lisada korduv background-image otse laaditabelisse, või laadi alla eraldiseisev SVG-fail, et kasutada seda graafilise elemendina. Midagi loodust ei saadeta kuhugi: muster joonistatakse täielikult sinu seadmes, mistõttu see töötab edasi ka võrguühenduseta, kui leht on korra laaditud.
Tasuta SVG mustri generaator
Töötab täielikult sinu brauseris - midagi ei laadita üles, kontot pole vaja.
Muster
Stiil
Esiplaan
Taust
Mis on SVG mustri generaator?
SVG mustri generaator loob õmbluseta, korduva tausta geomeetrilistest kujunditest - täppidest, joontest, ruudustikest ja sikk-sakkidest. Valid kuju, värvid, ploki suuruse ja joone paksuse ning tööriist väljastab väikese, eraldusvõimest sõltumatu SVG-faili koos kleepimisvalmis CSS-koodiga. Kõik luuakse brauseris, seega midagi ei laadita kuhugi üles.
Kuidas kasutada
- 1Vali muster. Vali näidiste hulgast kuju - täpid, rõngad, ruudustik, diagonaal, ristviirutus, plussmärk, sikk-sakk ja rohkem.
- 2Määra värvid ja kuju. Vali esiplaani ja tausta värv (või muuda taust läbipaistvaks), seejärel kohanda suuruse, paksuse ja läbipaistvuse liugureid, samal ajal kui eelvaade uueneb reaalajas.
- 3Kopeeri või laadi alla. Lülitu CSS- ja SVG-vahekaartide vahel, kopeeri kood või laadi alla eraldiseisev .svg-fail kasutamiseks kus iganes.
Kellele see sobib
- Veebiarendajad, kes lisavad peakangelasele, kaardile või lõigule diskreetse ja kerge taustatekstuuri ilma eraldi pildifailita.
- Kasutajaliidese ja brändi disainerid, kes katsetavad õmbluseta tekstuure brändi värvides ja ekspordivad need teravate SVG-failidena.
- E-kirjade ja esitluste koostajad, kes vajavad väikest korduvat mustrit, mis kuvatakse teravalt igal ekraanil.
- Õpilased ja hobiharrastajad, kes väärtusi muutes ja tulemust lugedes õpivad, kuidas SVG
<pattern>ja CSS-i taustaplokkide kordamine töötab. - Sisuloojad, kes loovad kiirelt kaunistavaid taustu pisipiltidele, banneritele ja mockup'idele.
Korduvad küsimused
Kas SVG mustri generaator on tasuta?
Jah, see on täiesti tasuta, ilma registreerimiseta ja piiranguteta. Iga muster luuakse brauseris, seega saad neid teha ja kopeerida nii palju kui soovid, isegi võrguühenduseta, kui leht on korra laaditud.
Kas mustrid on tõesti õmbluseta?
Jah. Iga kuju on joonistatud nii, et selle servad ühtivad täpselt naaberplokiga, ja muster kordub kindlal ruudustikul. Nii CSS-i background-image kui ka SVG <pattern>-element seovad plokid servast servani, ilma nähtavate õmblusteta.
Kas kasutada CSS- või SVG-väljundit?
Kasuta CSS-i, kui soovid korduva tausta kleepida otse laaditabelisse - see on veebilehtede jaoks kiireim viis. Kasuta SVG allalaadimist, kui vajad eraldiseisvat faili, näiteks graafilise elemendina, disainitööriistas või otse HTML-i sisestatuna.
Miks kasutada SVG mustrit PNG asemel?
SVG on vektorvorming, seega jääb see igal suumitasemel ja ekraani tihedusel täiesti teravaks ega lähe kunagi piksliliseks. Geomeetriline SVG-plokk kaalub tavaliselt vaid mõnisada baiti, mis on palju vähem kui sarnane PNG, ja värve saab igal ajal muuta ilma uuesti eksportimata.
Kas saan tausta läbipaistvaks muuta?
Jah. Märgi valik Läbipaistev ja taustatäide kaob, nii et muster näitab ainult esiplaani kujundeid. See võimaldab asetada mustri olemasoleva värvi, pildi või ülemineku peale.
Kas mu kujundus laaditakse kuhugi üles?
Ei. Kogu muster luuakse kohapeal sinu brauseris lihtsa SVG-märgistusega ja midagi ei saadeta serverisse, seega jäävad su värvid ja seaded sinu seadmesse privaatseks.