NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web estático de una agencia de diseño ficticia llamada Diseño Majuelo usando HTML + Tailwind CDN (single file) y JavaScript vanilla para animaciones simples. Reproduce la estructura y estética del sitio analizado, sin copiar textos ni imágenes originales.
**Paleta de colores**:
- #0A0A0A (negro profundo para fondos y textos principales)
- #FFFFFF (blanco puro para textos contrastantes)
- #F5F5F5 (gris muy claro para fondos de secciones)
- #D9D9D9 (gris medio para bordes y separadores)
- #FFB800 (amarillo cálido para acentos, botones y badges)
**Tipografía**:
- Titulares: "DM Serif Display", peso bold, tamaño variable (h1 4rem, h2 2.5rem, h3 1.75rem).
- Cuerpo: "Inter", peso regular, 1rem base, líneas de 1.6.
- Utiliza clases Tailwind personalizadas para fuentes (`
5.723 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
5.723 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 con logo y menú hamburguesa
- 1.2 Hero con imagen lateral y texto rotativo
- 1.3 Sección de marcas (galería de logotipos)
- 1.4 Sobre mí con foto, badge y contadores
- 1.5 Servicios en tarjetas con iconos
- 1.6 Proyectos destacados en rejilla
- 1.7 Testimonios
- 1.8 Blog reciente
- 1.9 Llamada a la acción y formulario de contacto
- 1.10 Pie de página con enlaces y redes sociales
SERVICIOS
- 2.1 Header interno con logo y menú sencillo
- 2.2 Lista de servicios en tarjetas
- 2.3 CTA de contacto
- 2.4 Footer idéntico al de Home
PROYECTOS
- 3.1 Header interno
- 3.2 Grid de proyectos con filtro por categoría
- 3.3 Detalle de proyecto (imagen, descripción, tags)
- 3.4 CTA de proyecto relacionado
- 3.5 Footer
BLOG
- 4.1 Header interno
- 4.2 Lista de entradas en tarjetas con imagen y extracto
- 4.3 Sidebar con categorías y últimos posts
- 4.4 Footer
CONTACTO
- 5.1 Header interno
- 5.2 Formulario de contacto con campos nombre, email, mensaje
- 5.3 Mapa estático o coordenadas
- 5.4 Footer
PROMPTS RELACIONADOS · PORTFOLIO
