SAAS / STARTUP · TailwindCSS · HTML5 · Vanilla JS

JurisNova – Soluciones jurídicas claras y rápidas para empresas

★★★★★4,9 1.767 descargas

Theme de página web estática para JurisNova, empresa de servicios legales para empresas y startups. Incluye hero visual, reservas de consulta gratuitas, estadísticas y testimonios, todo con TailwindCSS y JavaScript vanilla. Diseño responsive y optimizado para SEO.

↓ 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 **JurisNova** (jurisnova.com) usando solo HTML estático, TailwindCSS vía CDN y JavaScript vanilla en un único archivo. La web debe reproducir fielmente la estructura visual y la experiencia de la plantilla original, sin copiar ningún texto ni imágenes del original. 

**Alcance**: Página principal (HOME) con barra de navegación, hero con imagen decorativa, titular grande, subtítulo, bloque de 3 estadísticas con iconos, sección de fondo con imagen amplia, sección de reserva de consulta gratuita con formulario extenso (campos: nombre, email, estado, ciudad, opción desplegable, teléfono, checkbox SMS, descripción del caso, botón de envío con icono), bloque de reseñas (estrellas, número de reseñas, clientes atendidos), galería de badges de confianza (4 imágenes), y footer con enlaces secundarios y datos de contacto. También crear páginas internas mínimas: About, Services y Contact, cada una con header interno, contenido de texto o lista, y repetir el footer.

**Stack**: 
- `<link href="https://cdn.jsdelivr.net/npm/tailwindcss@3/dist/tailwind.min.css" rel="stylesheet">`
- JavaScript al final del body para animaciones de scroll y toggle del menú móvil.

**Paleta de colores** (extraída del original):
- #0A0A0A (negro profundo para texto principal)
- #FFFFFF (blanco puro para fondos y texto claro)
- #1E3A8A (azul marino para acentos y botones)
- #F3F4F6 (gris claro para secciones y fondos suaves)
- #E5E7EB (gris intermedio para bordes y placeholders)

**Tipografía**: 
- Fuente principal: "Inter", sans-serif, peso 400/600/700.
- Títulos grandes (h1) 4xl, negrita, color negro.
- Subtítulos (h2) 2xl, semi‑bold, color blanco sobre fondos oscuros.

**Header**: barra fija con logo (texto "JurisNova" en Inter Bold, color #1E3A8A), enlaces de navegación (Practica, Industrias, Company con dropdown (About, Blog, Jobs), Contact), botón de teléfono a la derecha estilo botón pequeño con fondo #1E3A8A y texto blanco.

**Footer**: fondo #0A0A0A, columnas con enlaces de empresa, servicios, legal, redes sociales (iconos SVG placeholders), y texto de copyright.

**Sección HERO**: contenedor con `flex` y `gap-8`, imagen SVG decorativa a la izquierda y bloque de texto a la derecha. Titular h1, párrafo introductorio, botón "Solicita tu consulta" (estilo primario). Añadir animación de fade‑in con `data-opacity` y `transition`.

**Estadísticas**: grid de 3 columnas, cada una con contenedor cuadrado, icono SVG placeholder dentro de círculo con fondo gris claro, y texto centrado bajo el icono.

**Formulario**: usar clases Tailwind para inputs (`border border-gray-300 rounded-md p-2`) y `focus:ring-2 focus:ring-blue-600`. Botón submit con fondo #1E3A8A, hover #2563EB, y icono de mensaje a la izquierda.

**Badges**: grid de 4 columnas, imágenes de placeholder con `object-cover` y sombra ligera.

**Interactividad**: 
- Menú móvil colapsable (toggle class `hidden`/`block`).
- Smooth scroll para anclajes.
- Animaciones de aparición de bloques al hacer scroll (IntersectionObserver).

**Requisitos técnicos**: todo en un único archivo `index.html`, sin dependencias externas más allá de Tailwind CDN y fuentes de Google. Mantener código limpio, accesible (atributos `alt`, `label` asociados a inputs) y responsivo (mobile‑first).

---

## 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.637 caracteres · 55 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, enlaces y botón de teléfono
1.2 Hero principal con imagen decorativa, titular y subtítulo
1.3 Estadísticas rápidas (3 ítems con icono y texto)
1.4 Imagen de fondo ampliada
1.5 Reserva de consulta: título, texto descriptivo, formulario (nombre, email, estado, ciudad, opción, teléfono, SMS, mensaje) y botón de envío
1.6 Badges de confianza (cuatro imágenes)
1.7 Footer con enlaces de empresa, servicios, contacto y redes sociales

ABOUT

2.1 Header interno con título "Sobre nosotros" y breadcrumb
2.2 Texto descriptivo de la firma y misión
2.3 Equipo destacado con fotos y breves biografías
2.4 Footer repetido

SERVICES

3.1 Lista de áreas de práctica con iconos y breves descripciones
3.2 CTA para contactar
3.3 Footer repetido

CONTACT

4.1 Formulario de contacto rápido (nombre, email, mensaje)
4.2 Mapa estático con ubicación
4.3 Datos de contacto (teléfono, email, dirección)
4.4 Footer repetido

PROMPTS RELACIONADOS · SAAS / STARTUP

Otros prompts de la misma categoría

Ficha de marca

Nombre: JurisNova
Sector: Servicios legales para empresas y startups
Claim: Soluciones jurídicas claras y rápidas

Bloques de la home

1.1 Barra de navegación fija con logo, enlaces principales y botón de teléfono
1.2 Hero principal con imagen decorativa, titular grande y subtítulo breve
1.3 Bloque de estadísticas rápidas (consulta el mismo día, sin honorarios si gana, atención 24/7)
1.4 Sección de fondo con imagen amplia
1.5 Área de reserva de consulta gratuita con texto, formulario extendido y sección de reseñas
1.6 Galería de badges de confianza y socios
1.7 Footer con enlaces de navegación secundaria 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

JurisNova – Soluciones jurídicas claras y rápidas para empresas

Cópialo y pégalo en Claude Design

Tabla de secciones

HOME

ABOUT

SERVICES

CONTACT

Otros prompts de la misma categoría

Kinetix Flow

KitePulse

Lumen Docs

Lumenova