72 lines
4.8 KiB
XML
72 lines
4.8 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 900" role="img" aria-labelledby="title desc">
|
|
<title id="title">Statischer und dynamischer QR-Code im Vergleich</title>
|
|
<desc id="desc">Illustration: Ein statischer QR-Code enthält einen festen Link. Bei einem dynamischen QR-Code kann das Ziel später geändert werden.</desc>
|
|
<defs>
|
|
<linearGradient id="background" x1="0" x2="1" y1="0" y2="1">
|
|
<stop stop-color="#f8fafc"/>
|
|
<stop offset="1" stop-color="#eef4ff"/>
|
|
</linearGradient>
|
|
<filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
|
|
<feDropShadow dx="0" dy="16" stdDeviation="18" flood-color="#0f172a" flood-opacity=".10"/>
|
|
</filter>
|
|
</defs>
|
|
|
|
<rect width="1200" height="900" rx="36" fill="url(#background)"/>
|
|
<text x="72" y="82" fill="#64748b" font-family="Arial, sans-serif" font-size="24" font-weight="700" letter-spacing="3">ILLUSTRATION</text>
|
|
<text x="72" y="132" fill="#0f172a" font-family="Arial, sans-serif" font-size="38" font-weight="700">Vor dem Druck entscheiden</text>
|
|
|
|
<g filter="url(#shadow)">
|
|
<rect x="72" y="184" width="480" height="590" rx="28" fill="#fff" stroke="#e2e8f0" stroke-width="3"/>
|
|
<rect x="648" y="184" width="480" height="590" rx="28" fill="#fff" stroke="#bfdbfe" stroke-width="3"/>
|
|
</g>
|
|
|
|
<g font-family="Arial, sans-serif">
|
|
<rect x="108" y="222" width="196" height="44" rx="22" fill="#fef2f2"/>
|
|
<text x="132" y="251" fill="#b91c1c" font-size="20" font-weight="700">FESTER LINK</text>
|
|
<text x="108" y="318" fill="#0f172a" font-size="34" font-weight="700">Statischer QR-Code</text>
|
|
<text x="108" y="354" fill="#64748b" font-size="22">Link fest eingebrannt</text>
|
|
|
|
<rect x="684" y="222" width="226" height="44" rx="22" fill="#eff6ff"/>
|
|
<text x="708" y="251" fill="#2563eb" font-size="20" font-weight="700">FLEXIBLES ZIEL</text>
|
|
<text x="684" y="318" fill="#0f172a" font-size="34" font-weight="700">Dynamischer QR-Code</text>
|
|
<text x="684" y="354" fill="#64748b" font-size="22">Ziel später ändern</text>
|
|
</g>
|
|
|
|
<g transform="translate(116 410)">
|
|
<rect width="190" height="190" rx="18" fill="#fff" stroke="#0f172a" stroke-width="14"/>
|
|
<rect x="24" y="24" width="42" height="42" fill="#0f172a"/><rect x="124" y="24" width="42" height="42" fill="#0f172a"/>
|
|
<rect x="24" y="124" width="42" height="42" fill="#0f172a"/>
|
|
<path d="M84 24h18v18H84zm18 36h18v18h-18zm-18 36h18v18H84zm36 18h18v18h-18zm-18 36h18v18h-18zm36 0h28v18h-28zM84 132h18v18H84zM120 96h18v18h-18z" fill="#0f172a"/>
|
|
</g>
|
|
<path d="M340 504h132" stroke="#cbd5e1" stroke-width="8" stroke-linecap="round"/>
|
|
<path d="M448 480l28 24-28 24" fill="none" stroke="#cbd5e1" stroke-width="8" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<rect x="336" y="444" width="160" height="116" rx="16" fill="#f8fafc" stroke="#e2e8f0" stroke-width="2"/>
|
|
<text x="360" y="485" fill="#64748b" font-family="Arial, sans-serif" font-size="17" font-weight="700">ZIEL-URL</text>
|
|
<text x="360" y="520" fill="#b91c1c" font-family="Arial, sans-serif" font-size="17">nicht änderbar</text>
|
|
|
|
<g transform="translate(692 410)">
|
|
<rect width="190" height="190" rx="18" fill="#fff" stroke="#0f172a" stroke-width="14"/>
|
|
<rect x="24" y="24" width="42" height="42" fill="#0f172a"/><rect x="124" y="24" width="42" height="42" fill="#0f172a"/>
|
|
<rect x="24" y="124" width="42" height="42" fill="#0f172a"/>
|
|
<path d="M84 24h18v18H84zm18 36h18v18h-18zm-18 36h18v18H84zm36 18h18v18h-18zm-18 36h18v18h-18zm36 0h28v18h-28zM84 132h18v18H84zM120 96h18v18h-18z" fill="#0f172a"/>
|
|
</g>
|
|
<path d="M916 504h100" stroke="#93c5fd" stroke-width="8" stroke-linecap="round"/>
|
|
<path d="M992 480l28 24-28 24" fill="none" stroke="#2563eb" stroke-width="8" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<rect x="912" y="426" width="176" height="156" rx="16" fill="#eff6ff" stroke="#bfdbfe" stroke-width="2"/>
|
|
<text x="936" y="464" fill="#2563eb" font-family="Arial, sans-serif" font-size="17" font-weight="700">DASHBOARD</text>
|
|
<rect x="936" y="485" width="126" height="12" rx="6" fill="#93c5fd"/>
|
|
<rect x="936" y="515" width="96" height="12" rx="6" fill="#bfdbfe"/>
|
|
<rect x="936" y="543" width="88" height="12" rx="6" fill="#2563eb"/>
|
|
|
|
<g font-family="Arial, sans-serif">
|
|
<circle cx="128" cy="684" r="13" fill="#ef4444"/>
|
|
<text x="156" y="691" fill="#475569" font-size="21">Neuer Link? Neuer QR-Code nötig.</text>
|
|
<circle cx="704" cy="684" r="13" fill="#22c55e"/>
|
|
<text x="732" y="691" fill="#475569" font-size="21">Neuer Link? Ziel im Dashboard ändern.</text>
|
|
</g>
|
|
|
|
<path d="M552 446h96" stroke="#94a3b8" stroke-width="4" stroke-dasharray="10 12"/>
|
|
<circle cx="600" cy="446" r="28" fill="#fff" stroke="#cbd5e1" stroke-width="3"/>
|
|
<text x="586" y="455" fill="#475569" font-family="Arial, sans-serif" font-size="24" font-weight="700">vs.</text>
|
|
</svg>
|