Animación de texto Demo de producto con cursor: la palabra aimotions animada en este estilo
191InterfazCSS

Demo de producto con cursor

Un cursor recorre un editor de diseño genérico, escribe la palabra, la amplía y le cambia el color. Animación de texto para vídeos de demo y lanzamientos SaaS.

Prompt · cambia [TEXTO]

Universal
Crea una demo de producto que construya [TEXTO] en un editor de diseño genérico y limpio (ninguna app real). Espacio de trabajo gris claro con mesa de trabajo blanca, barra de herramientas estrecha a la izquierda, barra superior con nombre de archivo y botón de compartir, y panel de propiedades a la derecha. Un cursor de flecha negro se mueve por curvas con aceleración y frenada suaves: pulsa la herramienta de texto (pequeña pulsación y onda), hace clic en la mesa de trabajo y escribe [TEXTO] letra a letra con cursor de texto; arrastra el tirador inferior derecho de la caja de selección azul para ampliar el texto mientras un tooltip cuenta el tamaño; pulsa una muestra violeta para rellenar las letras con un degradado de violeta a rosa y pulsa el espacio vacío para deseleccionar. Los valores del panel cambian en cada paso. Mantén, borra y repite en bucle.

ADN visual

  • Editor claro: barras de herramientas, panel de propiedades y lienzo blanco
  • Cursor con trayectorias suaves y clics con pulsación y onda
  • Caja de selección azul con tiradores y tooltip de tamaño al arrastrar
  • Texto tecleado letra a letra, luego ampliado y recoloreado con un degradado
  • Los valores del panel se actualizan con cada acción
Categoría
Interfaz sci-fi y web moderna
Demo hecha con
CSS
Energía
Dinámico
Fondo
Claro

También conocido como

Apoyo
Mantén aimotions gratis

Sin muros de pago ni registro. Si un prompt te ha ahorrado una hora, un café ayuda a que sigan llegando estilos nuevos.

Invítame a un café

Teclas: ← → navegar · C copiar

Usa este estilo

  1. Paso 01Copia el prompt

    Describe el estilo Demo de producto con cursor (composición, tipografía, paleta, textura y ritmo) sin atarte a ninguna herramienta.

  2. Paso 02Cambia [TEXTO]

    Pon tu palabra, el nombre de tu producto o un titular. Las palabras cortas (4–12 letras) se leen mejor en la mayoría de estilos.

  3. Paso 03Pide un formato

    Pégalo en Claude Opus 5.5, Claude Sonnet 5.5, Claude Fable 5.5, GPT-6 Astra o GPT-6.1 Sol o un modelo posterior, y pide un único archivo HTML, un componente, un shader o un brief. Para la cabecera de una web, usa «Copiar para título web».

Títulos web →Guía de prompts →

Estilos relacionados

Ver categoría Interfaz →
192InterfazCanvas

Barrido de radar

pantalla de radar · efecto radar · animación de radar · radar verde

Ver →

Que siga siendo gratis.

aimotions no tiene muro de pago ni registro. Se financia con quienes encuentran un estilo que les encanta. Un café en Ko-fi ayuda a pagar el alojamiento y la siguiente tanda de estilos.

Apoyar en Ko-fi ♥