Información sobre herramientas minimalista
Un componente de información sobre herramientas de diseño minimalista y plano para sitios web de blogs/contenido, con un esquema de color monocromático y un diseño simple. Es responsivo y admite el modo oscuro usando Tailwind CSS.
Código HTML
<div class="relative flex items-center group">
<button class="text-gray-600 dark:text-gray-300 px-4 py-2 rounded-md border border-gray-300 dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-400 dark:focus:ring-gray-500">Hover Me</button>
<div class="absolute bottom-full mb-2 hidden group-hover:block w-48 p-2 text-sm text-white bg-gray-800 dark:bg-gray-200 rounded-md shadow-lg">
<span class="text-gray-200 dark:text-gray-800">This is a minimalist tooltip.</span>
<svg class="absolute top-full left-1/2 transform -translate-x-1/2 w-3 h-3 text-gray-800 dark:text-gray-200 fill-current" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255 255"><polygon points="0,0 127.5,127.5 255,0"/></svg>
</div>
</div>Componentes relacionados
Componente de información sobre herramientas
Un componente de información sobre herramientas simple y receptivo diseñado para el consumo de contenido de blog, con un diseño 3D con un esquema de color en escala de grises y soporte para el modo oscuro mediante Tailwind CSS.
Información sobre herramientas de pastel minimalista
Un componente de información sobre herramientas mínimo y plano diseñado para sitios web comerciales y corporativos con colores pastel, diseño receptivo y compatibilidad con el modo oscuro mediante Tailwind CSS.
Componente de información sobre herramientas
Un componente de información sobre herramientas neumórfico con un esquema de color complementario, complejidad moderada y diseño receptivo con soporte para temas oscuros, adecuado para un blog o consumo de contenido.