NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia "AeroPixel" (agencia digital) usando solo un archivo HTML con Tailwind CSS a través de CDN y JavaScript vanilla. El sitio debe incluir:
- **Paleta de colores**: #0F172A (gris noche), #1E293B (gris más claro), #0EA5E9 (azul aguamarina accent), #F8FAFC (blanco nieve) y #64748B (texto secundario).
- **Tipografía**: Inter (sans-serif) para títulos y body, con pesos 400, 600, 700. Importar desde Google Fonts.
- **Header**: barra fija en la parte superior, fondo #0F172A, logo SVG al estilo minimalista (usar placeholder), menú hamburguesa oculto en móvil, botón de carrito a la derecha con badge de cantidad.
- **Hero**: sección full‑height, fondo degradado de #0F172A a #1E293B, texto centrado con título grande (text‑6xl, font‑bold, color #F8FAFC),
4.026 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.026 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 fijo con logo SVG y botón de carrito
- 1.2 Hero con título grande, subtítulo y botón principal
- 1.3 Bloque de servicios en cuadrícula de 3 columnas con íconos y texto
- 1.4 Galería de proyectos destacados en tarjetas con hover
- 1.5 Sección de testimonios en carrusel sencillo
- 1.6 Blog con tarjetas resumidas de artículos
- 1.7 Footer con logo, enlaces rápidos, newsletter y datos de contacto
SERVICIOS
- 2.1 Header (reutiliza el de Home)
- 2.2 Lista de servicios en cuadrícula expandida
- 2.3 Detalle de cada servicio con imágenes y texto
- 2.4 CTA para contactar
- 2.5 Footer (reutiliza)
PROYECTOS
- 3.1 Header
- 3.2 Galería completa con filtro por categoría
- 3.3 Modal de proyecto con información y galería de imágenes
- 3.4 Footer
BLOG
- 4.1 Header
- 4.2 Lista de artículos en tarjetas
- 4.3 Página de artículo individual con encabezado, contenido y comentarios
- 4.4 Footer
CONTACTO
- 5.1 Header
- 5.2 Formulario de contacto con campos nombre, email, mensaje y botón enviar
- 5.3 Mapa incrustado y datos de contacto
- 5.4 Footer
PROMPTS RELACIONADOS · AGENCIA DIGITAL
