CORPORATIVO · Claude Design · HTML

Ágora Creciente — Prompt de diseño web para Claude AI

★★★★★4,8 1.501 descargas

Agencia de marketing digital especializada en growth hacking Impulsamos el crecimiento digital de marcas emergentes.

↓ 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 Ágora Creciente (agoracreciente.com) siguiendo el patrón visual del sitio analizado. Utiliza HTML estático con Tailwind CSS vía CDN y JavaScript vanilla en un único archivo.

**Paleta de colores**
- Primario: #FF6B35 (naranja vibrante)
- Secundario: #1A202C (gris oscuro para fondos y textos)
- Acéntico: #F5F5F5 (gris claro para secciones separadoras)
- Texto principal: #2D3748
- Blanco: #FFFFFF

**Tipografía**
- Fuente principal: 'Inter', sans-serif (cargar desde Google Fonts)
- Fuente secundaria para títulos: 'Poppins', sans-serif

**Estructura**
1. **Header / Navbar** – barra fija con logo a la izquierda, enlaces principales (Inicio, Sobre nosotros, Servicios, Portfolio, Blog, Contacto), dropdowns para páginas y utilidades en versión desktop; menú hamburguesa colapsable en móvil. Botón primario "Reserva una llamada" con fondo naranja y efecto hover.
2. **Hero** – contenedor flex col‑md (texto a la izquierda, imagen a la derecha). Título grande "Growth Hacking" con punto naranja resaltado, subtítulo descriptivo, botón secundario (estilo outline) "Reserva una llamada" y línea decorativa bajo el botón. Imagen de fondo responsiva (placeholder) con overlay tenue.
3. **Separador de servicios** – línea fina con margen vertical, color #F5F5F5.
4. **Bloque de imagen destacada** – grid de 2 columnas: texto superpuesto en la columna izquierda con tres líneas de frase ("Push Limits", "Pull Together", "and Unite the Culture.") y imagen de alta resolución en la derecha que abre lightbox al hacer clic.
5. **Footer** – fondo #1A202C, columnas con enlaces de navegación (Home, About, Services, Work, Blog, Contact), enlaces de utilidad (Política de privacidad, Términos, Style guide, 404), datos de contacto (email, teléfono) y redes sociales (iconos SVG). Texto en gris claro.

**Requisitos técnicos**
- Usa Tailwind CDN (`<script src="https://cdn.tailwindcss.com"></script>`) y configura colores personalizados vía `tailwind.config` inline.
- Añade interactividad mínima: toggler de menú móvil, smooth scroll para anclas y apertura de lightbox (implementa con un simple modal vanilla).
- Todas las secciones deben ser responsivas (mobile‑first). Utiliza utilidades de Tailwind para espaciado, tipografía y flexbox/grid.
- Incluye meta etiquetas básicas, favicon y `lang="es"`.
- Mantén el HTML semántico (header, nav, main, section, footer).
- No incluyas ningún texto copiado del original; genera copy original en español de España.

Entrega el archivo completo listo para abrir en el navegador.

---

## 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.903 caracteres · 46 líneas Licencia libre · uso comercial permitido

CAPTURA COMPLETA · HOME

ESTRUCTURA DEL SITIO

Tabla de secciones

HOME

1.1 Navbar con logo, enlaces principales y dropdowns responsive
1.2 Hero con título destacado, subtítulo, botón secundario y mensaje breve
1.3 Separador visual de servicios
1.4 Bloque de imagen grande con textos superpuestos y overlay
1.5 Footer con enlaces de navegación y datos de contacto

ABOUT

2.1 Sección introductoria con imagen y texto descriptivo
2.2 Valores o misión en columnas
2.3 Equipo con tarjetas avatar
2.4 Footer

SERVICE

3.1 Lista de servicios en tarjetas con iconos
3.2 Detalle de proceso en pasos numerados
3.3 CTA y formulario de contacto breve
3.4 Footer

WORK

4.1 Galería de proyectos en grid responsive
4.2 Caso de estudio destacado con texto e imágenes
4.3 Testimonios en carousel
4.4 Footer

BLOG

5.1 Lista de artículos en cards con imagen, título y excerpt
5.2 Sidebar con categorías y últimos posts
5.3 Paginación
5.4 Footer

CONTACT

6.1 Formulario de contacto con campos nombre, email, mensaje
6.2 Mapa incrustado
6.3 Información de contacto y redes sociales
6.4 Footer

PROMPTS RELACIONADOS · CORPORATIVO

Otros prompts de la misma categoría

Ficha de marca

Nombre: Ágora Creciente
Sector: Agencia de marketing digital especializada en growth hacking
Claim: Impulsamos el crecimiento digital de marcas emergentes

Bloques de la home

1.1 Navbar con logo, enlaces principales y dropdowns responsive
1.2 Hero con título destacado, subtítulo, botón secundario y mensaje breve
1.3 Separador visual de servicios
1.4 Bloque de imagen grande con textos superpuestos y overlay
1.5 Footer con enlaces de navegación y datos de contacto

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