Skip to content

Alles für WordPress, Webentwicklung — und mehr

🎨 14 Platzhalter-Dienste für das Frontend: Was 2026 funktioniert

🎨 14 Platzhalter-Dienste für das Frontend: Was 2026 funktioniert

Übersichtsillustration zu Platzhalterdiensten für die Frontend-Entwicklung

Sie erstellen ein Layout, fügen die übliche Platzhalter-URL ein, und es lädt nicht. Der Browser überschwemmt Sie mit Mixed-Content-Warnungen, der Tab hängt eine halbe Minute lang. Kommt Ihnen das bekannt vor?

Platzhalter-Dienste aus den frühen 2010er-Jahren sterben still und leise: Domains werden nicht verlängert, TLS-Zertifikate laufen ab, Rate-Limits drosseln die Anfragen. Das eine Stunde vor einer Deadline festzustellen, macht überhaupt keinen Spaß.

Wir haben 14 aktive Tools manuell getestet: von farbigen Rechtecken über KI-Generierung bis hin zu deterministischen Avataren. Jedes einzelne unterstützt HTTPS, hält eine stabile Verfügbarkeit aufrecht und lässt Sie nicht im Stich, wenn das Backend noch nicht bereit ist, Sie das Layout aber bereits zeigen müssen.

💡 Kurzüberblick:

  • Typologie: Farbblöcke, Fotofüller, SVG mit Edge-Auslieferung, Avatare, Geräte-Mockups und KI-Generierung; für jede Aufgabe gibt es ein Werkzeug.
  • Geschwindigkeit: placeholders.dev und placeholdr.dev laufen auf Cloudflare Workers und liefern Inhalte vom nächstgelegenen Edge-Standort aus.
  • Sicherheit: Alle 14 Dienste funktionieren über HTTPS. Keinerlei Mixed-Content-Warnungen.
  • Einsatzfertiger Code: Jeder Dienst stellt eine URL-Vorlage bereit, die Sie in Sekunden in <img src> kopieren und einfügen können.

Auswahlkriterien: Was einen Dienst für funktionsfähige Mockups geeignet macht

Die Parameter, anhand derer wir jedes Tool bewertet haben:

  • Ausschließlich HTTPS. Mixed Content ist 2026 ein Warnsignal. Dienste ohne TLS haben es nicht auf die Liste geschafft.
  • CDN** oder Edge-Auslieferung.** Globale Abdeckung bedeutet niedrige Latenz von jedem Standort aus.
  • Aktive Wartung. Aktuelle Commits oder Updates innerhalb des letzten Jahres.
  • Vorhersagbare URL-Syntax. Das Muster sollte auf den ersten Blick ersichtlich sein, ohne Dokumentation lesen zu müssen.
  • Moderne Formate. WebP, AVIF, SVG; ohne sie kann ein Dienst nicht konkurrieren.

Vergleichstabelle

Bedarf

Beste Wahl

Format

CDN

Farbblöcke mit Text

Placehold.co

SVG, WebP, PNG

Ja

Fotofüller für Mockups

Lorem Picsum

JPEG, WebP

Ja

Spezifische Größen und Voreinstellungen

DummyImage

PNG, JPEG, GIF

Nein

Geschwindigkeit und Schärfe

placeholders.dev

SVG

Edge

Benutzer-Avatare

DiceBear

SVG

Ja

Avatare mit Initialen

UI Avatars

PNG, SVG

Ja

Geräte-Mockups

Placeit

PNG, JPEG

Ja

Thematische Platzhalter

ASSETS.SO

JPEG, PNG

Ja

KI-Bildgenerierung

placeholdr.dev

JPEG, WebP

Edge

1. Placehold.co: Der Goldstandard für Farbblöcke

Screenshot des Dienstes Placehold.co mit farbigen Blöcken

Angetreten, um das unzuverlässige via.placeholder.com zu ersetzen, und zur Standardwahl geworden. HEX-Farben, Google Fonts, Größe: Alles steht in der URL. SVG, WebP, PNG. Das Muster ist auf den ersten Blick offensichtlich: /600x400/EEE/31343C?text=Hero+Image.

Vorteile:

  • SVG, WebP, PNG: drei Formate in einem Dienst.
  • HEX-Farben und Google Fonts direkt im Query-String.
  • Stabiles CDN mit minimaler Latenz.

Nachteile:

  • Nur Farbblöcke. Der Dienst generiert keine Fotos.
