Hoppa till innehåll
100% lokalt

Platshållarbildsgenerator

Generera snabbt en platshållarbildd med anpassade dimensioner, färger och text — som SVG, data: URI eller img-tag.

0
Utmatning

Platshållarbildsgenerator

Välj en bredd och höjd — eller ett vanligt bildformat som 16:9 eller 4:3 — och det här verktyget ritar omedelbar en platshållarbildd som du kan lägga in i en mockup, wireframe eller en plats i din kod där den verkliga bilden ännu inte är klar. Det renderas som SVG, så rutan förblir skarp i vilken storlek som helst och skaleras utan suddiga rastereffekter.

Ställ in en bakgrundsfarh och textfärg, och låt etiketten antingen visa de renderade dimensionerna (som "800×600") eller skriv en egen text — ett komponentnamn, en breakpoint, vad som helst som hjälper dig att skilja en platshållarbildd från en annan medan du bygger. Typsnittsfamilj och storlek är också justerbara, och om du rundar hörnen eller lägger till ett rutnät eller diagonala linjer får rutan det välkända "det här är en platshållare"-utseendet i stället för en enkel grå rektangel.

Välj hur resultatet kommer ut: rå SVG-kod att spara som fil, en procent-kodad data: URI eller en base64-version för en CSS-bakgrund eller en inline-bildkälla, eller en komplett img-tag som du kan klistra in direkt i HTML. Mycket stora dimensioner eller en opraktiskt långt etikett begränsas i stället för att låsa upp fliken eller skapa något som ingen kunde använda.

Allt ritas lokalt i din webbläsare när du ändrar ett alternativ — ingen bildd genereras på en server och ingenting du skriver laddas upp någonstans. Kopiera resultatet, ladda ner det som en .txt-fil, eller skicka det direkt till ett annat verktyg som SVG URL-kodaren eller färgkonvertern.

FAQ

Uppdateras bilden när jag ändrar alternativen?
Ja. Förhandsgranskningen återskapas direkt när du justerar bredd, höjd, färger, etiketten eller något annat alternativ.
Kan jag använda resultatet direkt som en bildkälla?
Ja. Välj data: URI- eller base64-formatet och klistra in resultatet direkt i en <img src="…"> eller CSS background-image.
Vad händer om jag ställer in ett bildformat och en höjd på samma gång?
Bildformatet vinner: höjden räknas om från bredden så att bilden behåller exakt det förhållandet.
Finns det en storleksgräns?
Bredd och höjd är begränsade till 4000px vardera, och en extremt långt anpassat etikett avvisas med ett meddelande som ber dig förkorta det, så verktyget försöker aldrig bygga en oanvändbar stor bild.
Laddas mina data upp någonstans?
Nej. Platshållarbilden genereras helt i din webbläsare — ingenting skickas till en server.