Bestickter Mitgliedsausweis aus Filz

Ein Mitgliedsausweis aus Filz mit gesticktem Aufnäher und einer Steppnaht, die sich beim Überfahren von selbst rund um den Rand näht.

Einstellungen

Hauptfarbe#e6b450

Zweitfarbe#2f4a3a

Größe16px

Tempo1x

Text

Code

index.html

<article class="uvq07-knt"><svg class="sw" viewBox="0 0 300 190" aria-hidden="true"><defs><mask id="uvq07-knt-m"><path class="rv" d="M22 8H278A14 14 0 0 1 292 22V168A14 14 0 0 1 278 182H22A14 14 0 0 1 8 168V22A14 14 0 0 1 22 8Z" pathLength="1"/></mask></defs><path class="st" d="M22 8H278A14 14 0 0 1 292 22V168A14 14 0 0 1 278 182H22A14 14 0 0 1 8 168V22A14 14 0 0 1 22 8Z" mask="url(#uvq07-knt-m)"/></svg><div class="in"><span class="pt"><svg class="mo" viewBox="0 0 40 40" aria-hidden="true"><circle class="su" cx="28" cy="13" r="3.4"/><path class="mt" d="M5 30L15 15l5 7 4.5-5.5L35 30z"/><path class="sn" d="M15 15l-2.8 4.2 2.8-1 2.6 1.6z"/></svg><span class="qr" role="img" aria-label="QR-Code für den Zutritt"><i class="on"></i><i class="on"></i><i></i><i></i><i></i><i class="on"></i><i class="on"></i><i class="on"></i><i class="on"></i><i class="on"></i><i></i><i></i><i class="on"></i><i class="on"></i><i class="on"></i><i class="on"></i><i class="on"></i><i class="on"></i><i></i><i class="on"></i><i class="on"></i><i class="on"></i><i></i><i></i><i class="on"></i><i></i><i></i><i></i><i class="on"></i><i></i><i></i><i class="on"></i><i></i><i></i><i class="on"></i><i class="on"></i><i class="on"></i><i></i><i class="on"></i><i></i><i></i><i></i><i class="on"></i><i class="on"></i><i class="on"></i><i class="on"></i><i class="on"></i><i></i><i></i></span></span><div class="tx"><p class="k">Mitgliedsausweis</p><h3>Club Alpino Cierzo</h3><p class="nm">Lucía Ferrer</p><p class="no">Nr. 0427 · Seit 2019</p><div class="ft"><span>Gültig bis 12/2027</span><button type="button" aria-expanded="false" data-a="QR zeigen" data-b="QR ausblenden">QR zeigen</button></div></div></div></article>

Prompt für KI

Füg ihn in ChatGPT, Claude oder Cursor ein und der Baustein wird mit diesen Einstellungen an dein Projekt angepasst, auch ohne React.

Markdown-Version mit dem ganzen Code, für KI-Assistenten

Mehr aus Karten

Alle ansehen: Karten

3D-Tilt-Karte

KartenReact + Motion

Spotlight-Karte

KartenReact + Motion

Wetter- und Kalender-Widget

KartenReact + Motion

Karte mit Spotlight-Rand

KartenHTML + CSS

Karte mit Lift und Zoom

KartenHTML + CSS

Karte mit 3D-Flip

KartenHTML + CSS

Karte mit lebendigem Verlauf

KartenHTML + CSS

Karte mit verstecktem Inhalt

KartenHTML + CSS

Wofür du ihn nutzen kannst

Textilien bringen eine Wärme, die flachen Karten fehlt. Dieser Ausweis legt winzige Punkte zu einer Filzstruktur übereinander, zeichnet einen Aufnäher mit Plattstich-Rand aus einem konischen Verlauf und näht über eine animierte Maske eine gestrichelte SVG-Naht um den Rand, sobald du ihn überfährst oder fokussierst. Ein Button tauscht das Bergwappen gegen einen gestickten QR-Code. Passt zu Vereinen, Outdoor-Marken und Mitgliederprogrammen.

Die Hauptfarbe ist der goldene Faden, die zweite der Filz. Ändere Vereinsnamen, Mitgliedsdaten und den Berg im Aufnäher und behalte das Seitenverhältnis bei, damit die Naht dem Rand folgt.