> ## Documentation Index > Fetch the complete documentation index at: https://docs.getqr.com/llms.txt > Use this file to discover all available pages before exploring further. # Anpassung > Gestalten Sie QR-Codes über die API: Formen von Punkten und Ecken, Farben, Rahmen und Logos. > [!NOTE] > > Die GetQR API befindet sich in der Beta-Phase und steht ausgewählten Workspaces zur Verfügung. Details können sich bis zur allgemeinen Veröffentlichung noch ändern. Gestalten Sie einen QR-Code beim Erstellen oder Aktualisieren mit den optionalen Objekten `styles`, `frameOptions` und `logoOptions`. Alle Felder sind optional, und für alles, was Sie weglassen, gelten Standardwerte. Dieselben drei Objekte funktionieren bei [QR-Codes](https://docs.getqr.com/de/api/endpoints/qr-codes.md), [Vorlagen](https://docs.getqr.com/de/api/endpoints/templates.md) und der [Massenerstellung](https://docs.getqr.com/de/api/endpoints/bulk-qr-creations.md). Unbekannte Formen, Rahmen oder Logos werden mit `422` abgelehnt. ## Beispiel für ein Design-Objekt ```json theme={null} { "styles": { "dotsOptions": { "type": "rounded", "color": "#000000" }, "backgroundOptions": { "color": "#ffffff" }, "cornersSquareOptions": { "type": "dot", "color": "#000000" }, "cornersDotOptions": { "type": "dot", "color": "#000000" } }, "frameOptions": { "id": "card", "text": "Scan me!", "color": "#000000", "textColor": "#ffffff" }, "logoOptions": { "type": "suggested", "id": "logo-google", "scalePercent": 25 } } ``` Senden Sie es zusammen mit dem Rest des QR-Codes: ```bash theme={null} curl -X POST "https://getqr.com/api/v1/qrs" \ -H "Authorization: Bearer $GETQR_API_KEY" \ -H "Content-Type: application/json" \ -d '{ "qrType": "website", "data": "https://example.com", "styles": { "dotsOptions": { "type": "rounded", "color": "#1E40AF" } }, "frameOptions": { "id": "card", "text": "Scan me!" }, "logoOptions": { "type": "suggested", "id": "logo-website-3" } }' ``` ## Stile Das Objekt `styles` legt die Formen und Farben des Musters fest. | Feld | Werte | | - | - | | `dotsOptions.type` | Form der Körperpunkte: `square`, `dots`, `rounded`, `classy`, `classy-rounded`, `extra-rounded` | | `cornersSquareOptions.type` | Form der Eckquadrate (Augenrahmen): `square`, `rounded`, `dot`, `classy-rounded` | | `cornersDotOptions.type` | Form der Eckpunkte (Augapfel): `square`, `dot`, `dots`, `rounded`, `classy` | | `dotsOptions.color` | Vordergrundfarbe. Standard ist `#000000`. | | `backgroundOptions.color` | Hintergrundfarbe. Standard ist `#ffffff`. | | `cornersSquareOptions.color`, `cornersDotOptions.color` | Werden akzeptiert, haben aber keine Wirkung: Ecken verwenden immer `dotsOptions.color`. | * **Farben.** Nur Hex-Werte: `#RGB` oder `#RRGGBB`. * **Fehlerkorrektur.** Immer `Q` und keine Eingabe. Wer `styles.qrOptions` sendet, erhält `422`. * **Branded und AI designs.** Lassen sich über die API nicht festlegen. Wer `styles.logoQrArt` sendet, erhält `422`. * **Inhalt.** `styles.data` wird ignoriert. Das Bild kodiert immer den Inhalt des QR-Codes. > [!TIP] > > Achten Sie auf ausreichenden Kontrast zwischen Vorder- und Hintergrundfarbe, mit dunklem Vordergrund auf hellem Hintergrund. Codes mit wenig Kontrast lassen sich womöglich nicht scannen. Siehe [Farben](https://docs.getqr.com/de/design/colors.md). ## Rahmen Das Objekt `frameOptions` fügt um den QR-Code einen dekorativen Rahmen mit einer Handlungsaufforderung hinzu. | Feld | Beschreibung | | - | - | | `id` | Erforderlich, wenn Sie `frameOptions` senden. Der Rahmentyp aus den Listen unten. `none` bedeutet kein Rahmen. | | `text` | Beschriftung der Handlungsaufforderung, bis zu 12 Zeichen. Standard ist `Scan me!`. | | `color` | Rahmenfarbe, hex. | | `textColor` | Farbe der Beschriftung, hex. Muss sich von `color` unterscheiden, wenn der Rahmen eine Beschriftung zeigt, es sei denn, das Paar ist eine der eingebauten Farbvorgaben des Rahmens. | | `borderColor` | Randfarbe, hex. | | `fingerPrintColor` | Akzentfarbe des Rahmensymbols, hex. | > [accordion] Allgemeine Rahmen > > `none`, `card`, `card-1`, `card-2`, `card-3`, `card-4`, `card-5`, `card-7`, `card-8`, `card-9`, `card-10`, `card-11`, `card-12`, `card-13`, `card-14`, `card-15`, `card-hor`, `wreath`, `envelope`, `waitress`, `coffee-cup`, `scooter`, `clipboard` > > `card-hor` zeigt keine Beschriftung. > [accordion] Rahmen nach QR-Code-Typ > > | Typ | Rahmen mit Beschriftung | Rahmen ohne Beschriftung | > | - | - | - | > | App Link | `app-3` | `app-1`, `app-2` | > | vCard | `contact-1`, `contact-5` | `contact-2`, `contact-3`, `contact-4` | > | E-Mail | `email-1` | `email-2`, `email-3`, `email-4`, `email-5` | > | Feedback | — | `feedback-1`, `feedback-2`, `feedback-3`, `feedback-4`, `feedback-5` | > | Image | — | `image-1`, `image-2`, `image-3`, `image-4`, `image-5`, `image-6` | > | Standort | `location-3` | `location-1`, `location-2`, `location-4`, `location-5`, `location-6` | > | Multi-Link | `multilink-3` | `multilink-1`, `multilink-2` | > | Zahlung | — | `payment-1`, `payment-2`, `payment-3`, `payment-4`, `payment-5` | > | PDF | `pdf-1` | `pdf-2`, `pdf-3`, `pdf-4` | > | SMS | `sms-3`, `sms-5`, `sms-7` | `sms-1`, `sms-2`, `sms-4`, `sms-6` | > | Social Media | `social-3` | `social-1`, `social-2`, `social-4` | > | Video | `video-1`, `video-3` | `video-2`, `video-4`, `video-5`, `video-6` | > | Website | `website-1` | `website-2`, `website-3`, `website-4`, `website-5` | > | WhatsApp | `whatsapp-2` | `whatsapp-1`, `whatsapp-3`, `whatsapp-4` | > | WiFi | — | `wifi-1`, `wifi-2`, `wifi-3`, `wifi-4` | > > Jeder Rahmen funktioniert mit jedem QR-Code-Typ. Die Gruppierung entspricht dem Dashboard. Rahmen ohne Beschriftung haben im Dashboard kein Feld für die Handlungsaufforderung, und die Regel, dass sich `textColor` von `color` unterscheiden muss, gilt für sie nicht. ## Logos Das Objekt `logoOptions` platziert ein Logo in der Mitte des QR-Codes. Mit `type` wählen Sie die Art des Logos. ### Vorgeschlagenes Logo Setzen Sie `type` auf `suggested` und wählen Sie eine `id` aus dem Katalog. Verwenden Sie `logo-none` für kein Logo. ```json theme={null} { "logoOptions": { "type": "suggested", "id": "logo-instagram", "scalePercent": 25 } } ``` > [accordion] Alle IDs vorgeschlagener Logos > > `logo-none`, `logo-website-3`, `logo-website-4`, `logo-link`, `logo-pdf-1`, `logo-pdf-2`, `logo-pdf-3`, `logo-picture-1`, `logo-picture-2`, `logo-picture-3`, `logo-picture-5`, `logo-picture-7`, `logo-picture-8`, `logo-video-1`, `logo-video-5`, `logo-whatsapp-1`, `logo-whatsapp-2`, `logo-whatsapp`, `logo-wifi-1`, `logo-wifi-2`, `logo-wifi-3`, `logo-wifi`, `logo-airbnb`, `logo-apple`, `logo-binance`, `logo-bitcoin`, `logo-bolt-food`, `logo-booking`, `logo-facebook`, `logo-glovo`, `logo-google`, `logo-google-maps`, `logo-google-play`, `logo-instagram`, `logo-linkedin`, `logo-location`, `logo-mail`, `logo-paypal`, `logo-stripe`, `logo-venmo`, `logo-cashapp`, `logo-braintree`, `logo-square`, `logo-verifone`, `logo-google-pay`, `logo-apple-pay`, `logo-klarna`, `logo-ayden`, `logo-giropay`, `logo-cartes-bancaires`, `logo-restaurant`, `logo-scan-me`, `logo-tripadvisor`, `logo-trustpilot`, `logo-uber-eats`, `logo-youtube`, `logo-spotify`, `logo-spotify-black` ### Eigenes Logo **1. Bild hochladen** Registrieren Sie es über [Dateien](https://docs.getqr.com/de/api/endpoints/files.md) mit `"target": "logo"` und laden Sie die Datei dann an die zurückgegebene `uploadUrl` hoch. **2. Auf die Datei verweisen** Setzen Sie `type` auf `uploaded` und `fileId` auf die zurückgegebene `fileId`. `fileId` ist erforderlich und muss eine ID sein, die der Endpunkt Files zurückgegeben hat. ```json theme={null} { "logoOptions": { "type": "uploaded", "fileId": "file_7bQ2xR9mKp", "scalePercent": 35 } } ``` Eine unbekannte Datei, ein nicht abgeschlossener Upload oder eine für ein anderes Target hochgeladene Datei wird abgelehnt. ### Logogröße `scalePercent` legt die Logogröße als Prozentsatz des QR-Codes fest. Erlaubt ist eine ganze Zahl von 15 bis 45. Standard ist 25. Andere Werte, auch Verhältnisse wie `0.25`, erhalten `422`. ## Ein Design aktualisieren * **Teilaktualisierungen.** Bei [QR-Code aktualisieren](https://docs.getqr.com/de/api/endpoints/qr-codes.md#qr-code-aktualisieren) werden `styles`, `frameOptions` und `logoOptions` mit dem gespeicherten Design zusammengeführt. Ein Teilobjekt ändert nur, was es nennt. * **Logo wechseln.** Ein anderes Logo ersetzt das gespeicherte, behält aber dessen `scalePercent`. * **Vorlagen.** Mit `templateId` beim Erstellen werden die gesendeten Felder über das Design der Vorlage gelegt. Siehe [Vorlagen](https://docs.getqr.com/de/api/endpoints/templates.md). * **Branded und AI designs.** Ein QR-Code mit `designKind` `branded` oder `ai` wurde im Dashboard erstellt. Die API kann sein Bild nicht bearbeiten, behält es aber bei, wenn Sie andere Felder ändern. * **Ein Design lesen.** Antworten liefern das gespeicherte Design unter `design`, im selben Aufbau wie die Anfragefelder, sodass Sie es zurücksenden können. ## Häufige Probleme > [accordion] 422 "Error correction is always Q and is not an input" > > Entfernen Sie `styles.qrOptions` aus der Anfrage. > [accordion] 422 "Frame caption is at most 12 characters" > > Kürzen Sie `frameOptions.text` auf höchstens 12 Zeichen. > [accordion] 422 "Frame caption color must differ from the frame color" > > `textColor` und `color` sind bei einem Rahmen mit Beschriftung gleich. Wählen Sie eine kontrastierende `textColor`. > [accordion] 422 "Logo scale is a whole number from 15 to 45" > > Senden Sie `scalePercent` als ganzzahligen Prozentwert, zum Beispiel `25`, nicht `0.25`. > [accordion] Die Eckenfarbe ändert sich nicht > > Ecken verwenden immer `dotsOptions.color`. `cornersSquareOptions.color` und `cornersDotOptions.color` haben keine Wirkung. ## Wie geht es weiter? > [card] [QR-Codes](https://docs.getqr.com/de/api/endpoints/qr-codes.md) > [card] [Vorlagen](https://docs.getqr.com/de/api/endpoints/templates.md) > [card] [Dateien](https://docs.getqr.com/de/api/endpoints/files.md) > [card] [Design-Übersicht](https://docs.getqr.com/de/design/overview.md) This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.