NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia "Estudio Digital Austral" (agencia digital) usando HTML sencillo, Tailwind CSS vía CDN y JavaScript vanilla en un único archivo. Emplea una paleta monocromática: negro #000000, gris oscuro #1a1a1a, gris medio #333333, gris claro #777777 y blanco #ffffff. Tipografía: Inter (sans-serif) para encabezados y cuerpo. Incluye:
- Preloader centrado con animación de 8 fragmentos giratorios que muestra el logotipo (SVG placeholder). Desaparece tras 2 s.
- Header fijo, fondo negro, logo a la izquierda (placeholder), enlaces de navegación (Sobre, Servicios, Portafolio, Blog, Contacto) con efecto de texto que se desplaza al pasar el cursor. Menú hamburguesa para móviles que abre un panel lateral con los mismos enlaces.
- Hero a pantalla completa, fond
3.782 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.782 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 Preloader animado con logotipo
- 1.2 Header fijo con logo y menú hamburguesa
- 1.3 Hero principal con título destacado y CTA
- 1.4 Sección de servicios en cuadrícula de 3 columnas
- 1.5 Portafolio con filtro y tarjetas hover
- 1.6 Testimonios con carrusel
- 1.7 Blog destacado con tarjetas
- 1.8 Llamada a la acción final
- 1.9 Footer con enlaces, redes y datos de contacto
SERVICIOS
- 2.1 Encabezado de sección con subtítulo
- 2.2 Lista de servicios en tarjetas con íconos y descripción breve
- 2.3 Botón de más información
PORTAFOLIO
- 3.1 Filtro por categoría
- 3.2 Cuadrícula de proyectos con efecto hover y título
- 3.3 Enlace a detalle del proyecto
TESTIMONIOS
- 4.1 Carrusel de citas de clientes
- 4.2 Foto y nombre del cliente
- 4.3 Texto de testimonio
BLOG
- 5.1 Tarjetas de artículos recientes con imagen, título y extracto
- 5.2 Botón ver más blog
CONTACTO
- 6.1 Formulario sencillo (nombre, email, mensaje)
- 6.2 Información de contacto y mapa estático
- 6.3 Botones de redes sociales
FOOTER
- 7.1 Navegación secundaria
- 7.2 Datos de empresa y copyright
- 7.3 Enlaces a políticas y términos
PROMPTS RELACIONADOS · AGENCIA DIGITAL
