Composant de nuage de balises rétro
Un composant de nuage de balises réactif utilisant Tailwind CSS, avec une esthétique de design rétro/vintage, une palette de couleurs pastel et une complexité simple. Convient à un portefeuille, y compris la prise en charge du mode sombre.
HTML Code
<div class="bg-stone-50 dark:bg-stone-900 p-6 rounded-lg shadow-md">
<h2 class="text-xl font-mono text-stone-700 dark:text-stone-300 mb-4">Skills</h2>
<div class="flex flex-wrap gap-2">
<span class="px-3 py-1 bg-rose-200 dark:bg-rose-700 text-rose-800 dark:text-rose-200 text-sm font-mono rounded-full shadow-sm">HTML</span>
<span class="px-3 py-1 bg-teal-200 dark:bg-teal-700 text-teal-800 dark:text-teal-200 text-sm font-mono rounded-full shadow-sm">CSS</span>
<span class="px-3 py-1 bg-fuchsia-200 dark:bg-fuchsia-700 text-fuchsia-800 dark:text-fuchsia-200 text-sm font-mono rounded-full shadow-sm">Tailwind CSS</span>
<span class="px-3 py-1 bg-violet-200 dark:bg-violet-700 text-violet-800 dark:text-violet-200 text-sm font-mono rounded-full shadow-sm">JavaScript</span>
<span class="px-3 py-1 bg-amber-200 dark:bg-amber-700 text-amber-800 dark:text-amber-200 text-sm font-mono rounded-full shadow-sm">Python</span>
<span class="px-3 py-1 bg-cyan-200 dark:bg-cyan-700 text-cyan-800 dark:text-cyan-200 text-sm font-mono rounded-full shadow-sm">React</span>
<span class="px-3 py-1 bg-lime-200 dark:bg-lime-700 text-lime-800 dark:text-lime-200 text-sm font-mono rounded-full shadow-sm">Django</span>
</div>
</div>
Composants associés
Composant de nuage de balises
Composant de nuage de balises complexe et réactif avec des micro-interactions, conçu pour un tableau de bord, à l’aide d’un schéma de couleurs en niveaux de gris. Prend en charge le mode sombre.
Composant de nuage de balises
Un composant de nuage de balises réactif avec des animations attrayantes, utilisant un schéma de couleurs monochromatiques adapté à un portfolio.
Composant de nuage de balises 13
Un composant Tag Cloud conçu avec le style Neumorphism. Il présente un style d’interface utilisateur doux avec des éléments semblant s’extruder de l’arrière-plan à l’aide d’ombres subtiles. Le composant prend en charge le responsive design et les thèmes sombres.