Componenti Visualizzazione dei prezzi Componente di visualizzazione del prezzo

Componente di visualizzazione del prezzo

Un componente di visualizzazione del prezzo minimo con supporto per la modalità reattiva e scura

Anteprima

Codice HTML

<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>

Componenti correlati

Componente di visualizzazione del prezzo

Un componente di visualizzazione dei prezzi reattivo con un'estetica retrò/vintage e colori vivaci, adatto per le interfacce dei social media, con supporto per la modalità oscura.

Aperto

Componente di visualizzazione del prezzo

Un componente di visualizzazione dei prezzi in stile neumorfismo con una combinazione di colori complementari (arancione tenue e azzurro), complessità moderata per l'e-commerce. Presenta un design reattivo con supporto per il tema scuro. Il componente mostra l'immagine del prodotto, il titolo e il prezzo con un pulsante "Aggiungi al carrello". La modalità scura utilizza colori complementari desaturati.

Aperto

Componente di visualizzazione del prezzo

Un componente di visualizzazione dei prezzi in stile 3D che supporta la modalità oscura e gli effetti reattivi, mostrando i dettagli del prezzo del prodotto.

Aperto