Setze Screenshots in ein elegantes Browserfenster im macOS-Stil mit Schatten und Farbverlauf und lade sie als hochauflösendes PNG herunter.
Screenshot hier ablegen
Unterstützt PNG und JPG (max. 1 Datei)
Setze Screenshots in ein elegantes Browserfenster im macOS-Stil mit Schatten und Farbverlauf und lade sie als hochauflösendes PNG herunter. Geeignet für Alltag, Entwicklung, Lernen und schnelle Prüfungen.
Dieses Tool läuft im Browser. Prüfe vor sensiblen Daten, ob du deinem Gerät und Browser vertraust.
Ein roher Website-Screenshot wirkt in einer Präsentation oder einem Social-Media-Beitrag oft flach, und man erkennt nicht immer sofort, dass es sich um eine Webseite handelt. Dieses Tool setzt deinen Screenshot in ein Browserfenster im macOS-Stil – mit roter, gelber und grüner Fenstertaste, Adressleiste, abgerundeten Ecken und weichem Schatten – und legt ihn auf einen Hintergrund mit Farbverlauf. In wenigen Sekunden entsteht ein ansprechendes Bild für Präsentationen, Produktseiten, Portfolios oder Beiträge auf X.
Die Bedienung ist einfach: Klicke auf den Upload-Bereich oder ziehe ein Bild hinein. Unterstützt werden PNG und JPG, jeweils eine Datei. In den Stiloptionen wählst du einen von vier Verlaufshintergründen oder einen schlichten dunklen Hintergrund ohne Verlauf. Der Innenabstand hat die Stufen S, M und L und bestimmt, wie viel Raum den Screenshot umgibt. Das Fenster-Design gibt es dunkel oder hell, passend zu den Farben deines Screenshots. Jede Änderung erscheint sofort in der Vorschau rechts, sodass du verschiedene Kombinationen schnell vergleichen kannst.
Im Feld „Adressleisten-Text“ kannst du jede beliebige Adresse oder Beschriftung eintragen, etwa deine Produktdomain oder den Pfad einer bestimmten Seite. Zu lange Texte werden mit Auslassungspunkten gekürzt, damit sie nicht aus der Leiste ragen. Mit „Mockup als PNG herunterladen“ zeichnet das Tool das gesamte Bild in deinem Browser auf einem Canvas neu und exportiert ein scharfes PNG mit stets 1600 Pixeln Breite. Die Höhe richtet sich nach dem Seitenverhältnis des Screenshots, sodass auch lange Ganzseiten-Aufnahmen vollständig erhalten bleiben.
Alles wird auf deinem Computer zusammengesetzt, Screenshots werden nie auf einen AlpaKit-Server hochgeladen. Damit eignet sich das Tool auch für unveröffentlichte Produktansichten oder interne Dashboards. Derzeit gibt es nur einen Rahmen im macOS-Stil, und der Hintergrund kann nicht transparent sein. Ist dein Screenshot deutlich schmaler als 1600 Pixel, wird er beim Export hochskaliert und Text kann unscharf wirken – nimm ihn daher möglichst auf einem hochauflösenden Bildschirm oder in einem größeren Fenster auf.
Das exportierte PNG ist immer 1600 Pixel breit, inklusive Innenabstand, Fensterrahmen und Screenshot. Die Höhe ergibt sich aus dem Seitenverhältnis deines Screenshots und dem gewählten Abstand. Screenshots werden auf die Fensterbreite skaliert, ein Bild mit geringer Auflösung kann nach dem Vergrößern daher etwas unscharf wirken.
Derzeit nicht. Wenn du keinen Verlauf wählst, erhältst du einen einfarbig dunklen, nicht transparenten Hintergrund. Brauchst du Transparenz, exportiere das Bild zuerst hier und entferne die Hintergrundfarbe anschließend mit einem Freistellungs- oder Bildbearbeitungsprogramm.
Verfügbar ist nur ein Browserrahmen im macOS-Stil, in dunklem und hellem Design. Die drei Fenstertasten oben links und die Adressleiste sind fest gestaltet und lassen sich nicht gegen ein Windows-Fenster oder einen Smartphone-Rahmen austauschen.
Nein. Das Bild wird in deinem Browser eingelesen und auf einem Canvas zusammengesetzt, auch das heruntergeladene PNG entsteht lokal. Dein Screenshot wird nirgendwohin hochgeladen, du kannst das Tool also bedenkenlos mit vertraulichen Produktansichten nutzen.
Kategorie ansehen: Design & Farben
Erstelle leuchtende Neonschriftzüge mit anpassbaren Farben, Pulsieren und exportierbarem CSS-Code.
Lies Farbcodes pixelgenau aus jedem Bild mit integrierter Lupe aus und sieh die dominante Farbpalette.
Konfiguriere und visualisiere CSS Flexbox- und Grid-Layouts visuell, sieh Animationen und kopiere CSS-Code.
Erstelle harmonische Farbschemata basierend auf einer Basisfarbe mit Export als HEX- und RGB-Code.