1<img src="https://placehold.co/600x400" alt="Placeholder">
2<img src="https://placehold.co/600x400/EEE/31343C?text=Hero+Image" alt="Hero">
3<img src="https://placehold.co/600x400.webp" alt="WebP format">

🔗 Placehold.co

2. Lorem Picsum: Fotofüller für realistische Mockups

Screenshot des Dienstes Lorem Picsum mit Beispielbildern für Prototypen

„Lorem Ipsum, aber für Bilder." Liefert echte Fotos aus seiner Datenbank, perfekt, wenn farbige Quadrate fehl am Platz wirken. Der seed-Parameter fixiert ein Bild, unschätzbar wertvoll für UI-Tests.

Filter (grayscale, blur) sorgen für zusätzliche Flexibilität. Keine Quellenangabe erforderlich.

Vorteile:

  • Hochwertige Fotos für Mockups, kein Stock-Müll.
  • Weichzeichner- und Graustufenfilter.
  • seed für Wiederholbarkeit bei jeder Anfrage.

Nachteile:

  • Keine präzise Kontrolle über den Bildinhalt. Sie bekommen, was eben im Bildausschnitt gelandet ist.
1<img src="https://picsum.photos/800/600" alt="Random photo">
2<img src="https://picsum.photos/seed/product/400/300" alt="Fixed photo">
3<img src="https://picsum.photos/800/600?grayscale&blur=2" alt="Filtered">

🔗 Lorem Picsum

3. DummyImage: Voreinstellungen für jede Aufgabe

Screenshot des Dienstes DummyImage mit Größenvorgaben

Der Dienst mit der umfangreichsten Anpassung für Textplatzhalter. Das Hauptmerkmal sind Dutzende Voreinstellungen: Werbeformate (Leaderboard, Wide Skyscraper), Seitenverhältnisse (16:9, 4:3), gängige Auflösungen. Hintergrund- und Textfarben via HEX, Formate PNG, JPEG, GIF.

Kein CDN, daher hängt die Geschwindigkeit vom Standort ab. Für die lokale Entwicklung nicht kritisch.

Vorteile:

  • Dutzende Voreinstellungen für Anzeigen, Bildschirme und Standardlayouts.
  • Volle Kontrolle über Hintergrund- und Textfarbe.

Nachteile:

  • Kein CDN. Die Latenz ist von Australien oder Japan aus spürbar.
1<img src="https://dummyimage.com/728x90/000/fff" alt="Leaderboard ad">
2<img src="https://dummyimage.com/16:9x1080" alt="HD ratio">

🔗 DummyImage

4. Placeholders.dev: SVG von Edge-Servern

Screenshot des Dienstes placeholders.dev mit SVG-Platzhalter

Läuft auf Cloudflare Workers und liefert SVG von Edge-Servern aus. „Super schnell" ist hier kein Marketingsprech: Die Auslieferung vom nächstgelegenen Cloudflare-Standort bedeutet Latenzzeiten im einstelligen Millisekundenbereich. SVG sorgt für perfekte Schärfe auf Retina-Displays bei jeder Skalierung.

Vorteile:

  • On-the-fly-Generierung über Cloudflare Workers.
  • Schärfe auf jedem Bildschirm dank SVG.
  • Edge-Auslieferung vom nächstgelegenen Netzwerkstandort.

Nachteile:

  • Nur SVG. Rasterformate werden nicht unterstützt.
1<img src="https://images.placeholders.dev/?width=400&height=300&bgColor=%23f0f0f0&textColor=%23333" alt="SVG placeholder">

🔗 placeholders.dev

5. DiceBear: Deterministische Avatare

Screenshot des Dienstes DiceBear mit Avatar-Stilsammlung

Generiert Avatare nach dem Prinzip „ein Seed, ein Ergebnis". Übergeben Sie eine E-Mail-Adresse oder einen Benutzernamen und Sie erhalten bei jeder Anfrage denselben Avatar. Unverzichtbar für Benutzerlisten und Admin-Panels: Inhalte wirken befüllt, ohne den Aufwand echter Fotos.

Mehr als zwanzig Stile, von Pixel-Art bis zu realistischen Gesichtern. Alles in SVG. Die API ist offen.

Vorteile:

  • Zwei Dutzend Avatar-Stile.
  • Deterministische Generierung: Der Seed garantiert Wiederholbarkeit.
  • SVG für perfekte Skalierung.

Nachteile:

  • Nur SVG. Für Raster-Avatare benötigen Sie einen zusätzlichen Konverter.
1<img src="https://api.dicebear.com/9.x/avataaars/[email protected]" alt="User avatar">

