NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web estático en un único archivo HTML que reproduzca el diseño visual y la estructura del sitio analizado, usando la marca ficticia "Diseño Austral". Emplea Tailwind CSS vía CDN y JavaScript vanilla para interacciones. Paleta de colores: #0A0A0A (fondo negro profundo), #FFFFFF (texto blanco), #FF6F61 (acento coral), #4A90E2 (acento azul), #F5F5F5 (grises suaves). Tipografía: "Inter" para títulos y "Roboto" para cuerpo, importadas desde Google Fonts.
Estructura:
- Loader al cargar la página con barra de progreso al 100% y logotipo centrado.
- Header fijo con logo (SVG placeholder), texto "#1 Agencia Creativa" y botón secundario "Contact" que abre la página de contacto.
- Menú lateral ocultable (hamburguesa) que muestra enlaces: Home, About, Work, Blog, Contact, y sección de c
4.157 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.157 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 Loader con barra de progreso
- 1.2 Header fijo con logo, slogan y botón de contacto
- 1.3 Menú lateral ocultable con enlaces y redes sociales
- 1.4 Hero principal con títulos superpuestos, subtítulo, botón CTA y datos de reputación
- 1.5 Sección de beneficios (marquee)
- 1.6 Sección de servicios con tarjetas
- 1.7 Portafolio de trabajos
- 1.8 Testimonios y valoración de clientes
- 1.9 Llamada a la acción final
- 1.10 Footer con información de contacto y enlaces
ABOUT
- 2.1 Cabecera interna con logo y breadcrumb
- 2.2 Texto descriptivo de la agencia
- 2.3 Equipo con tarjetas de perfil
- 2.4 Valores y timeline
- 2.5 CTA a contacto
WORKS
- 3.1 Cabecera interna
- 3.2 Grid de proyectos con filtro
- 3.3 Modal de proyecto
- 3.4 CTA a portafolio completo
BLOG
- 4.1 Cabecera interna
- 4.2 Lista de artículos en tarjetas
- 4.3 Sidebar con categorías y suscripción
- 4.4 Pagination
CONTACT
- 5.1 Cabecera interna
- 5.2 Formulario de contacto con campos nombre, email, mensaje
- 5.3 Mapa estático
- 5.4 Información de contacto y redes
PROMPTS RELACIONADOS · PORTAFOLIO
