Saltar al contenido
motionframe

Buscar piezas

Categorías

La pieza

Qué hace y dónde encaja

Una galaxia elíptica gigante a pantalla completa, en WebGL2 puro. El resplandor ovalado del cuerpo no es un truco de imagen: se calcula por píxel proyectando un elipsoide triaxial con un perfil de Sérsic, así que su forma cambia de verdad al girar. Encima orbitan 150.000 estrellas en planos aleatorios, sin disco, con gigantes rojas y rezagadas azules; alrededor, arcos tenues de capas de marea y cúmulos globulares; del núcleo sale un chorro azul con nudos, ondulación y lóbulo final. El cursor inclina la cámara, el arrastre la gira con inercia y las flechas también. Trae tres paletas (Ámbar, Glaciar y Rubí) que se funden en caliente, pausa, movimiento reducido y respaldo sin WebGL. Encaja como cabecera de una web tecnológica, de un estudio creativo, de un evento o de un proyecto científico, y como fondo de una sección de manifiesto.

Prompt
≈12.131 tokens · con Lite
Librerías
ninguna
Demo
27,6 KB · ligero
Prueba en frío
pendiente

Antes de copiar

Tu marca, dentro del prompt

Cambia lo que quieras y copia: el prompt sale ya con el nombre, los colores y los textos de tu cliente. Lo que dejes en blanco se queda como en la demo.

Mete tu marca y tus colores en el prompt

Con Pro o con tu llave de regalo. Esto es lo que puedes cambiar:

  • Color del núcleo
  • Color del halo
  • Color del chorro
  • Código de catálogo
  • Nombre del catálogo
  • Etiqueta sobre el titular
  • Titular (parte recta)
  • Titular (parte destacada)

Índice del prompt

Qué hay dentro del prompt

Qué trae el prompt, por apartados

  1. 01Qué es
  2. 02Librerías y esqueleto
  3. 03Tokens de diseño
  4. 04Estructura y contenido
  5. 05Movimiento
  6. 06Código clave
  7. 07Interacción
  8. 08Adaptación a móvil y tablet
  9. 09Accesibilidad y movimiento reducido
  10. 10Rendimiento
  11. 11Personalización
  12. 12Comprobación final
Completo
6.450 palabras · ≈12.131 tokens
Lite
1.217 palabras · ≈2.081 tokens
Librerías
ninguna
Peso de la demo
27,6 KB (ligero)
Resolución máxima (DPR)
2
Se pausa fuera de pantalla
sí
Respeta «menos movimiento»
sí
Alternativa sin WebGL
sí

Tokens estimados para español (≈3,6 caracteres por token): sirven para orientarte, no son exactos.

prompt.md Pro

El prompt está en Pro

6.450 palabras en el Completo y 1.217 en el Lite. El prompt real solo sale del servidor cuando tienes acceso.

Prueba en frío

La prueba en frío

Aún sin publicar para esta pieza

En la prueba en frío pegamos el prompt en Claude Sonnet 5.5, sin ayuda ni contexto, y comparamos lo que genera con la demo. Cuando esté hecha, aquí verás la captura, el veredicto y la fecha.

Paso a paso

Cómo usarlo en 4 pasos

  1. 01

    Personaliza

    Rellena el formulario de arriba con el nombre, los colores y los textos de tu cliente. Se meten en el prompt al copiar.
  2. 02

    Copia el Completo o el Lite

    El Completo, para Claude, ChatGPT, Gemini o Cursor. El Lite, más corto, para Lovable, Bolt o v0, que aceptan menos texto.
  3. 03

    Pega e itera

    Pégalo en una conversación nueva. Si quieres cambiar algo, pídelo con una frase corta:
    • «Hazla redonda como una E0 y quita el chorro»
    • «Que gire el doble de rápido y el chorro sea violeta»
    • «Úsala como fondo de la sección del manifiesto, sin titular»
    • «Añade una cuarta paleta verde esmeralda»
  4. 04

    Publica

    Guarda el resultado como HTML (o en tu proyecto) y súbelo a Vercel, Netlify o tu hosting de siempre. Tienes los pasos en la guía.

Guías por herramientaClaudeChatGPTGeminiCursorLovableBoltv0

Licencia en claro

Qué puedes hacer con esta pieza

Todas las piezas incluyen licencia de uso comercial. Usa el resultado tal cual en tus productos, encargos freelance o webs de clientes, sin atribución.

Puedes

  • Usarlo en tus webs y en las de tus clientes, también si cobras por ellas.
  • Cambiarlo todo lo que quieras.
  • Publicar el resultado sin citarnos.

No puedes

  • Revender o regalar el prompt, la demo o el código como plantilla o biblioteca.
  • Compartir tu cuenta Pro.

Es la misma licencia para lo gratis y lo Pro. La tienes entera en licencia de uso.

Preguntas frecuentes

Lo que suele preguntarse

¿Pesa mucho para el móvil?
No usa librerías ni imágenes: son unos 28 KB de código. En móvil baja a 70.000 estrellas y DPR 1,5, y el bucle se detiene cuando la escena sale de pantalla o la pestaña queda oculta.
¿Puedo ponerla de fondo de una sección en vez de a pantalla completa?
Sí. Cambia el contenedor a position: absolute dentro de la sección y usa el alto de la sección en lugar de 100svh; el prompt explica el cambio y la pausa fuera de pantalla ya viene incluida.
¿Cómo cambio los colores?
Con las tres variables de color del personalizador (núcleo, halo y chorro) cambias la paleta de inicio; las paletas Glaciar y Rubí se editan en el objeto PALETAS del script.
¿Qué pasa si el navegador no tiene WebGL2?
Se muestra un degradado ovalado con los mismos colores de núcleo y halo, y la interfaz sigue funcionando.
¿Qué diferencia hay entre el prompt Completo y el Lite?
El Completo (≈12131 tokens) describe la pieza con todo detalle y es el que mejor resultado da en Claude, ChatGPT, Gemini o Cursor. El Lite (≈2081 tokens) resume lo esencial para herramientas que aceptan menos texto, como Lovable, Bolt o v0.

Versión 1.0 · publicada el 30-09-2026

Cópialo desde aquí

Tu navegador no nos deja escribir en el portapapeles. El texto ya está seleccionado: pulsa Ctrl + C (o ⌘ + C) o el botón.