NuevoNuevo: exporta tus informes a PDF
HTML + CSSTooltips
Punto de novedad con pista
Un punto que late sobre un botón nuevo; al pasar o enfocar explica la novedad y desaparece con Entendido.
Ajustes
16px
1x
Código
<div class="uv-tbh"><div class="tb"><button type="button" aria-label="Deshacer"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M9 14L4 9l5-5M4 9h10a6 6 0 0 1 0 12h-3"/></svg></button><button type="button" aria-label="Compartir"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="18" cy="5.5" r="2.5"/><circle cx="6" cy="12" r="2.5"/><circle cx="18" cy="18.5" r="2.5"/><path d="M8.2 10.9l7.6-4.3M8.2 13.1l7.6 4.3"/></svg></button><span class="wr"><button type="button" class="nw" aria-label="Exportar" aria-describedby="uv-tbh-t"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 4v11M7.5 10.5L12 15l4.5-4.5M5 19.5h14"/></svg></button><span class="bc" aria-hidden="true"><i></i></span><span class="tt" role="tooltip" id="uv-tbh-t"><span class="tg">Nuevo</span><span class="tx">Nuevo: exporta tus informes a PDF</span><button type="button" class="ok">Entendido</button></span></span></div></div>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
Ver todos: TooltipsDónde usarlo
Anunciar una función dentro de la interfaz funciona mejor que un modal que se cierra sin leer. Un pequeño punto late sobre el botón nuevo de una barra de herramientas; al pasar o enfocarlo se abre un tooltip con la etiqueta Nuevo, una línea sobre la función y un botón Entendido que oculta el punto y la pista para siempre.
El latido es sutil y se detiene con movimiento reducido, y el foco vuelve al botón nuevo al descartarlo. Guarda el estado descartado en tu app para que la pista no vuelva en la siguiente visita.