iPhone- und MacBook-Mockup zusammen

Desktop und Mobile in einem Bild – das klassische „responsive“ Hero-Bild.

Screenshot hier ablegen

Größe

Format

Dein Bild bleibt in deinem Browser – nichts wird hochgeladen.

Wähle „Beide“ und der Generator zeigt die Desktop-Version auf einem MacBook und die Mobilversion auf einem iPhone, das davor steht – oder in der Ansicht von oben daneben auf dem Tisch liegt.

Der schnellste Weg zu zeigen, dass dein Produkt überall funktioniert.

Beispiele

Dashboard · Beide · LinksDashboard · Beide · LinksLandingpage · BeideLandingpage · BeideShop · Beide · Von obenShop · Beide · Von obenFinanzen · Beide · Rechts · DunkelFinanzen · Beide · Rechts · Dunkel

So funktioniert’s

  1. Bildschirm wählen

    Einen von 18 Oberflächentypen (je 5 Layouts) oder deinen eigenen Screenshot. Klicke auf „Neue Variante“, bis es passt.

  2. Gerät wählen

    iPhone 17 Pro, iPhone Air, MacBook Pro oder MacBook Air – oder ein Browserfenster.

  3. Herunterladen

    Ansicht und Hintergrund wählen und PNG, JPG oder WebP in hoher Auflösung laden. Auch mit transparentem Hintergrund.

Fragen

Passen beide Screens zusammen?

Ja, beide nutzen dieselbe Vorlage, Farben und denselben Produktnamen – Desktop auf dem MacBook, Mobile auf dem iPhone.

Kann ich die Modelle wählen?

Ja, Modell und Farbe von MacBook und iPhone wählst du getrennt.

Kann ich meine Screenshots nutzen?

Ein hochgeladener Screenshot wird auf beide Displays gesetzt.

Ist UI Generator kostenlos?

Ja. Alle Oberflächen, Geräte, Ansichten und Exportgrößen sind kostenlos, ein Konto brauchst du nicht. Die Bilder darfst du auch kommerziell nutzen.

Kann ich meinen eigenen Screenshot auf ein iPhone oder MacBook setzen?

Ja. Klicke auf „Eigener Screenshot“, ziehe ein Bild auf die Vorschau oder füge es mit Strg/Cmd+V ein. Das Bild wird im Browser verarbeitet und nie hochgeladen.

Weitere Mockups

Mockups nach Bildschirmtyp


Mockups nach Gerät