Componente de nube de etiquetas retro
Un componente de nube de etiquetas receptivo que usa Tailwind CSS, con una estética de diseño retro / vintage, combinación de colores pastel y complejidad simple. Adecuado para una cartera, incluida la compatibilidad con el modo oscuro.
Código HTML
<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>Componentes relacionados
Componente de nube de etiquetas
Un componente de nube de etiquetas con estilo de diseño Neumorphism, efectos responsivos y compatibilidad con temas oscuros mediante Tailwind CSS.
Componente de nube de etiquetas
Un componente de Tag Cloud complejo y receptivo con microinteracciones, diseñado para un panel de control, utilizando un esquema de color en escala de grises. Soporta el modo oscuro.
Componente 13 de la nube de etiquetas
Un componente de Tag Cloud diseñado con el estilo Neumorphism. Presenta un estilo de interfaz de usuario suave con elementos que parecen sobresalir del fondo usando sombras sutiles. El componente admite diseño responsivo y temas oscuros.