🔗 DiceBear

6. UI Avatars: Initialen statt Bilder

Screenshot des Dienstes UI Avatars mit Initialen-Avatar-Beispielen

Erzeugt Avatare mit Benutzerinitialen auf farbigem Hintergrund. Ideal für Kommentare, Chats und Admin-Panels, wo keine Fotos nötig sind, aber gesichtslose graue Kreise stören. Größe, Schriftart, Hintergrund- und Textfarbe lassen sich vollständig über URL-Parameter steuern.

Der Dienst ist vollständig offen: Quellcode auf GitHub, eine eigene Instanz ist in 10 Minuten aufgesetzt. Ein deutliches Plus für Projekte mit Datenschutzanforderungen.

Vorteile:

  • Initialen statt Bilder mit sofortigem Laden.
  • Volle Kontrolle über Hintergrundfarbe, Textfarbe und Schriftart.
  • Open Source auf GitHub.

Nachteile:

  • Ausschließlich Text auf farbigem Hintergrund. Illustrationen werden nicht unterstützt.
1<img src="https://ui-avatars.com/api/?name=John+Doe&size=128&background=0D8ABC&color=fff" alt="JD Avatar">

🔗 UI Avatars

7. Lorem Flickr: Fotos mit Creative-Commons-Lizenz

Screenshot des Dienstes Lorem Flickr mit einem Flickr-Foto

Durchsucht Flickr nach Creative-Commons-lizenzierten Fotos und liefert sie als Platzhalter aus. Im Vergleich zu Lorem Picsum erhalten Sie hier mehr „Schnappschüsse" und weniger gestellte Kompositionen. Die Qualität schwankt, aber für Mockups, bei denen Authentizität zählt, ist das ein Vorteil.

Der Parameter lock fixiert das Bild. Die Stichwortsuche grenzt die Auswahl ein.

Vorteile:

  • Stichwortsuche.
  • lock für Bildpersistenz.
  • Creative Commons mit transparenter Lizenzierung.

Nachteile:

  • Unberechenbare Qualität: vom Meisterwerk bis zum unscharfen Schnappschuss.
1<img src="https://loremflickr.com/1280/720" alt="Flickr Image">

🔗 Lorem Flickr

8. Placeit: professionelle Geräte-Mockups

Screenshot der Plattform Placeit mit Geräte-Mockup-Vorlagen

Eine Plattform von Envato mit nahezu 3000 Mockup-Vorlagen: iPhone, Samsung, Desktops, Laptops, Tablets. Der Dienst ist kostenpflichtig (Envato-Abonnement), aber für die Präsentation von Designs vor Kunden oder im Portfolio liefert er Ergebnisse, die von Studio-Renderings nicht zu unterscheiden sind.

Drag-and-drop: Screenshot hochladen, Gerät auswählen, herunterladen. Für kommerzielle Präsentationen rechnet sich das sofort.

Vorteile:

  • Nahezu 3000 Geräte- und Szenarienvorlagen.
  • Drag-and-drop-Oberfläche, die keine Designkenntnisse erfordert.

Nachteile:

🔗 Placeit

9. ASSETS.SO: thematische Platzhalter mit Charakter

Screenshot des Dienstes ASSETS.SO mit thematischen Platzhaltern

Ergänzt den Arbeitsalltag eines Entwicklers um Kontext. Kategorien: Spiele, Filme, Musik, Sport, Schuhe. Eine Filmseite mit echten Standbildern wirkt überzeugender als ein Mockup mit farbigen Platzhaltern. Die API ist einfach: /game.jpg?w=1280&h=720.

Vorteile:

  • Themenkategorien für verschiedene Nischen.
  • Extrem einfache API.

Nachteile:

  • Minimale Kontrolle über die Inhalte.
1<img src="https://via.assets.so/game.jpg?w=1280&h=720" alt="Game Asset">

🔗 ASSETS.SO

10. RoboHash: Roboter-Avatare für Testdaten

Screenshot des Dienstes RoboHash mit Roboter-Avatar-Beispielen

Generiert aus beliebigem Text einzigartige Roboter. Das Prinzip ist dasselbe wie bei DiceBear (deterministische Generierung), jedoch mit Charakter: Jeder Roboter erhält seinen eigenen Ausdruck und ein eigenes Farbschema. Stile: klassische Roboter, Monster, Roboter-Katzen.

Geeignet für Prototypen, bei denen Sie Testprofilen Persönlichkeit verleihen möchten.

