Información sobre herramientas
Componente de información sobre herramientas con diseño 3D, tonos de tierra, complejidad simple y propósito del tablero. Responsivo con soporte para temas oscuros.
Código HTML
<div class="relative flex items-center group">
<span clas="underline">Hover Over Me</span>
<div class="absolute bottom-full mb-2 hidden group-hover:block px-3 py-2 text-sm font-medium text-white transition-all duration-500 ease-in-out transform bg-gray-800 rounded-md shadow-lg dark:bg-gray-700 -translate-x-1/2 left-1/2
before:content-[''] before:absolute before:top-full before:left-1/2 before:-translate-x-1/2 before:border-8 before:border-x-transparent before:border-b-transparent before:border-t-gray-800 dark:before:border-t-gray-700">
Tooltip content
</div>
</div>Componentes relacionados
Información sobre herramientas del panel de control de Skeuomorphic
Un componente de información sobre herramientas complejo y esqueuomórfico para un tablero, con un esquema de color triádico y un diseño receptivo con soporte para modo oscuro, creado con Tailwind CSS y sin JavaScript.
Información sobre herramientas minimalista
Un componente de información sobre herramientas simple y minimalista con soporte para temas oscuros y efectos responsivos, creado con Tailwind CSS. No se utiliza JavaScript, solo HTML y CSS.
Componente de información sobre herramientas
Un componente de información sobre herramientas minimalista y de diseño plano para interfaces de juego, con negro, blanco y un color de acento brillante, con elementos interactivos complejos y capacidad de respuesta completa, incluida la compatibilidad con el modo oscuro.