SAAS / STARTUP · Claude Design · HTML

Nexora Cloud — Prompt de diseño web para Claude AI

★★★★★4,8 971 descargas

Plataforma SaaS de gestión y automatización empresarial Herramientas simples para impulsar tu operación.

↓ Descargar PROMPT.md

GRATIS 0€

NUEVO PROMPT

PROMPT

Cópialo y pégalo en Claude Design

↓ Descargar PROMPT.md

Crea un sitio web estático en un único archivo HTML que reproduzca el diseño visual y la estructura de la web analizada, pero bajo la marca ficticia Nexora Cloud. Usa Tailwind CSS vía CDN y JavaScript vanilla (sin frameworks) para interactividad. 

**Paleta de colores**: 
- #0A2740 (rich navy) 
- #1E3A5F (dark navy) 
- #3A8DFF (primary blue) 
- #F5F7FA (light gray background) 
- #FFFFFF (white) 
- #6B7C93 (muted text) 

**Tipografía**: 
- Fuente principal: Inter (sans-serif) 
- Fuente secundaria: Roboto Mono para código y detalles pequeños 

**Header**: barra superior estrecha con mensaje promocional "Ahorra 25% en planes anuales (tiempo limitado)"; logo a la izquierda, menú de navegación con ítems Home, Soluciones, Precios, Blog, Contacto; cada ítem que tenga sub‑menú despliega una lista de enlaces. Botón destacado a la derecha "Contáctanos" y número de teléfono visible en escritorio. Menú móvil colapsable con ícono hamburguesa.

**Hero**: sección full‑width con fondo claro, título grande "Impulsa tu negocio con Nexora Cloud" y subtítulo descriptivo. Texto animado en bucle que muestra palabras como "Eficiencia", "Escalabilidad", "Innovación". Imagen a la derecha (placeholder). Botón CTA "Comienza ahora" y enlace secundario "Ver planes".

**Bloque 1 – Características**: cuadrícula 3‑columna (desktop) con icono, título y breve descripción para cada característica (automatización, analítica, integración). Fondo alternado blanco.

**Bloque 2 – Métricas**: barra con 4 contadores grandes centrados (usuarios activos, transacciones, horas ahorradas, satisfacción). Animación numérica al entrar en viewport.

**Bloque 3 – Testimonios**: carousel horizontal con tarjetas de cliente (foto, nombre, cargo, comentario). Flechas laterales y paginación por puntos.

**Bloque 4 – Planes de precios**: tres tarjetas alineadas, cada una con título del plan, precio (texto genérico), lista de beneficios y botón "Seleccionar". Destacar el plan medio con borde resaltado.

**Bloque 5 – CTA final**: fondo azul primario, texto centrado "Listo para transformar tu operación" y formulario simple de captura de email + botón "Solicitar demo".

**Footer**: fondo navy, columnas: 
- Logo y breve claim; 
- Enlaces rápidos (Home, Soluciones, Precios, Blog, Contacto); 
- Contacto (teléfono, email); 
- Redes sociales (iconos SVG para Facebook, LinkedIn, X, Instagram). Texto de copyright.

**Interactividad**: 
- Menú dropdowns con transición suave. 
- Contadores que incrementan al scroll. 
- Carousel de testimonios con autoplay y control manual. 
- Formulario de suscripción con validación básica de email.

**Requisitos técnicos**: 
- Incluir `<script src="https://cdn.tailwindcss.com"></script>` al inicio. 
- Definir configuraciones de Tailwind para colores personalizados. 
- Todo el CSS debe estar en línea mediante la CDN; los estilos específicos pueden añadirse en una etiqueta `<style>`.
- JavaScript al final del body, sin dependencias externas.
- Utilizar atributos ARIA para accesibilidad en menús y carousel.
- Mantener el HTML semántico (header, nav, main, section, footer).
- Optimizar para dispositivos móviles (responsive) siguiendo la estructura de la versión original.

Entrega solo el código completo del archivo HTML sin comentarios externos.

---

## 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>
```

3.607 caracteres · 67 líneas Licencia libre · uso comercial permitido

CAPTURA COMPLETA · HOME

ESTRUCTURA DEL SITIO

Tabla de secciones

HOME

1.1 Barra superior con aviso promocional
1.2 Navegación principal con logo, menú desplegable y botones de contacto
1.3 Hero principal con título grande y animación de texto en bucle
1.4 Bloque de características destacadas en cuadrícula
1.5 Sección de métricas estadísticas con contadores
1.6 Testimonios con carousel
1.7 Planes de precios en tarjetas comparativas
1.8 Llamado a la acción final y formulario de suscripción
1.9 Footer con enlaces, datos de contacto y redes sociales

ABOUT

2.1 Imagen destacada y descripción de la empresa
2.2 Valores y misión en columnas
2.3 Equipo con tarjetas de perfil
2.4 CTA a contacto

FEATURES

3.1 Lista de funcionalidades con iconos y descripciones
3.2 Sección de integración con logos de partners
3.3 Demo interactiva (placeholder)

PRICING

4.1 Tabla comparativa de tres planes con botones de selección
4.2 FAQ accordion

CONTACT

5.1 Formulario de contacto sencillo
5.2 Mapa estático (placeholder)
5.3 Información de teléfono y email

BLOG

6.1 Lista de artículos en tarjetas con imagen, fecha y extracto
6.2 Sidebar con categorías y últimos posts
6.3 Paginación

PROMPTS RELACIONADOS · SAAS / STARTUP

Otros prompts de la misma categoría

Ficha de marca

Nombre: Nexora Cloud
Sector: Plataforma SaaS de gestión y automatización empresarial
Claim: Herramientas simples para impulsar tu operación

Bloques de la home

1.1 Barra superior con aviso promocional
1.2 Navegación principal con logo, menú desplegable y botones de contacto
1.3 Hero principal con título grande y animación de texto en bucle
1.4 Bloque de características destacadas en cuadrícula
1.5 Sección de métricas estadísticas con contadores
1.6 Testimonios con carousel
1.7 Planes de precios en tarjetas comparativas
1.8 Llamado a la acción final y formulario de suscripción
1.9 Footer con enlaces, datos de contacto y redes sociales

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