NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia Suite Atlas (suiteatlas.com) siguiendo el patrón de diseño del sitio analizado. Utiliza únicamente HTML, Tailwind CSS vía CDN y JavaScript vanilla en un único archivo. Paleta de colores: #F5F0E6 (tan claro), #1E3A8A (azul profundo), #FFFFFF (blanco), #000000 (negro) y acentos #3B82F6 (azul brillante). Tipografía: Inter (Google Fonts) para títulos y texto, peso 400-700.
Estructura:
- <header> con barra de navegación fija: logo a la izquierda, menú principal (About, Pricing, Blog, Contact), dropdown "Features" con 4 enlaces, botón secundario "Login" y botón primario "Get Unlimited Access". Responsivo con hamburguesa en móvil.
- Banner superior con mensaje informativo y botón de cierre (ocultar con JS).
- <section class="hero"> con título
3.709 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
3.709 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 Banner superior informativo con botón de cierre
- 1.2 Barra de navegación fija con logo, menú principal, dropdown de funcionalidades, enlaces a blog y contacto, y botones de login y CTA
- 1.3 Hero principal con título, subtítulo, botón principal y imagen ilustrativa
- 1.4 Slider de logos de clientes
- 1.5 Bloque de características en tres columnas con iconos, títulos y descripciones
- 1.6 Tarjeta destacada con título centrado, texto explicativo, imagen a la derecha y botón de enlace
- 1.7 Footer con enlaces de empresa, productos, recursos y contacto
ABOUT
- 2.1 Sección encabezado con título y párrafo descriptivo
- 2.2 Imagen ilustrativa a la izquierda y texto a la derecha
- 2.3 Lista de valores o misión en tarjetas
PRICING
- 3.1 Tabla de planes con tres columnas, encabezados y botones de selección
- 3.2 Comparativa de características en filas
BLOG
- 4.1 Lista de artículos con imagen, título, extracto y enlace "Leer más"
- 4.2 Paginación al final de la lista
CONTACT
- 5.1 Formulario de contacto con campos nombre, email, mensaje y botón enviar
- 5.2 Información de contacto y mapa integrado
PROMPTS RELACIONADOS · SAAS / STARTUP
