RetroBadge
Componente badge retrò / vintage per siti Web aziendali / aziendali con combinazione di colori complementari. Layout semplice, design reattivo con supporto per temi scuri. Niente JavaScript.
Codice HTML
<div class="flex flex-wrap gap-2 p-4 bg-gray-100 dark:bg-gray-900">
<!-- Badge 1 -->
<span class="px-3 py-1 text-sm font-semibold text-purple-800 bg-purple-200 rounded-full dark:text-purple-200 dark:bg-purple-800">
Vintage Vibe
</span>
<!-- Badge 2 -->
<span class="px-3 py-1 text-sm font-semibold text-yellow-800 bg-yellow-200 rounded-full dark:text-yellow-200 dark:bg-yellow-800">
Retro Style
</span>
<!-- Badge 3 -->
<span class="px-3 py-1 text-sm font-semibold text-green-800 bg-green-200 rounded-full dark:text-green-200 dark:bg-green-800">
Classic Look
</span>
</div>Componenti correlati
Componente Badge
Un componente Badge reattivo progettato con lo stile Glassmorphism, con elementi traslucidi simili al vetro smerigliato ed effetti di sfocatura, con supporto per la modalità oscura.
Componente Badge
Un componente di badge a tema retrò con una combinazione di colori in scala di grigi, adatto per un blog o un sito di contenuti. È dotato di più elementi interattivi e piena reattività, con supporto per la modalità oscura. Il design evita JavaScript, basandosi esclusivamente su HTML e Tailwind CSS.
Componente Badge
Un semplice componente di badge in stile Glassmorphism per i social media, con effetti di vetro smerigliato con sfocatura, colori analoghi e supporto per la modalità scura utilizzando Tailwind CSS. È reattivo e utilizza picsum.photos per le immagini e randomuser.me per gli avatar dove necessario. Non è incluso alcun JavaScript.