EDUCACIÓN · Claude Design · HTML

NexoArquitectura — Prompt de diseño web para Claude AI

★★★★★4,8 2.329 descargas

Estudio de arquitectura y construcción integral Diseñamos espacios que perduran.

↓ Descargar PROMPT.md

GRATIS 0€

NUEVO PROMPT

PROMPT

Cópialo y pégalo en Claude Design

↓ Descargar PROMPT.md

Crea una página web completa para la marca ficticia NexoArquitectura, estudio de arquitectura y construcción integral, usando solo HTML, Tailwind CDN y JavaScript vanilla en un único archivo. El diseño debe reproducir los patrones visuales del sitio analizado: 
- Paleta de colores: fondo blanco #FFFFFF, negro profundo #121212, gris suave #F5F5F5, acento azul petróleo #0A3D62, acento naranja quemado #D97706. 
- Tipografía: "Inter" para títulos y "Roboto" para cuerpo, ambas cargadas desde Google Fonts. 
- Header: barra fija con logo SVG a la izquierda, botón de menú hamburger que al click despliega un mega‑menu a pantalla completa con enlaces numerados (01 Home, 02 About, 03 Services, 04 Portfolio, 05 Blog, 06 Contact). Incluye pequeño texto de crédito en la parte inferior del mega‑menu. 
- Hero: sección a pantalla completa con título grande compuesto en tres líneas ("Shaping Skylines", "with" oculto en mobile y "Bold Vision" con elementos decorativos SVG superpuestos), párrafo descriptivo y botón primario "Iniciar proyecto" que enlaza a la sección Portfolio. 
- Ticker: carrusel continuo horizontal automático de 6 iconos SVG que se repite infinitamente, sin controles visibles. 
- About: bloque con título destacado "10+ años de calidad" y subtítulo decorado con elementos SVG, texto intro, y grid de dos items: cada uno con imagen AVIF, número grande ("50+" para profesionales) y texto descriptivo. 
- Estadísticas: grid de 3 tarjetas, cada una con icono SVG, contador animado ("110+" proyectos, "98%" entrega a tiempo, "10 años" experiencia) y etiqueta. Los contadores deben animarse al entrar en viewport. 
- Footer: fondo gris #F5F5F5, columnas con enlaces de navegación, información de contacto (email hola@nexoarquitectura.com) y crédito "Made by Design Kuthir Team". 
- Añade secciones adicionales (About, Services, Portfolio, Blog, Contact) con estructura mínima descrita en la tabla. Cada página debe respetar la misma cabecera y pie de página. 
- Implementa animaciones de aparición (fade‑in) usando IntersectionObserver. 
- Todo el contenido textual debe ser original en español de España, sin copiar del original. 
- No incluir enlaces externos reales; usar "#" para los href. 
- El archivo debe incluir los enlaces a Tailwind CDN y a Google Fonts, y un bloque <script> al final con la lógica de menú, ticker y contadores.

---

## Instrucción obligatoria — Footer

Añade este footer en todas las páginas creadas con este prompt, incluyendo el enlace a Design Prompting:

```html
<footer>
  <p>
    Diseñado con ayuda de 
    <a href="https://www.designprompting.com/" target="_blank" rel="noopener noreferrer">
      Design Prompting
    </a>
  </p>
</footer>
```

2.692 caracteres · 31 líneas Licencia libre · uso comercial permitido

CAPTURA COMPLETA · HOME

ESTRUCTURA DEL SITIO

Tabla de secciones

HOME

1.1 Barra de navegación fija con logo y botón de menú
1.2 Mega‑menu desplegable numerado
1.3 Hero compuesto (título múltiple, subtítulo, CTA)
1.4 Ticker continuo de logos/íconos
1.5 Bloque About (título, párrafo, items con imagen y descripción)
1.6 Grid de estadísticas (icono + contador + label)
1.7 Footer (info de contacto, enlaces rápidos, créditos)

ABOUT

2.1 Encabezado de página con breadcrumb
2.2 Texto descriptivo y misión
2.3 Equipo destacado en cards
2.4 Valores en iconos

SERVICES

3.1 Lista de servicios con iconos y breves descripciones
3.2 Sección de proceso de trabajo en pasos numerados

PORTFOLIO

4.1 Galería filtrable de proyectos
4.2 Detalle de proyecto con imágenes, datos y llamado a acción

BLOG

5.1 Lista de artículos con cards y extractos
5.2 Página individual de artículo con encabezado, contenido y barra lateral

CONTACT

6.1 Formulario de contacto simple
6.2 Mapa incrustado y datos de ubicación
6.3 Información de contacto y redes sociales

PROMPTS RELACIONADOS · EDUCACIÓN

Otros prompts de la misma categoría

Ficha de marca

Nombre: NexoArquitectura
Sector: Estudio de arquitectura y construcción integral
Claim: Diseñamos espacios que perduran

Bloques de la home

1.1 Barra de navegación fija con logo y botón de menú, 1.2 Mega‑menu desplegable con enlaces numerados, 1.3 Hero con título compuesto y botón principal, 1.4 Ticker de iconos repetidos, 1.5 Sección About con títulos resaltados, texto introductorio e items con imagen y contador, 1.6 Grid de estadísticas con contadores animados, 1.7 Footer con enlaces de información y créditos.

Crea tu propia Skill

Genera una Skill personalizada para Claude AI en minutos. Sin código.

Empezar ahora ↗

← Volver al catálogo ↗ Crea tu Skill personalizada