NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crea un sitio web completo para la marca ficticia VERDECAMPO, una startup de tecnología agraria. Usa HTML plano con Tailwind CSS vía CDN y JavaScript vanilla en un único archivo. Paleta de colores: #2E7D32 (verde principal), #A5D6A7 (verde claro), #FFFFFF (blanco), #424242 (texto oscuro), #F5F5F5 ( fondo gris). Tipografía: 'Inter', sans-serif para cuerpo y 'Playfair Display' para títulos.
Estructura:
- <header class="fixed top-0 w-full bg-white shadow"> con logo a la izquierda, menú principal con items Home, Soluciones, Productos, Blog, Contacto y un botón de carrito a la derecha que muestra la cantidad.
- Hero sección ocupando pantalla completa, fondo con imagen de campo sostenible, título grande Playfair, subtítulo Inter, botón principal azul-verdoso "Descubre nuestras soluciones".
- B
4.135 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.135 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, menú desplegable y botón de carrito
- 1.2 Hero principal con título, subtítulo, botón principal y visual de campo sostenible
- 1.3 Sección de ventajas con iconos y textos breves
- 1.4 Galería de productos destacados en cuadrícula responsive
- 1.5 Testimonios de clientes en carrusel simple
- 1.6 Llamado a la acción secundario para contactar
- 1.7 Footer con enlaces rápidos, datos de la empresa y redes sociales
ABOUT
- 2.1 Encabezado interno con breadcrumb
- 2.2 Texto descriptivo de la misión y visión
- 2.3 Equipo con fotos y breves biografías
- 2.4 Valores en bloques con iconos
- 2.5 CTA para suscribirse al boletín
- 2.6 Footer común
PRODUCTS
- 3.1 Encabezado de listado de productos
- 3.2 Filtros laterales (categorías, precios)
- 3.3 Tarjetas de producto en grid (imagen, nombre, breve, botón añadir)
- 3.4 Paginación inferior
- 3.5 Footer común
PRODUCT DETAIL
- 4.1 Imagen principal grande del producto
- 4.2 Galería de miniaturas
- 4.3 Información del producto (nombre, descripción, precio, selector de cantidad)
- 4.4 Botón añadir al carrito
- 4.5 Sección de especificaciones técnicas
- 4.6 Productos relacionados en carousel
- 4.7 Footer común
BLOG
- 5.1 Lista de artículos con imagen, título, resumen y fecha
- 5.2 Sidebar con categorías y archivo
- 5.3 Paginación
- 5.4 Footer común
BLOG POST
- 6.1 Título del artículo y meta datos
- 6.2 Contenido con encabezados y multimedia
- 6.3 Bloque de autores
- 6.4 Comentarios (placeholder)
- 6.5 Footer común
CONTACT
- 7.1 Formulario de contacto (nombre, email, mensaje)
- 7.2 Mapa integrado (placeholder)
- 7.3 Información de contacto y redes
- 7.4 Footer común
PROMPTS RELACIONADOS · EDUCACIÓN
