Componente Pulsanti
Un componente pulsante minimalista per le dashboard, con supporto per il design reattivo e il tema scuro.
Codice HTML
<div class="flex space-x-4 p-4 bg-gray-100 dark:bg-gray-900">
<!-- Primary Button -->
<button class="px-4 py-2 rounded-md
bg-blue-500 text-white font-semibold
hover:bg-blue-600
focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-75
dark:bg-blue-700 dark:hover:bg-blue-600">
Primary Action
</button>
<!-- Secondary Button -->
<button class="px-4 py-2 rounded-md
bg-gray-300 text-gray-800 font-semibold
hover:bg-gray-400
focus:outline-none focus:ring-2 focus:ring-gray-300 focus:ring-opacity-75
dark:bg-gray-700 dark:text-gray-200 dark:hover:bg-gray-600">
Secondary Action
</button>
<!-- Success Button -->
<button class="px-4 py-2 rounded-md
bg-green-500 text-white font-semibold
hover:bg-green-600
focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-opacity-75
dark:bg-green-700 dark:hover:bg-green-600">
Success
</button>
<!-- Danger Button -->
<button class="px-4 py-2 rounded-md
bg-red-500 text-white font-semibold
hover:bg-red-600
focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-opacity-75
dark:bg-red-700 dark:hover:bg-red-600">
Delete
</button>
<!-- Disabled Button -->
<button class="px-4 py-2 rounded-md
bg-gray-200 text-gray-500 font-semibold
cursor-not-allowed
dark:bg-gray-800 dark:text-gray-600"
disabled>
Disabled
</button>
</div>Componenti correlati
Bottoni al neon Art Deco
Componenti pulsanti semplici e reattivi con uno stile geometrico Art Déco e una vivace combinazione di colori neon/elettrico, adatti per applicazioni sanitarie. Include il supporto per la modalità oscura.
Componente Pulsanti
Un componente pulsanti dal design minimalista/piatto con una combinazione di colori in scala di grigi. È adatto per siti Web aziendali/aziendali e ha una complessità moderata con alcune funzionalità interattive. È reattivo e supporta il tema scuro utilizzando Tailwind CSS.
Componente Pulsanti
Una serie di pulsanti interattivi progettati per un portfolio, con microinterazioni, una combinazione di colori complementari e una reattività completa con supporto della modalità scura.