Descrizione comando

Componente tooltip con design 3D, toni della terra, complessità semplice e scopo del cruscotto. Reattivo con supporto per il tema scuro.

Anteprima

Codice 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>

Componenti correlati

Paper_Rainbow_Tooltip_Component

Un componente di descrizione comando semplice e reattivo con un design ispirato alla carta/stampa e uno sfondo sfumato arcobaleno, adatto per piattaforme di forum/community. Include il supporto per la modalità oscura.

Aperto

Memphis_Real_Estate_Tooltip

Un componente tooltip semplice e reattivo per applicazioni immobiliari, caratterizzato da un'estetica ispirata a Memphis Design con una base monocromatica e un colore d'accento vibrante. Include il supporto per la modalità oscura.

Aperto

Componente del tooltip Brutalismo

Componente tooltip in stile brutalismo per i social media, con una combinazione di colori in scala di grigi ed elementi interattivi complessi. È reattivo e supporta la modalità oscura utilizzando Tailwind CSS, senza JavaScript.

Aperto