NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia Tienda Marea (estudio de tatuajes) usando HTML estático, Tailwind CSS vía CDN y JavaScript vanilla en un solo archivo. Emplea la siguiente paleta de colores: #0d0d0d (fondo principal), #1a1a1a (secciones), #e63946 (acentos y botones), #f1faee (texto claro), #457b9d (links y hover). Tipografía: Inter (cargada desde Google Fonts) para títulos y cuerpo.
Estructura:
- <header class="fixed top-0 w-full bg-[#1a1a1a] shadow-md z-50"> con logo SVG a la izquierda, menú de navegación (ABOUT, SERVICES, WORKS, BLOGS, PRICING, CONTACT) y un botón de carrito que abre un modal (oculto por defecto) mostrando lista vacía y botón "Continuar al checkout".
- Hero: sección full‑height con fondo foto tenue, texto centrado h1 "Arte que perdura en tu piel", pár
4.092 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.092 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 Barra de navegación fija con logo, enlaces y botón de carrito
- 1.2 Hero principal con título grande, subtítulo y botón de reserva
- 1.3 Bloque de servicios en tres columnas con iconos y descripción
- 1.4 Galería de trabajos destacados en cuadrícula interactiva
- 1.5 Sección de testimonios con carrusel simple
- 1.6 Área de FAQs en formato acordeón
- 1.7 Llamada a la acción final con formulario de suscripción
- 1.8 Footer con información de contacto, redes sociales y enlaces rápidos
ABOUT
- 2.1 Header con fondo tenue y título "Sobre nosotros"
- 2.2 Texto descriptivo del estudio y su filosofía
- 2.3 Equipo en tarjetas con foto y rol
- 2.4 CTA para agendar consulta
SERVICES
- 3.1 Lista de servicios en tarjetas con icono, nombre y breve descripción
- 3.2 Precio estimado ficticio (texto sin cifras concretas)
- 3.3 Botón de reserva por servicio
WORKS
- 4.1 Galería tipo masonry de trabajos realizados
- 4.2 Filtro por estilo (tradicional, neotrad, acuarela, etc.)
- 4.3 Lightbox al hacer clic en cada imagen
BLOGS
- 5.1 Lista de artículos con miniatura, título, extracto y fecha
- 5.2 Paginación simple
PRICING
- 6.1 Tabla comparativa de paquetes de tatuaje
- 6.2 Características de cada paquete y botón de selección
CONTACT
- 7.1 Formulario de contacto con campos nombre, email, asunto y mensaje
- 7.2 Mapa estático de la ubicación
- 7.3 Información de horario y teléfono
PROMPTS RELACIONADOS · COMERCIO ELECTRÓNICO