NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia Media Titan, agencia digital de branding, usando solo HTML, Tailwind CSS CDN y JavaScript vanilla en un único archivo. Reproduce fielmente la estructura y estilo del sitio fuente:
- Paleta de colores: #0d0d0d (fondo principal), #ffffff (texto), #e5e5e5 (bordes y secundarios), #ff6600 (accento), #4a4a4a (gris oscuro).
- Tipografía: Inter (Google Font) para títulos y body, peso 400/600/700 según necesidad.
- Header: logo a la izquierda, iconos sociales (X, Instagram, LinkedIn, Dribbble) a la derecha, botón de carrito con contador, menú hamburguesa animado que despliega un overlay con navegación numerada (01 Home, 02 About, 03 Services, 04 Portfolio, 05 Contact).
- Home sections:
1. Hero con fondo oscuro y foto de estudio, título grande
3.508 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.508 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 Header con logo, iconos sociales y carrito
- 1.2 Menú hamburguesa con navegación numerada
- 1.3 Hero principal con título, subtítulo y botón CTA
- 1.4 Bloque de servicios (grid 3 columnas)
- 1.5 Portafolio destacado (carrusel de tarjetas)
- 1.6 Testimonios (carrusel de quotes)
- 1.7 CTA de contacto
- 1.8 Footer con enlaces, redes, newsletter y datos de la empresa
ABOUT
- 2.1 Header reutilizado
- 2.2 Banner interno con título "Sobre nosotros"
- 2.3 Texto descriptivo y misión
- 2.4 Equipo (grid de fotos y nombres)
- 2.5 CTA para colaborar
- 2.6 Footer reutilizado
SERVICES
- 3.1 Header reutilizado
- 3.2 Lista de servicios con iconos y descripciones
- 3.3 Proceso de trabajo en pasos numerados
- 3.4 CTA de presupuesto
- 3.5 Footer reutilizado
PORTFOLIO
- 4.1 Header reutilizado
- 4.2 Galería filtrable de proyectos (grid responsive)
- 4.3 Detalle de proyecto modal
- 4.4 CTA para iniciar proyecto
- 4.5 Footer reutilizado
CONTACT
- 5.1 Header reutilizado
- 5.2 Formulario de contacto con campos nombre, email, mensaje
- 5.3 Mapa incrustado
- 5.4 Información de contacto y redes
- 5.5 Footer reutilizado
PROMPTS RELACIONADOS · AGENCIA DIGITAL
