Zum Inhalt springen

Screenshots verschönern und Mockups erstellen

Setzen Sie einen Screenshot auf einen Farbverlauf, mit Schatten, abgerundeten Ecken und einem Browser- oder Geräterahmen – direkt in Ihrem Browser erstellt.

Screenshot hierher ziehen oder einfügenDrücken Sie Strg+V (⌘V), um direkt aus der Zwischenablage einzufügen
Screenshot auswählenAuf Ihrem Gerät verarbeitet – wird nicht hochgeladen
Läuft in Ihrem Browser · kein UploadSo funktioniert's

So verwenden Sie Screenshot verschönern

  1. 1

    Screenshot einfügen

    Drücken Sie direkt nach der Aufnahme auf dieser Seite Strg+V (⌘V) oder ziehen Sie eine Bilddatei hierher.

  2. 2

    Hintergrund wählen

    Wählen Sie einen Verlauf, Mesh, eine einfarbige Fläche, ein eigenes Foto oder Transparenz.

  3. 3

    Rahmen und Stil festlegen

    Fügen Sie einen Rahmen als Browser, Fenster, Laptop, Tablet oder Smartphone hinzu und passen Sie Abstand, Ecken, Schatten und Beschriftung an.

  4. 4

    Exportieren

    Wählen Sie eine Größenvorgabe sowie 1×, 2× oder 3× und laden Sie die PNG-Datei herunter oder kopieren Sie sie.

Limits und Pro

Einzelne Screenshots bis 25 MB mit allen Rahmen und Hintergründen, Export bis 8000 px auf der langen Seite bei 1×, 2× oder 3×, unbegrenzt und ohne Wasserzeichen.

Akzeptiert Quelldateien über 25 MB; es gibt keine Rahmen oder Stile nur für Pro. Pro ansehen

Über Screenshot verschönern

Der Screenshot-Verschönerer verpackt eine rohe Aufnahme in eine gestaltete Komposition und exportiert sie als PNG-Datei. Die Ausgabegröße ergibt sich aus Ihrem Screenshot, dem Rahmen und dem Abstand – eine Aufnahme mit 1280 × 800 in einem Browser-Rahmen mit dem Standardabstand wird bei 1× etwa 1510 × 1112 Pixel groß, bei 2× doppelt so groß. Die Vorgaben für 16:9, 1:1, 4:5, 9:16, X und LinkedIn erweitern die Fläche auf das Seitenverhältnis der jeweiligen Plattform, ohne das Bild zuzuschneiden. Exporte sind auf der langen Seite auf 8000 Pixel begrenzt. Ein transparenter Hintergrund ergibt eine PNG-Datei mit Alphakanal, die den Schatten weiterhin enthält.

Die Rahmen sind allgemeine Geräte und Fenster, die per Code in jeder Auflösung gezeichnet werden: ein Browser mit Adressleiste in Hell oder Dunkel, ein Desktop-Fenster mit Fensterknöpfen und Titel, ein Laptop mit Deckel und Unterteil, ein Tablet sowie Smartphone-Formen mit Insel oder Punch-Hole-Kamera. Zur Auswahl stehen 12 Farbverläufe in harmonischen Tönen und 6 Mesh-Verläufe, außerdem eine einfarbige Fläche oder ein Foto, wahlweise mit Weichzeichnen.

Das Tool eignet sich für Produktvorstellungen, Dokumentation, Versionshinweise, Beiträge in sozialen Netzwerken und Präsentationen. Es beschriftet nicht (keine Pfeile oder Hinweisfelder über der Aufnahme), nimmt den Bildschirm nicht selbst auf, und die Rahmen sind stilisiert und keine exakten Nachbildungen der Geräte eines Herstellers.

Datenschutz

Die gesamte Komposition wird in Ihrem Browser auf einer Zeichenfläche erzeugt, Ihre Datei verlässt Ihr Gerät also nie – Aufnahmen von Dashboards und unveröffentlichten Funktionen bleiben privat. Wenn Sie eine Beschriftung hinzufügen, wird deren Schriftart von Google Fonts geladen; diese Anfrage enthält keine Screenshot-Daten.

Funktionen

Gezeichnete Rahmen

Browser, Fenster, Laptop, Tablet und zwei Smartphone-Stile, in jeder Auflösung erzeugt.

Verlauf- und Mesh-Hintergründe

Von Material Design inspirierte Farbverläufe, Mesh-Mischungen, einfarbige Flächen oder Ihr eigenes Foto.

Vorgaben für soziale Netzwerke

Flächen für 16:9, 1:1, 4:5, 9:16, X und LinkedIn, die die Aufnahme nie zuschneiden.

Screenshot verschönern: Häufig gestellte Fragen

Wie sieht ein Screenshot professionell aus?
Geben Sie ihm Raum und Tiefe. Legen Sie ihn auf einen weichen Verlauf mit 8–12 % Abstand, runden Sie die Ecken leicht ab, fügen Sie einen dezenten Schatten hinzu und setzen Sie Aufnahmen von Websites in einen Browser-Rahmen mit Ihrer echten Adresse. Halten Sie den Hintergrund ruhig, damit die Oberfläche im Mittelpunkt bleibt, und exportieren Sie mit 2×, damit kleine Schrift scharf bleibt, wenn soziale Netzwerke das Bild verkleinern.
Welche Größenvorgabe passt für soziale Medien?
Nehmen Sie 16:9 für Beiträge auf X und YouTube-Vorschaubilder, LinkedIn für Beiträge im Linkstil mit 1,91:1, 1:1 oder 4:5 für Bilder im Instagram- und LinkedIn-Feed und 9:16 für Stories, Reels und Shorts. Mit Auto passt sich die Fläche einfach um Ihren gerahmten Screenshot an. Eine Vorgabe erweitert nur den Hintergrund, der Screenshot selbst wird also nie zugeschnitten oder gestaucht.
Kann ich mit transparentem Hintergrund exportieren?
Ja. Wählen Sie unter Hintergrund die Option Kein Hintergrund, dann behält die PNG-Datei einen Alphakanal, und nur der gerahmte Screenshot und sein weicher Schatten sind deckend. Das ist ideal, um das Bild auf einer farbigen Folie, in einem Abschnitt einer Landingpage oder in einer Designdatei zu platzieren. Auch beim Kopieren in die Zwischenablage bleibt die Transparenz in Apps erhalten, die sie unterstützen, etwa Figma, Keynote und die meisten Designprogramme.
Sind die Geräterahmen echte Produktbilder?
Nein. Jeder Rahmen wird vom Code des Tools aus Rechtecken, Kurven und Verläufen gezeichnet und nicht aus Grafiken von Herstellern übernommen. Deshalb lässt er sich auf jede Auflösung skalieren und enthält keine Markenbilder. Die Formen sind bewusst allgemein gehalten: ein Smartphone mit Aussparung im Inselstil oder Punch-Hole-Kamera, ein Laptop, ein Tablet, ein Desktop-Fenster und ein Browser.
Warum mit 2× oder 3× exportieren?
Displays mit hoher Pixeldichte zeigen zwei oder drei Gerätepixel pro CSS-Pixel, daher wirkt ein Bild mit 1× dort weich, und Plattformen wie X und LinkedIn verkleinern Uploads, was kleine Schrift weiter verwischt. Mit 2× haben Sie für beide Fälle genug Pixel bei vernünftiger Dateigröße, während sich 3× für Druck und sehr große Displays eignet. Der Faktor ändert die Pixelanzahl, nicht das Layout.
Alle: bild-tools