JPKCom DB

QR — Beispiele

Konkrete QR-Durchläufe: URL mit Logo, WLAN-Zugang, vCard-Kontaktkarte, gestalteter Code mit Farbverlauf, transparenter SVG-Export und Text aus Datei.

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 angelassen lassen, damit das Logo sauber freisteht.
  4. 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 lassen (für die meisten Netze richtig).
  3. Ist das Netz versteckt, Hidden network einschalten.
  4. Margin auf einen Wert größer 0 stellen, damit ein heller Rand bleibt, und als PNG für den Ausdruck herunterladen.

Ergebnis: Ein Scan bietet auf den meisten Smartphones direkt das Verbinden an. Das Tool kodiert dabei automatisch das Format WIFI:S:…;T:WPA;P:…;H:false;; und escaped Sonderzeichen 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.
  3. Error Correction auf Q oder H anheben, weil eine vCard mehr Daten als eine kurze URL enthält und der Code dadurch dichter wird.
  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:.

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. Live-Vorschau prüfen und herunterladen.

Ergebnis: ein farbiger, abgerundeter Code im Markenlook. Achte beim Verlauf auf ausreichend Kontrast zum Hintergrund — dazu mehr 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.
  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 und füllt den Hintergrund.

Ergebnis: ein Code mit durchsichtigem Hintergrund, der sich sauber in ein Layout einbetten lässt. Plane trotzdem eine ausreichend kontrastierende, ruhige Fläche um den Code ein (Quiet Zone).

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. Error Correction ggf. auf L senken, falls der Text lang ist und der Code sonst sehr dicht wird (mehr Daten = größere Version).
  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. Bei sehr langem Inhalt lohnt der Blick auf die Maximalkapazität im Reference-Reiter des Tools.

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