NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia "Formación Jade" (agencia digital de producción audiovisual) usando únicamente HTML, Tailwind CSS (CDN) y JavaScript vanilla en un único archivo. Reproduce fielmente la estructura y estilo del sitio original descrito:
- **Paleta de colores**: #0A0A0A (negro profundo), #FFFFFF (blanco), #E63946 (rojo accent), #F1FAEE (gris claro), #A8DADC (azul pastel).
- **Tipografía**: Fuente principal "Inter" (sans‑serif) para texto, "Playfair Display" para títulos.
- **Header**: barra de navegación fija, fondo negro translúcido, logo a la izquierda (placeholder SVG), enlaces "About", "Work", "Services" y botón de contacto primario con borde animado y texto en mayúsculas.
- **Hero**: sección fullscreen con video de fondo (auto‑play, muted, loop), overlay
4.013 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.013 caracteres · licencia libre
Solo descarga completa disponible
CAPTURA COMPLETA · HOME
Para que Claude replique el diseño con máxima fidelidad, descarga la imagen y adjúntala en tu chat.
Descargar captura
ESTRUCTURA DEL SITIO
Tabla de secciones
HOME
- 1.1 Cabecera fija con logo, menú y botón "GET IN TOUCH".
- 1.2 Hero con video de fondo, título principal, párrafo descriptivo y botón principal.
- 1.3 Sección About con etiqueta "About Us", título secundario, imagen a la izquierda, tres estadísticas animadas (Proyectos, Clientes, Países) y varios párrafos de presentación con botón.
- 1.4 (Placeholder) Bloque de Servicios con tarjetas iconográficas.
- 1.5 (Placeholder) Bloque de Portfolio con galería en cuadrícula.
- 1.6 Footer con datos de contacto, redes sociales y enlaces de navegación.
SERVICES
- 2.1 Encabezado de página Servicios con título y descripción breve.
- 2.2 Lista de servicios en tarjetas con icono, título y breve texto.
- 2.3 CTA final con botón de contacto.
PORTFOLIO
- 3.1 Encabezado de página Portfolio con título.
- 3.2 Galería de proyectos en mosaico responsivo.
- 3.3 Modal de vista ampliada para cada proyecto.
CONTACTO
- 4.1 Formulario de contacto con campos nombre, email, asunto y mensaje.
- 4.2 Información de contacto directa y mapa incrustado.
- 4.3 Botón de envío y mensaje de confirmación.
POLÍTICA DE PRIVACIDAD
- 5.1 Texto de política de privacidad estructurado en secciones.
- 5.2 Enlace de retorno al footer.
PROMPTS RELACIONADOS · EDUCATION
