NEW PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea una página web completa para la marca ficticia Aula Rubí, una tienda online de productos artesanales. Utiliza exclusivamente HTML, Tailwind CSS (CDN) y JavaScript vanilla en un único archivo. La página debe contener todas las secciones listadas en el apartado "secciones" y respetar la estructura de la tabla.
**Paleta de colores**:
- Primario: #1A202C (gris oscuro)
- Secundario: #F6E05E (amarillo cálido)
- Accent: #38B2AC (verde azulado)
- Fondo claro: #F7FAFC
- Texto principal: #2D3748
**Tipografía**:
- Fuente principal: "Inter", sans‑serif (cargar desde Google Fonts).
- Peso 400 para cuerpo, 600 para títulos.
**Header**: barra de navegación fija con logo a la izquierda, enlaces (Inicio, Tienda, Blog, Sobre nosotros, Contacto) centrados, botón resaltado "Únete" a la derecha
4.436 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.436 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 principales y botón móvil "Únete"
- 1.2 Modal del carrito con listado de productos y resumen
- 1.3 Hero de página principal con fondo a pantalla completa, título, subtítulo y botón principal
- 1.4 Bloque de categorías destacadas en columnas
- 1.5 Rejilla de productos con imagen, nombre, precio y botón "Añadir al carrito"
- 1.6 Sección de testimonios con carrusel simple
- 1.7 Llamada a la acción a suscripción al boletín
- 1.8 Footer con logo, enlaces de navegación, redes sociales y datos de contacto
PRODUCTOS
- 2.1 Cabecera con filtro de categorías
- 2.2 Lista de productos en grid responsivo, cada tarjeta con imagen, título, precio y botón
- 2.3 Paginación inferior
DETALLE PRODUCTO
- 3.1 Galería de imágenes del producto
- 3.2 Información del producto: título, descripción, precio, selector de variante y botón "Añadir al carrito"
- 3.3 Productos recomendados en carrusel
BLOG
- 4.1 Lista de artículos con imagen destacada, título, extracto y botón "Leer más"
- 4.2 Sidebar con categorías y suscripción
CONTACTO
- 5.1 Formulario de contacto con campos nombre, email, asunto y mensaje
- 5.2 Mapa incrustado y datos de contacto
PROMPTS RELACIONADOS · EDUCATION