Vorteile:

  • Deterministische Generierung aus Text.
  • Drei Stile: Roboter, Monster, Katzen.
  • Open Source.

Nachteile:

  • Nur PNG. SVG wird nicht unterstützt.
1<img src="https://robohash.org/[email protected]" alt="Robot avatar">

🔗 RoboHash

11. Bacon Mockup: Speck in jeder Auflösung

Screenshot des Dienstes Bacon Mockup mit Speck-Bild

Köstliche Speckbilder in jeder Auflösung. Für Restaurant-Websites, Food-Blogs oder um Kollegen einen Streich zu spielen. Klingt nach einem Scherz, aber der Dienst läuft seit mehreren Jahren stabil.

Hohe Auflösung, einfache API. Nische, aber einprägsam.

Vorteile:

  • Hochauflösende Fotos.
  • Extrem einfache API.

Nachteile:

  • Enges Thema. Außerhalb von Food-Projekten nutzlos.
1<img src="https://baconmockup.com/1280/720" alt="Bacon">

🔗 Bacon Mockup

12. Placebeard.it: Markanz in jedem Pixel

Screenshot des Dienstes Placebeard.it mit dem Foto eines bärtigen Mannes

Die Antwort auf placekitten, etwas Bodenständigeres und Maskulineres. Farb- oder Schwarzweißfotos von bärtigen Menschen in beliebigen Proportionen. Für Barbershops, Herrenbekleidung und Hipster-Startups. Graustufen werden unterstützt. Der Dienst läuft seit Langem stabil.

Vorteile:

  • Themenbezogene Fotos, ideal für das männliche Segment.
  • Graustufen-Unterstützung.

Nachteile:

  • Enges Thema. Für weibliche Zielgruppen nicht geeignet.
1<img src="https://placebeard.it/1280x720" alt="Beard">

🔗 Placebeard.it

13. Placebear: rohe Naturgewalt

Screenshot des Dienstes Placebear mit einem Bärenfoto

Große, pelzige und manchmal gefährliche Platzhalter. Hervorragend geeignet, um die Darstellung bei Bildern mit komplexen Texturen zu testen: Fell, Gras und Rinde liefern reichhaltiges Material für die Prüfung von Komprimierung und Größenanpassung.

Hochauflösende Fotos, stabile Verfügbarkeit. Nicht für jedes Projekt geeignet, aber es lohnt sich, den Dienst in den Lesezeichen zu behalten.

Vorteile:

  • Hochauflösende Fotos.
  • Stabile Verfügbarkeit.

Nachteile:

  • Spezifischer Inhalt. Nicht jeder Kunde wird einen Bären in seinem Mockup zu schätzen wissen.
1<img src="https://placebear.com/1280/720" alt="Bear">

🔗 Placebear

14. Placeholdr.dev: KI-Platzhaltergenerierung

Screenshot des KI-Dienstes placeholdr.dev mit Bildgenerierungsbeispielen

Der jüngste Akteur in dieser Nische: KI-Generierung mittels Flux-Diffusionsmodell auf Cloudflare Workers mit R2-Caching. Die erste Anfrage benötigt einige Sekunden für die Darstellung; nachfolgende werden sofort aus dem Cache ausgeliefert.

URL-Format: /{width}x{height}/{prompt}. Stile: photographic, artistic, anime, oil-painting, 3d-render, cartoon. seed (1-3) fixiert die Variante. Kostenlos, keine Registrierung erforderlich.

Vorteile:

  • KI-Generierung: natürlichsprachliche Beschreibungen statt HEX-Codes.
  • Sechs Stile, von Fotorealismus bis 3D-Rendering.
  • Edge-Auslieferung über Cloudflare Workers.

Nachteile:

  • Erste Anfrage langsam (mehrere Sekunden für die Darstellung).
  • Junger Dienst (Start im Januar 2026); langfristige Stabilität ist ungewiss.
1<img src="https://placeholdr.dev/600x400/minimalist modern office" alt="AI-generated office">
2<img src="https://placeholdr.dev/320x320/cat?style=anime" alt="AI anime cat">
3<img src="https://placeholdr.dev/1024x768/camera?style=3d-render&seed=3" alt="AI 3D camera">

🔗 placeholdr.dev

Technische Überlegungen: CSP, Offline-Modus und warum alte URLs sterben

Content-Security-Policy-Header

Wenn Ihre Website eine strikte CSP verwendet, werden externe Platzhalterdienste vom Browser standardmäßig blockiert. Aktualisieren Sie die img-src-Direktive:

1Content-Security-Policy: img-src 'self' https://placehold.co https://picsum.photos;

