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
Componente Pulsanti
Un componente di pulsanti reattivi con supporto della modalità oscura per i portfolio. Presenta un design piatto minimalista in scala di grigi con complessità moderata.
Componente Pulsanti
Un componente Pulsanti progettato in stile Material Design con una combinazione di colori pastello, reattivo per siti Web aziendali/aziendali e che supporta temi scuri.
Componente Pulsanti
Un set di pulsanti interattivi per un'applicazione CRM/Business Tools, con microinterazioni, colori gioiello e reattività completa con supporto della modalità scura.