Komponenten Preisauszeichnung Komponente "Preisanzeige"

Komponente "Preisanzeige"

Eine Komponente zur Anzeige eines minimalen Preises mit Unterstützung für reaktionsschnelle und dunkle Modi

Vorschau

HTML-Code

<div class="bg-white dark:bg-gray-800 rounded-lg px-6 py-8 ring-1 ring-slate-900/5 shadow-xl">
  <div>
    <span class="inline-flex items-center justify-center p-2 bg-indigo-500 rounded-md shadow-lg">
      <svg class="h-6 w-6 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"></svg>
    </span>
  </div>
  <h3 class="mt-5 text-base font-medium tracking-tight text-slate-900 dark:text-white">Price</h3>
  <p class="mt-2 text-sm text-slate-500 dark:text-slate-400">
    <span class="text-2xl font-bold text-slate-900 dark:text-white">$99.99</span>/month
  </p>
</div>

Verwandte Komponenten

Komponente "Preisanzeige"

Eine reaktionsschnelle Preisanzeigekomponente mit Neumorphism-Stil und komplementärem Farbschema, die für Blog-Inhalte mit Unterstützung des Dunkelmodus entwickelt wurde.

Offen

Komponente "Preisanzeige"

Eine Preisanzeigekomponente im Neumorphism-Stil mit komplementärem Farbschema (sanftes Orange und Hellblau), moderate Komplexität für den E-Commerce. Es verfügt über ein responsives Design mit Unterstützung für dunkle Themen. Die Komponente zeigt ein Produktbild, einen Titel und einen Preis mit der Schaltfläche "In den Warenkorb" an. Im Dunkelmodus werden entsättigte Komplementärfarben verwendet.

Offen

Preisanzeige Komponente 22

Eine minimalistische Komponente zur Preisanzeige, die das Bild, den Namen, den Preis und eine Schaltfläche eines Produkts präsentiert, die in den Warenkorb gelegt werden kann. Entwickelt mit Reaktionsfähigkeit und Unterstützung für dunkle Themen mit Tailwind CSS.

Offen