Estudio de diseño
Hacemos marcas que se recuerdan
Identidad, web y packaging para gente que hace las cosas con cuidado. Trabajamos desde Valencia con clientes de cualquier parte.
Si llegas hasta el final, sabrás cómo nos llamamos.
HTML + CSSTexto y scroll
Marca gigante que asoma al final
Al llegar al final del contenido, la tarjeta sube como un telón y muestra el nombre de la marca a todo lo ancho.
Ajustes
16px
1x
Código
<div class="uvq14-cur"><div class="sc" tabindex="0" aria-label="Aurora"><article class="cd"><p class="kc">Estudio de diseño</p><h3>Hacemos marcas que se recuerdan</h3><p>Identidad, web y packaging para gente que hace las cosas con cuidado. Trabajamos desde Valencia con clientes de cualquier parte.</p><p>Si llegas hasta el final, sabrás cómo nos llamamos.</p></article><footer class="ft"><nav><a href="#">Instagram</a><a href="#">Correo</a><a href="#">Mapa</a></nav><p class="sr">Aurora</p><p class="wm" aria-hidden="true" translate="no">Aurora</p></footer></div><span class="hn" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M6 13l6 6 6-6"/></svg>Desplázate</span></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 Texto y scroll
Ver todos: Texto y scrollDónde usarlo
Muchas webs de estudio terminan con un logotipo enorme escondido bajo la página, y este bloque monta ese efecto con un pie fijo detrás de la tarjeta de contenido. Cuando la tarjeta se aleja, cada letra sube desde abajo por turnos y el nombre se ajusta para llenar el ancho sea cual sea su longitud. Encaja en webs de agencia, portfolios, restaurantes y páginas de marca.
Escribe el nombre de la marca en el campo de texto y edita los enlaces del pie. El color principal es el fondo del pie y el secundario el logotipo. Los lectores de pantalla reciben el nombre una vez como texto y las letras grandes quedan como decoración.