NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una web estática para la marca ficticia **Códexia Studios** (agencia digital de desarrollo full‑stack) usando **HTML**, **Tailwind CSS (CDN)** y **JavaScript vanilla** en un único archivo. Replicar la estructura visual del sitio analizado sin copiar ningún texto ni recurso original.
**Paleta de colores**
- Primario: #0A0A0A (negro profundo)
- Secundario: #F5F5F5 (gris muy claro)
- Acento 1: #0D6EFD (azul vibrante)
- Acuerdo 2: #FF6F61 (coral suave)
- Texto principal: #212529 (gris casi negro)
**Tipografía**
- Fuente principal: "Inter", sans‑serif (cargar desde Google Fonts)
- Fuente secundaria: "IBM Plex Mono", monospace para títulos de código
**Header**
- Barra de navegación fija, fondo blanco con sombra ligera.
- Logo a la izquierda: texto "Códexia Studios" con la palabra "Códex
4.783 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.783 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 fija con logo, navegación principal, botón CTA y menú móvil
- 1.2 Hero con video de fondo, texto de bienvenida y animación Lottie
- 1.3 Bloque "Sobre mí" con subtítulo, párrafo descriptivo y foto
- 1.4 Bloque de datos de experiencia (años, reseñas) con iconos
- 1.5 Sección de Servicios: tarjetas animadas Frontend, Backend, Bases de datos
- 1.6 Footer con enlaces, redes y datos de contacto
ABOUT US
- 1.1 Cabecera reutilizada
- 1.2 Banner interno con título y breadcrumb
- 1.3 Texto descriptivo ampliado y equipo
- 1.4 Valores y misión en tarjetas
- 1.5 CTA de contacto
SERVICES
- 1.1 Cabecera reutilizada
- 1.2 Lista de servicios con iconos animados y descripciones
- 1.3 Caso de estudio destacado
- 1.4 Formulario breve de consulta
BLOG
- 1.1 Cabecera reutilizada
- 1.2 Grid de artículos con imágenes, títulos y extractos
- 1.3 Sidebar con categorías y últimos posts
- 1.4 Paginación
CONTACT US
- 1.1 Cabecera reutilizada
- 1.2 Formulario de contacto completo (nombre, email, mensaje)
- 1.3 Mapa embed y datos de ubicación
- 1.4 Información de contacto rápido
PROMPTS RELACIONADOS · AGENCIA DIGITAL
