HTML + CSSTooltips

Tooltip que se escribe solo

Un signo de interrogación que contesta: la pista se escribe letra a letra al pasar el ratón.

Ajustes

16px
1x

Código

<button class="uv-ttype">?<span><b>Consejo rápido</b></span></button>

Prompt para IA

Pégalo en ChatGPT, Claude o Cursor y adaptará el bloque a tu proyecto con estos ajustes, aunque no uses React.

Más en Tooltips

Dónde usarlo

Brilla en ese pequeño «?» junto a un campo de formulario. En un comparador de seguros, pasas el ratón junto a «Franquicia» y aparece una explicación corta que se va escribiendo, como si alguien te respondiera en ese momento. Es un tooltip con efecto máquina de escribir, en HTML y CSS, y también se abre con el foco del teclado.

El efecto funciona en una línea corta. A partir de cinco o seis palabras la escritura se hace lenta y el tooltip queda demasiado ancho, así que deja las explicaciones largas para un panel de ayuda. Si cambias mucho el texto, ajusta también la velocidad.