Componente Casella di ricerca
Un semplice componente della casella di ricerca progettato per le interfacce dei social media con supporto della modalità oscura e una combinazione di colori complementare.
Codice HTML
<div class="flex justify-center items-center p-4 bg-gray-800 dark:bg-gray-900">
<input type="text" placeholder="Search..." class="w-full max-w-md p-2 border-2 border-blue-500 dark:border-blue-300 rounded-lg bg-gray-700 dark:bg-gray-800 text-white placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:border-blue-400 dark:focus:border-blue-200">
<button class="ml-2 p-2 bg-blue-500 dark:bg-blue-600 rounded-lg text-white hover:bg-blue-400 dark:hover:bg-blue-500 focus:outline-none">Search</button>
</div>
Componenti correlati
3D_Candy_SearchBox_Manufacturing
Un componente reattivo della casella di ricerca ispirato al 3D con colori caramelle/dolci, adatto per applicazioni manifatturiere/industriali, con un sottile effetto ombra ed elementi interattivi.
Componente Casella di ricerca
Un componente della casella di ricerca in modalità oscura con design reattivo e supporto per temi scuri. Non viene utilizzato alcun JavaScript. Le immagini sono immagini segnaposto.
Casella di ricerca brutalista
Un componente della casella di ricerca brutalista per una dashboard, caratterizzato da una combinazione di colori complementari e complessità moderata, con design reattivo e supporto per temi scuri utilizzando Tailwind CSS.