Lorem Picsum

Beide liefern ein wiederholbares Bild, funktionieren aber unterschiedlich. Eine Bild-ID ruft genau ein Foto aus dem Picsum-Katalog ab, der von #1 bis #1084 reicht — die URL wird zu picsum.photos/id/237/640/480, und genau dieses Bild lädt jedes Mal. Ein Seed ist ein beliebiger Textstring, den du wählst, etwa dein Projektname; Picsum hasht ihn über einen /seed/deintext/-Pfad in ein konsistentes Zufallsfoto. Der entscheidende Unterschied ist Kontrolle versus Bequemlichkeit: Eine ID garantiert ein bekanntes Bild, das du bereits gesehen hast, während ein Seed dasselbe Zufallsfoto für jedes Teammitglied garantiert, ohne dass du eines auswählen musst. Nutze eine ID, wenn ein bestimmtes Bild wichtig ist, und einen Seed, wenn Mockups einfach aufhören sollen, bei jedem Neuladen durchzuwechseln. Dieses Tool baut dir beide URL-Varianten und zeigt das Ergebnis sofort in der Vorschau.

Picsum wendet Effekte über URL-Parameter an, und dieses Tool setzt sie für dich per Schalter und Regler. Für Schwarz-Weiß hängt es ?grayscale an den Link an, was zu etwas wie picsum.photos/800/600?grayscale führt. Für Weichzeichnung fügt es ?blur=N hinzu, wobei N eine Stufe von 1 bis 10 ist — höhere Zahlen weichen das Bild stärker auf, sodass ?blur=5 moderat und ?blur=10 stark verwaschen ist. Aktivierst du beides, kombinieren sie sich in einem einzigen Query-String. Diese Effekte eignen sich für Low-Fidelity-Wireframes, gedämpfte Hintergrundtexturen hinter Text oder um zu prüfen, ob überlagerte Bildunterschriften vor einem unruhigen Foto lesbar bleiben. Klicke hier den Graustufen-Schalter um oder ziehe den Weichzeichner-Regler, und Live-Vorschau sowie copy-ready Snippet aktualisieren sich sofort, sodass du die exakte URL in dein Markup einfügen kannst.

Die Angabe von Breite und Höhe sagt dem Browser, wie viel Platz ein Bild einnehmen wird, bevor es fertig geladen ist. Ohne diese Angaben kennt der Browser die Bildgröße nicht, sodass umliegender Content beim Laden des Fotos springt — ein Problem, das über den Cumulative Layout Shift (CLS) gemessen wird, einen von Googles Core Web Vitals. Indem du vorab den richtigen Platz reservierst, hältst du das Layout stabil und schützt deinen CLS-Wert, was auch dann noch zählt, wenn die finale Fotografie deine Platzhalter irgendwann ersetzt. Deshalb liefert das HTML-Snippet dieses Tools bereits passende width- und height-Attribute mit, zusammen mit loading="lazy", und die Next.js-Ausgabe enthält die width- und height-Props, die next/image benötigt. Generiere deinen Platzhalter hier, und das copy-ready Markup trägt die richtigen Abmessungen automatisch mit sich — so entwickelst du schon in der Prototyp-Phase gute Layout-Gewohnheiten.

Ja. Über ein einzelnes Bild hinaus erstellt die Batch-Galerie mit einem Klick mehrere Platzhalter — wähle 4, 6, 9 oder 12, oder lege jede beliebige Anzahl bis 24 fest. Du kannst alle Bilder auf dieselben Abmessungen setzen für ein einheitliches Grid, oder das Tool sie über gängige Seitenverhältnisse variieren lassen, um den gemischten Content zu simulieren, den ein echtes Masonry- oder Card-Layout enthalten würde. Genau diese Vielfalt deckt Layout-Probleme frühzeitig auf: wie Karten bei unterschiedlichen Formaten umbrechen, wo Lücken entstehen und ob eine Reihe auf Mobilgeräten genug Raum hat. Jede Karte in der Galerie ist unabhängig — aktualisiere sie für ein neues Foto, lege sie auf einen Seed fest, damit sie sich nicht mehr ändert, öffne sie in einem neuen Tab, lade sie als JPEG herunter oder entferne sie. Es ist der schnellste Weg, ein Prototyp-Grid mit realistischen Bildern statt grauer Boxen zu füllen.

Beide liefern echte Fotografien als Platzhalter, aber aus unterschiedlichen Quellen mit unterschiedlichen Kontrollmöglichkeiten. Der Standard-Picsum-Modus greift auf den picsum.photos-Katalog kuratierter Bilder zurück, nummeriert von #1 bis #1084, unterstützt exakte Bild-IDs und Seeds für wiederholbare Ergebnisse und akzeptiert Graustufen- und Weichzeichner-Parameter. Der Unsplash-Source-Modus lädt aus Unsplashs größerer, vielfältigerer Bibliothek und ist praktisch, wenn du frisch und thematisch wirkende Fotografie oder ein anderes visuelles Gefühl möchtest. In der Praxis wählst du Picsum, wenn du ein bestimmtes, reproduzierbares Bild oder eine bekannte Katalog-ID brauchst, und wechselst zu Unsplash, wenn du mehr Vielfalt willst und kein exaktes Foto festlegen musst. Beide Optionen bauen die URL in deinem Browser zusammen, während die eigentlichen Bilder von diesen externen CDNs kommen. Schalte in diesem Tool zwischen beiden Diensten um und kopiere die URL, die zu deinem Mockup passt.