JPKCom DB

QR — Beispiele

QR-Durchläufe: URL mit Logo, WLAN-Zugang, vCard, Farbverlauf mit Kontrastprüfung, transparenter Export, Text aus Datei, Termin und Standort.

Zurück zur Übersicht: QR · Tool live öffnen: www.jpkc.com/tools/qr/

Diese Seite zeigt den QR-Code-Generator an konkreten Durchläufen. Wie die einzelnen Funktionen genau arbeiten, steht im Manual.

Beispiel 1: URL mit Logo in der Mitte

Ziel: ein scannbarer Link zur eigenen Website, gebrandet mit Logo.

  1. Content Type auf URL stellen und die Adresse eingeben, z. B. jpkc.com (das https:// ergänzt das Tool selbst).
  2. In der Karte Center Image / Logo das Logo hochladen (PNG oder SVG). Beachte: Sobald das Logo gesetzt ist, springt die Fehlerkorrektur automatisch auf High (H).
  3. Image Size nach Geschmack auf etwa 30–40 % stellen; Hide dots behind image eingeschaltet lassen, damit das Logo sauber freisteht.
  4. Unter der Vorschau auf den Scan-Test schauen: Steht dort „Scan test: the image decodes to exactly this content.", liest sich der Code trotz Logo. Meldet der Test einen Fehler, verkleinerst du Image Size schrittweise, bis er grün wird.
  5. SVG herunterladen.

Ergebnis: ein gebrandeter QR-Code, der dank Stufe H auch mit verdeckter Mitte zuverlässig scannt. Vor dem Druck unbedingt mit einem echten Smartphone testen (siehe Tipps).

Beispiel 2: WLAN-Zugang zum Einscannen

Ziel: Gäste sollen sich ohne Passwort-Tipperei ins WLAN einwählen.

  1. Content Type auf WiFi Network stellen.
  2. Network Name (SSID) und Password eintragen, Security auf WPA/WPA2 (also WPA2/WPA3 mixed) lassen — das passt für die meisten Netze, auch im WPA2/WPA3-Mischbetrieb. Nur für ein reines WPA3-Netz wählst du WPA3 only (SAE).
  3. Ist das Netz versteckt, Hidden network einschalten.
  4. Den Schalter Quiet zone of 4 modules (recommended) eingeschaltet lassen — er sorgt für den hellen Rand, den Kameras auf einem Aushang brauchen.
  5. Als PNG für den Ausdruck herunterladen; die Datei heißt dann nach der SSID, bei „Café Bar 1" etwa qr-wifi-cafe-bar-1.png.

Ergebnis: Ein Scan bietet auf den meisten Smartphones direkt das Verbinden an. Das Tool kodiert dabei automatisch das Format WIFI:T:WPA;S:…;P:…;; und escaped Sonderzeichen wie ;, , oder : in SSID und Passwort.

Beispiel 3: Kontaktkarte (vCard) für die Visitenkarte

Ziel: Telefon, Mail und Website als digitale Visitenkarte hinterlegen.

  1. Content Type auf vCard (Contact) stellen.
  2. First Name, Last Name, Organization, Phone, Email und Website ausfüllen — leere Felder werden weggelassen. Umlaute im Namen sind kein Problem, das Tool kodiert sie als UTF-8.
  3. Error Correction auf Q oder H anheben, weil der Code im Druck robuster sein soll. Die Kapazitätszeile unter der Vorschau zeigt, wie stark Version und Modulzahl dadurch wachsen.
  4. Als SVG exportieren, damit er für den Druck verlustfrei skaliert.

Ergebnis: ein QR-Code, der beim Scannen das Anlegen eines Kontakts anbietet. Intern entsteht eine vCard 3.0 mit den Zeilen N:, FN:, ORG:, TEL:, EMAIL: und URL:; Kommas und Semikolons im Firmennamen werden dabei escaped.

Beispiel 4: Gestalteter Code mit Farbverlauf und runden Punkten

Ziel: ein Code, der zum Markenauftritt passt — nicht das Standard-Schwarzweiß.

  1. Inhalt wie in Beispiel 1 eingeben (z. B. eine Kampagnen-URL).
  2. In Dots Options den Stil auf Rounded oder Classy rounded stellen.
  3. Im Farbblock der Punkte auf Gradient umschalten, Color 1 und Color 2 in den Markenfarben wählen, Linear und eine Rotation von z. B. 45° einstellen.
  4. In Corners Square Options den Stil auf Extra rounded setzen — für weichere Eckmarken.
  5. Die Warnungen unter der Vorschau lesen: Ist eine Verlaufsfarbe zu hell, meldet das Tool „Low contrast" (unter 3:1) oder „Contrast … is borderline" (unter 4,5:1). Dann dunkelst du Color 1 oder Color 2 nach, bis die Warnung verschwindet und der Scan-Test grün ist.
  6. Herunterladen.

Ergebnis: ein farbiger, abgerundeter Code im Markenlook. Die Kontrastprüfung rechnet jeden Farbstopp gegen den Hintergrund — mehr dazu in den Tipps.

Beispiel 5: Transparenter Hintergrund für den Druck

Ziel: einen Code auf farbigen oder bedruckten Untergrund setzen.

  1. Inhalt eingeben.
  2. In Background Options den Schalter Transparent background einschalten — die Hintergrundfläche verschwindet, und das Tool erinnert per Hinweis daran, den Code auf eine helle, ruhige Fläche zu setzen.
  3. Die Punktfarbe so wählen, dass sie auf dem späteren Untergrund klar kontrastiert (auf hellem Grund dunkle Punkte).
  4. Als SVG, PNG oder WebP exportieren — nicht als JPEG, denn JPEG kennt keine Transparenz: Der transparente Hintergrund wird schwarz, und mit dunklen Punkten ist der Code unlesbar.

Ergebnis: ein Code mit durchsichtigem Hintergrund, der sich sauber in ein Layout einbetten lässt. Die automatische Ruhezone ist dabei durchsichtig — plane auf dem Untergrund trotzdem eine ausreichend kontrastierende, ruhige Fläche um den Code ein.

Beispiel 6: Langen Text aus einer Datei kodieren und als SVG kopieren

Ziel: einen längeren Text aus einer .txt-Datei in einen Code packen und direkt weiterverwenden.

  1. Content Type auf Plain Text (Voreinstellung) lassen.
  2. Auf Upload .txt klicken und die Textdatei wählen — ihr Inhalt landet im Textfeld.
  3. Die Kapazitätszeile unter der Vorschau lesen, etwa 1,480 / 2,331 bytes · version …. Wird der Code sehr dicht, senkst du Error Correction auf L (bis 2953 Bytes). Ist der Text zu lang, erzeugt das Tool keinen Code, sondern meldet „Too much content" samt Maximum.
  4. Auf Copy SVG klicken, um das SVG-Markup direkt in die Zwischenablage zu legen.

Ergebnis: Du kannst das SVG sofort in eine HTML-Seite, eine Design-Datei oder ein Dokument einfügen, ohne eine Datei zwischenzuspeichern.

Beispiel 7: Termin auf dem Einladungsflyer

Ziel: Wer den Flyer scannt, soll den Termin mit einem Tippen im Kalender haben.

  1. Content Type auf Calendar Event stellen.
  2. Title (z. B. Sommerfest), Location (z. B. Augsburg, Innenhof), Start und End eintragen, optional eine Description.
  3. Start und Ende als Ortszeit eingeben: Das Tool schreibt die Zeiten ohne Zeitzone („floating") in den Code, das Smartphone übernimmt sie in seiner eigenen Zeitzone.
  4. Als SVG für den Druck exportieren; die Datei heißt qr-event-sommerfest.svg.

Ergebnis: Ein Scan bietet an, den Termin in den Kalender zu übernehmen. Intern entsteht ein Block von BEGIN:VEVENT bis END:VEVENT mit SUMMARY, LOCATION, DTSTART, DTEND und DESCRIPTION. Eignet sich für Termine in derselben Zeitzone wie das Publikum — bei Online-Events über Zeitzonen hinweg gibst du die Uhrzeit besser zusätzlich im Flyertext an.

Beispiel 8: Standort für Anfahrt und Aushang

Ziel: Besucherinnen und Besucher öffnen den Treffpunkt direkt in ihrer Karten-App.

  1. Content Type auf Location (Geo) stellen.
  2. Latitude und Longitude in Dezimalgrad eintragen, z. B. 48.3705 und 10.8978 (Werte außerhalb von ±90 bzw. ±180 erzeugen keinen Code).
  3. Den Code als PNG herunterladen und auf den Aushang setzen.

Ergebnis: Das Tool kodiert geo:48.3705,10.8978; ein Scan öffnet den Ort in der Karten-App. Für eine Telefon-Hotline daneben eignet sich der Typ Phone Call, der aus +49 821 123456 den Inhalt tel:+49821123456 macht.

Mehr zu den einzelnen Funktionen steht im Manual, strategische Hinweise und Stolperfallen in den Tipps & Tricks. Direkt loslegen kannst du im Tool.