Kā izveidot precīza izmēra viettura attēlu?

Ievadiet Platums (px) un Augstums (px), izvēlieties krāsas vai Krāsu tēma, pēc tam noklikšķiniet uz Lejupielādēt PNG, Lejupielādēt JPG vai Lejupielādēt SVG. Pēc noklusējuma attēlā kā etiķete tiek rādīti tā izmēri, piemēram, 800 x 600.

Kāds ir lielākais viettura attēls, ko varu ģenerēt?

Platumam un augstumam katram jābūt no 1 līdz 4000 pikseļiem. Vērtības ārpus šī diapazona parāda kļūdu Platums un augstums jābūt no 1 līdz 4000 px.

Kā ievietot viettura attēlu tieši HTML bez faila?

Noklikšķiniet uz Kopēt kā datu URL un ielīmējiet to img tagā kā src vērtību. Varat arī izmantot Kopēt HTML fragmentu vai Kopēt CSS fonu. Nav nepieciešams ārējs attēlu mitinātājs.

Vai es varu ģenerēt standarta sociālo tīklu vai tīmekļa izmērus?

Jā. Iepriekšnoteiktie izmēri ietver Instagram ieraksts, Instagram stāsts, Twitter kartīte, Open Graph, YouTube sīktēla attēls, Facebook vāks un E-pasta galvene. Lejupielādēt visus iepriekšiestatījumus (ZIP) saglabā visus vienpadsmit kā PNG failus.

Kā uz viettura attēla ievietot savu tekstu vai diagonālas līnijas?

Ievadiet etiķeti laukā Pielāgots teksts, piemēram, 'Hero image', tā vietā, lai rādītu izmērus. Atzīmējiet Rādīt diagonālās līnijas (X), lai uzzīmētu vieglas diagonāles. Garš teksts automātiski samazinās, lai ietilptu platumā.

Vai tas tiešām ir bezmaksas?

Jā. Katrs rīks ir bezmaksas, bez konta un kredītkartes. Darbs notiek jūsu ierīcē, nevis mūsu serveros, tāpēc tas ir bezmaksas.

Vai tas darbojas mobilajā ierīcē?

Jā. Tas darbojas mūsdienu mobilajos pārlūkos iOS un Android ierīcēs, nekas nav jāinstalē.

🖼️

Viettura attēla ģenerētājs bez maksas

Ģenerē krāsainus viettura attēlus ar pielāgotiem izmēriem, tekstu un krāsām. Standarta izmēri sociālajiem medijiem, imitācijām un dizaina kompozitiem.

Darbojas pārlūkprogrammāBez reģistrācijas, bez uznirstošiem logiemNav nepieciešama pieteikšanāsBezmaksas uz visiem laikiem

Platums (px)

Augstums (px)

Iepriekšnoteiktie izmēri

Krāsu tēmas

Fons

Teksts / līnijas

Pielāgots teksts (atstājiet tukšu izmēriem)

Rādīt izmērus, ja nav pielāgota tekstaRādīt diagonālās līnijas (X)

💡 HTML maketiem: izmantojiet opciju 'Kopēt kā datu URL' un ielīmējiet <img src="..."> iebūvētiem vietturu attēliem. Figma / Sketch dizainiem lejupielādējiet PNG un ievelciet iekšā.

Biežākie lietojumi

Viettūra attēli dizaina makietiemĢenerējiet lieluma krāsu kastes izmantošanai Figma, Sketch vai tīmekļa vietnes dizaina maketos pirms īsto attēlu ir gatavi.
Iegultie viettūra HTML maketiIzmantojiet "Kopēt kā datu URL", lai tiešā veidā iegultu viettūra attēlus HTML ātro maketu vietā.
Viettūra satura CMS spraugāmDemonstrējot CMS veidnes, izmantojiet viettūra attēlus, nevis faktisko saturu jutīgiem priekšskatījumiem.
Sociālo mediju attēlu veidnesĢenerējiet pareizi lieluma viettūra Instagram, Facebook, Twitter, LinkedIn ziņojumu veidnēm.
CSS izkārtojuma testa attēliĢenerējiet attēlus ar ekstremālo aspekta attiecību, lai stress-testētu reaģējošo CSS izkārtojumu.

Kā tas darbojas

Viss notiek jūsu pārlūkprogrammā, izmantojot HTML Canvas API un pašrakstītu SVG marķējumu — bez servera, bez augšupielādes, bez trešās puses pakalpojuma. Jūs iestatāt izmērus, krāsas un apzīmējuma tekstu, un rīks zīmē attēlu tieši uz audekla elementa reālajā laikā, tad to serializē PNG, JPEG vai SVG pēc pieprasījuma.

1
Konfigurējiet izmērus un krāsas
Ierakstiet platumu un augstumu (1–4000 px katru) vai izvēlieties vienu no vienpadsmit sagatavēm, kas aptver izplatītus sociālo mediju un dizaina izmērus. Izvēlieties fona un teksta krāsu no iebūvētajām tēmām vai ievadiet jebkuru heksadecimālo vērtību tieši; vietējais krāsu izvēlnieks un validēts teksta lauks paliek sinhronizēti.
2
Canvas API renderē priekšskatījumu uzreiz
React efekts izsauc drawPlaceholder() ar katru izmaiņu. Šī funkcija izmanto CanvasRenderingContext2D, lai aizpildītu taisnstūri ar fona krāsu, neobligāti uzzīmētu vājas diagonālas krustveida līnijas pie 15% necaurspīdīguma, tad izmērītu un centrētu jūsu apzīmējuma tekstu — automātiski samazinot fontu, līdz tas iekļaujas 90% audekla platuma.
3
Eksports kā PNG, JPEG vai SVG
PNG un JPEG lejupielādes izsauc canvas.toDataURL(), konvertē base64 rezultātu Blob atmiņā un izraisa lejupielādi — visu sinhroni lietotāja žesta iekšpusē, lai apmierinātu iOS Safari lejupielādes noteikumus. SVG eksports veido pašpietiekamu SVG virkni ar atbilstošu rect, neobligātām diagonālām līnijām un teksta elementu, tad to saglabā kā .svg failu.
4
Masveida eksports un kopēšanas saīsnes
Poga "Lejupielādēt visas sagataves" dinamiski importē JSZip, atkārtoti renderē katru no vienpadsmit sagataves izmēriem uz ekrāna neredzama audekla, izmantojot to pašu zīmēšanas funkciju, un iepako visus PNG vienā ZIP. Kopēšanas pogas rada PNG datu URL, iekļautu SVG img birku vai CSS background-image deklarāciju tūlītējai ielīmēšanai kodā.