Wichtig: Entfernen Sie diese Domains aus der CSP, bevor Sie in Produktion gehen. Platzhalter sind für die Entwicklung gedacht, nicht für Live-Websites.

Lokale Entwicklung ohne Internet

Für die Offline-Entwicklung oder Projekte mit Datenschutzanforderungen:

  • Clientseitige Platzhaltergenerierung via Canvas oder SVG.
  • Lokales Generator-Skript in Node.js.
  • Statische Platzhalterdateien im Repository.

Warum alte URLs sterben

Die meisten Dienste aus den frühen 2010er-Jahren waren Nebenprojekte: gestartet, ein paar Jahre gepflegt, dann aufgegeben. Die Domain läuft aus, das Zertifikat verfällt und die URL verwandelt sich in einen Kürbis. Wählen Sie Dienste mit aktuellen Commits und kommerziellem Support.

⁉️🤔 Häufig gestellte Fragen

Kann ich Platzhalter in der Produktion verwenden?

Nein. Platzhalterdienste sind ausschließlich für Entwicklung und Prototyping gedacht. Anfragelimits, Ausfallzeiten, Latenz unter Last. Ersetzen Sie Platzhalter vor dem Release durch echte Assets.

Warum überleben manche Dienste jahrelang, während andere nach ein paar Saisons sterben?

Der Unterschied liegt im Support-Modell. Kommerzielle oder gesponserte Dienste verfügen über dedizierte Ressourcen und erhalten regelmäßige Updates. Solo-Nebenprojekte laufen auf Enthusiasmus-Basis. Prüfen Sie die Commit-Historie: Liegt der letzte drei Jahre zurück, suchen Sie nach einer Alternative.

Wie fixiere ich dasselbe Bild bei jedem Neuladen?

Verwenden Sie den seed-Parameter. Lorem Picsum: /seed/product/400/300. DiceBear: [email protected]. RoboHash: beliebiger Text in der URL. placeholdr.dev: ?seed=1 (drei Varianten). Ein Seed liefert immer ein Ergebnis.

Muss ich die CSP für Platzhalter aktualisieren?

Ja. Wenn Ihre Website Content-Security-Policy-Header konfiguriert hat, fügen Sie die Dienst-Domains zur img-src-Direktive hinzu, andernfalls blockiert der Browser das Laden. Vergessen Sie nicht, sie vor dem Deployment zu entfernen.

Beeinträchtigen externe Platzhalter die lokale Entwicklungsgeschwindigkeit?

Jeder <img>-Tag mit einer externen URL erzeugt eine HTTP-Anfrage. Dienste mit CDN und Edge arbeiten schnell, aber für vollständige Autonomie halten Sie einen Satz statischer Platzhalter in Ihrem Repository vor.

Welches Format eignet sich am besten für Platzhalter?

SVG für geometrische Formen und Text: minimales Gewicht, perfekte Skalierung. WebP für Foto-Platzhalter: spürbar leichter als JPEG bei gleicher Qualität. PNG, wenn Sie Transparenz benötigen. AVIF, wenn die Browser Ihrer Zielgruppe es unterstützen.

Kann ich Bilder dieser Dienste in kommerziellen Mockups verwenden?

Die meisten Dienste stellen Inhalte kostenlos und ohne Namensnennung bereit. Flickr-basierte Dienste arbeiten mit Creative Commons; prüfen Sie die Lizenz für jedes Foto. Placeit erfordert ein Envato-Abonnement für Downloads ohne Wasserzeichen.

Was Sie bookmarken sollten: die finale Übersicht der Platzhalter 2026

Unsere Empfehlungen für die tägliche Arbeit: Placehold.co für farbige Blöcke, Lorem Picsum für Foto-Mockups und DiceBear für Avatare. Diese drei Dienste decken die große Mehrheit aller Aufgaben ab.

Benötigen Sie Geschwindigkeit auf Retina? placeholders.dev mit Edge-SVG. Wollen Sie kontextbezogene Visuals, ohne Stock-Seiten zu durchsuchen? placeholdr.dev mit KI-Generierung. Bereiten Sie eine kommerzielle Präsentation vor? Placeit mit seinen dreitausend Mockups.

Die wichtigste Regel bleibt unverändert: Platzhalter leben auf dem Dev-Server. Ersetzen Sie vor dem Deployment jede externe URL durch ein echtes Asset. Halten Sie zwei oder drei Backup-Dienste als Lesezeichen bereit; was gestern funktionierte, könnte morgen offline sein.