Platshållarbild i SVG med önskade mått

Hjälper designers och utvecklare under arbetet med en skiss när en bild med exakta mått behövs för att prova layouten.

Generera en SVG med önskade mått för en layoutskiss eller ett gränssnittstest. Du får en platshållarbild som passar det avsedda utrymmet.

Så använder du

Ange bredden du behöver på första raden och sedan höjden på den andra.
Skriv en valfri text på tredje raden om du vill visa den inuti den genererade bilden.
Kör genereringen för att skapa SVG i den begärda storleken.
Kopiera koden från resultatområdet och klistra in den i din sida eller designfil.
Ändra värdena och generera igen så många gånger du behöver.

Exempel

Exemplet begär en bredd på 800, en höjd på 450 och texten Banner. Efter genereringen, kontrollera att utdata verkligen är SVG-markering och att måtten matchar det du angav, eftersom dessa värden avgör hur mycket plats platshållaren tar i din layout.

Indata

800
450
Banner

Gränser och format

Utdata är en vektorteckning, inte ett fotografi, så den hör hemma i mockuper snarare än i färdig grafik.
Allt kommer från det du anger: storleken och, valfritt, en text.
Håll bredd och höjd som positiva heltal.
Titta på hur den renderas i din webbläsare innan du lägger till den på en aktiv sida.

Var bearbetningen sker

Vektorbilden beskrivs och sätts samman av sidan inuti din webbläsare, med hjälp av storleken och texten du anger. Ingen fil laddas upp och inget överförs under genereringen. Markeringen finns kvar på skärmen tills du rensar den eller lämnar sidan.

Vanliga frågor

Vad används en platshållarbild egentligen till?

Den ersätter grafik som ännu inte är klar. Du kan se om en layout håller ihop och om de planerade proportionerna ser rätt ut, utan att vänta på den slutliga bilden från en designer eller fotograf.

Vad innehåller den genererade SVG:n?

Den beskriver en ram i den storlek du angav, plus texten du skrev om du skrev någon. Inget annat läggs till, så du vet alltid vad koden innehåller innan du klistrar in den någonstans.

Bör jag behålla den på en aktiv webbplats?

Behandla den hellre som ett mockupverktyg, eftersom den signalerar att en bild fortfarande saknas. Byt ut den mot den slutliga bilden före publicering, annars ser besökarna platshållaren i stället för en bild.