HTML + CSSTooltips

Tooltip con retraso y desenfoque

Un tooltip que espera medio segundo antes de aparecer desde el desenfoque y se va rápido cuando te alejas.

Ajustes

16px
1x

Código

<button class="uv-tb">Guardar<span>Atajo: ⌘ + S</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

El pequeño retraso es lo que hace agradable este tooltip en interfaces llenas de botones. Encaja en las pistas de atajos de teclado de una app web («Atajo: ⌘ + S» bajo un botón Guardar) o en la barra de una herramienta de diseño. Si el ratón solo pasa, no parpadea nada; si se detiene, la etiqueta se enfoca.

Está pensado para quien ya conoce la herramienta y quiere un recordatorio. Quien empieza puede no esperar lo suficiente para verlo, así que no escondas ahí instrucciones clave. Se oculta más rápido de lo que aparece, y la interfaz se siente ágil.