El IBAN está en la app de tu banco, en el apartado Cuentas.
HTML + CSSTooltips
Icono de ayuda que se transforma
El círculo con interrogación crece y se convierte en la propia burbuja que contiene la explicación.
Ajustes
16px
1x
Código
<div class="uv-thm"><label for="uv-thm-in">IBAN</label><span class="hp" tabindex="0" role="button" aria-label="Ayuda" aria-describedby="uv-thm-t"><span class="q" aria-hidden="true">?</span><span class="tx" id="uv-thm-t" role="tooltip">El IBAN está en la app de tu banco, en el apartado Cuentas.</span></span><input id="uv-thm-in" placeholder="ES00 0000 0000 0000 0000 0000"></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
Campos como el IBAN, el NIF o el CVV suelen necesitar una pista que casi nadie lee. En lugar de un popup aparte, el propio círculo con la interrogación se expande: crece hacia arriba y a la derecha con un muelle suave, cambia de color, la interrogación se desvanece y el texto de ayuda aparece dentro de la misma forma.
El icono recibe el foco con rol de botón y se enlaza con el texto mediante aria-describedby. Cambia la explicación con el control de texto y ajusta los colores al acento del campo.