OG-Bild-Generator
Schreibe den Titel deiner Seite, wähle die Farben und lade ein Open-Graph-Bild mit 1200 × 630 px zum Teilen herunter.
So entsteht das Open-Graph-Bild
Gezeichnet wird eine Canvas mit 1200 × 630 px — das Verhältnis 1,91:1, das Facebook, LinkedIn, WhatsApp und X für Linkvorschauen empfehlen. Diese Größe bleibt auf Handy und Desktop scharf.
Verhältnis = 1200 ÷ 630 ≈ 1,91:1
Der Titel setzt sich selbst: Das Werkzeug misst die Breite jedes Wortes mit measureText und baut Zeilen, die in den nutzbaren Bereich passen. Ist der Text lang, verkleinert es die Schrift, bis er in die maximale Zeilenzahl passt.
Das Ergebnis wird als PNG exportiert, dem Format mit den saubersten Textkanten. Lade die Datei auf deine Website und verlinke sie mit den angezeigten og:image- und twitter:image-Tags.
Praktisches Beispiel
Mit dem Titel „Kompletter Leitfaden zu Core Web Vitals" und dem Untertitel „webytooly.com" verteilt das Werkzeug den Titel auf zwei große Zeilen, setzt den Untertitel darunter und ergänzt links einen Akzentbalken.
Häufig gestellte Fragen
- Warum 1200 × 630 Pixel?
- Das ist die von Facebook empfohlene Mindestgröße für große Linkbilder, und das Verhältnis 1,91:1 passt in den meisten sozialen Netzwerken ohne Beschnitt.
- Kann ich mein Logo verwenden?
- Dieses Werkzeug setzt Text und Farben. Brauchst du ein Logo, erzeuge hier die Basis und füge es danach in einem Bildeditor ein.
- Warum aktualisiert sich die Vorschau beim Teilen nicht?
- Soziale Netzwerke speichern das Bild zwischen. Nach einer Änderung erzwingst du mit dem Link-Debugger der jeweiligen Plattform ein erneutes Lesen des og:image-Tags.
- PNG oder JPG?
- PNG, wenn das Bild Text auf einer Flächenfarbe ist, wie hier: Die Kanten bleiben sauber. JPG lohnt sich, wenn der Hintergrund ein Foto ist.
Verwandte Rechner
- JPG komprimierenVerkleinere ein JPG-Foto, indem du die Kompressionsqualität wählst.
- PNG komprimierenVerkleinere ein PNG, indem du die Anzahl der Farben reduzierst.
- WebP komprimierenVerkleinere ein WebP-Bild über die Kompressionsqualität.
- JPG zu WebPKonvertiere JPG-Fotos zu WebP, damit deine Website schneller lädt.
- PNG zu WebPKonvertiere PNG-Bilder zu WebP und behalte die Transparenz.
- WebP zu JPGKonvertiere WebP-Bilder zu JPG, damit sie jedes Programm öffnet.
- Bildgröße ändernÄndere Breite und Höhe in Pixeln, ohne das Bild zu verzerren.
- Auflösung ändern (DPI)Stelle die DPI eines Bildes und seine echte Druckgröße ein.
- Bild zuschneidenZiehe mit der Maus einen Bereich auf und schneide das Bild darauf zu.
- Bild konvertierenWechsle zwischen JPG, PNG und WebP über ein Auswahlfeld.
- Favicon-GeneratorErzeuge alle Favicon-Größen und die .ico-Datei aus einem Bild.
- Bild zu Base64Wandle ein Bild in eine Base64-Zeichenkette oder ein Data-URI um.
- Farbwähler für BilderKlicke auf ein Bild und lies die Farbe als HEX, RGB und HSL aus.
- Farben aus einem Bild extrahierenHole dir die dominante Farbpalette eines beliebigen Fotos.