1<article class="pc-card" tabindex="0">2 <div class="pc-glow" aria-hidden="true"></div>3 <div class="pc-inner">4 <span class="pc-ribbon">Beliebt</span>5 <h3 class="pc-plan">Pro</h3>6 <p class="pc-desc">Für Teams, die skalieren wollen.</p>7 <div class="pc-price">8 <span class="pc-cur">€</span><span class="pc-amount">24</span><span class="pc-per">/Monat</span>9 </div>10 <ul class="pc-list">11 <li>Unbegrenzte Projekte</li>12 <li>Erweiterte Analysen</li>13 <li>Prioritäts-Support</li>14 <li>Custom Domains</li>15 </ul>16 <button class="pc-cta" type="button">Jetzt starten</button>17 <p class="pc-note">14 Tage kostenlos · jederzeit kündbar</p>18 </div>19</article>Keine Installation, kein Build-Step — reine Standards, sofort einsatzbereit.
Klicke oben auf „Code kopieren“ — HTML und CSS landen in deiner Zwischenablage.
Füge das Markup an der gewünschten Stelle deiner Seite oder Komponente ein.
Übernimm den <style>-Block bzw. die Klassen in deine Stylesheet-Datei.
Aus derselben Kategorie oder mit passenden Tags.
Melde dich an, um zu kommentieren.
Eine moderne Premium-Card mit Glassmorphism, Glow-Rand, animiertem Licht-Scan, Status-Badge, Metrik und CTA. Perfekt für SaaS-Dashboards, Feature-Cards, Pricing-Highlights oder Component-Libraries.