Componente de nube de etiquetas
Un componente de nube de etiquetas diseñado con un estilo skeuomórfico, efectos responsivos y compatibilidad con temas oscuros mediante Tailwind CSS.
Código HTML
<div class="bg-gray-100 dark:bg-gray-800 p-6 rounded-lg shadow-lg transition-all duration-300 hover:shadow-xl">
<h2 class="text-xl font-semibold mb-4">Tag Cloud</h2>
<div class="flex flex-wrap gap-2">
<a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Web Development</a>
<a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Design</a>
<a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">SEO</a>
<a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Marketing</a>
<a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Programming</a>
<a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Networking</a>
<a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Cloud Computing</a>
<a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Data Science</a>
</div>
</div>Componentes relacionados
Componente de nube de etiquetas
Un componente de nube de etiquetas receptivo diseñado para la interfaz de usuario del modo oscuro, que muestra una cartera con un esquema de color análogo.
Acuarela/Componente de nube de etiquetas artísticas
Un componente de nube de etiquetas complejo y receptivo con un estilo de diseño artístico/acuarela y una combinación de colores pastel, adecuado para plataformas de foros/comunidades. Soporta el modo oscuro.
Componente de nube de etiquetas de la Bauhaus
Un componente de nube de etiquetas complejo y receptivo con un diseño inspirado en la Bauhaus, que utiliza neutros fríos, adecuado para plataformas educativas con soporte para modo oscuro.