SVG-Platzhalterbilder selbst erstellen
Der SVG-Platzhalter-Generator erzeugt einfache Platzhalterbilder als SVG – mit frei wählbarer Größe, Farbe und Beschriftung. Anders als geladene Platzhalterdienste entsteht das Bild als kompakter Vektor-Code, den du direkt einbetten kannst, ohne einen externen Request. Ideal für Mockups, Prototypen und Layouts, in denen das finale Bild noch fehlt. Die Erzeugung läuft vollständig im Browser.
Typische Anwendungsfälle
- Mockups und Wireframes: Fülle Bildbereiche in Entwürfen mit maßgenauen Platzhaltern, die Größe und Position zeigen.
- Schnelles Prototyping: Ersetze fehlende Assets durch leichte SVGs, ohne externe Dienste oder Bilddateien.
- Ladezustände: Nutze einen schlichten Platzhalter, bis das echte Bild nachgeladen ist.
- Dokumentation und Demos: Zeige Beispiel-Layouts mit beschrifteten Boxen statt urheberrechtlich geschützter Bilder.
So erstellst du einen Platzhalter
- 1 Lege Breite und Höhe des Platzhalters fest.
- 2 Wähle Hintergrund- und Textfarbe sowie einen optionalen Beschriftungstext.
- 3 Sieh dir die Vorschau des SVG an.
- 4 Kopiere den SVG-Code oder die Data-URI in dein Projekt.
Warum SVG statt Pixelbild?
Ein SVG-Platzhalter ist winzig, skaliert verlustfrei auf jede Größe und lässt sich ohne separaten HTTP-Request direkt in HTML oder CSS einbetten. Das hält Prototypen schnell und unabhängig von externen Diensten, die später ausfallen könnten. Da der Code als Vektor vorliegt, kannst du Farbe oder Text bei Bedarf direkt im Markup anpassen. Alles wird lokal erzeugt – es werden keine Bilder hochgeladen oder von fremden Servern geladen.