KAGERŌ

Qué incluye

Prompts

HTML · 823 líneas / React · 734 líneas

Medios

Escena WebGL · Canvas

Alojamiento

cdn.orbital.supply, ya incluido en el prompt

Tipografías

Epilogue · Google Fonts

HTML

Un archivo, sin librerías

React

React 19.3.0 · Tailwind 4.3.3 · Vite 8.3.2 · TypeScript 6.0.3

Movimiento

loader, focus-pull, rack-focus, blur-stagger

Probada y documentada

08 de octubre de 2026

• Reproducida en Claude
• Reconstruida a ciegas desde el prompt: React y HTML
• Revisada a 375, 768, 1440, 1920 px
• Revisor de la spec: 0 errores, sin enlaces a generadores

Cómo usarla

1. Claude

   Pega el prompt de HTML en un chat nuevo. Obtienes un index.html para servir por HTTP o publicar donde quieras.

2. Vite + React

   Abre un proyecto vacío de Vite + React y pega el prompt de React. Indica los paquetes exactos; las URLs de los recursos ya están dentro.

El prompt

Extracto / 734 líneas en el prompt completo

# Build: "KAGERŌ — a studio hero" — a grainy liquid gradient that racks in and out of focus behind two giant words

## 0. Brief

KAGERŌ (fictional; 陽炎 is the shimmer of hot air that blurs a street) is an independent brand and motion studio in Osaka. The hero is one full screen: a liquid gradient of petrol and rust on black, with fine film grain, that breathes in and out of focus on its own. The pointer pulls the area around it into focus and drags the liquid; hovering or focusing the call to action closes autofocus brackets on it and racks the whole field sharp. A lens-like loader focuses the wordmark letter by letter while a distance scale slides from infinity to 0.6 m, then focus passes from the logo to the field. The layout is editorial: "Into" huge at the top left, "focus" huge at the bottom right, a small justified paragraph under the first word. Every small label defocuses and refocuses letter by letter on hover.

El prompt completo se desbloquea en el lanzamiento.