NUEVO PROMPT
PROMPT
Cópialo y pégalo en Claude Design
Crear un sitio web completo para la marca ficticia "ColaCare" (colacare.com), un negocio de peluquería y cuidado de mascotas. Utilizar una única página HTML con Tailwind CSS vía CDN y JavaScript vanilla en un solo archivo. Paleta de colores: #2C3E50 (azul marino profundo), #E74C3C (rojo coral), #F1C40F (amarillo cálido), #ECF0F1 (gris claro), #FFFFFF. Tipografía: 'Inter' para encabezados (font-weight 600) y 'Roboto' para cuerpo (font-weight 400), ambas importadas de Google Fonts.
Estructura y bloques:
1. Header fijo con fondo transparente que se vuelve sólido al hacer scroll. Logo a la izquierda (texto "ColaCare" en Inter 2xl, color #E74C3C). Menú de navegación centrado con enlaces: Home, About, Services, Pricing, Blog, Contact. Botón primario a la derecha "Solicitar cita" con fondo #E74C
4.114 caracteres · solo descargable completo
↓ Descargar PROMPT.md completo
4.114 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 Encabezado con logo, menú y botón de contacto
- 1.2 Hero con título, subtítulo y CTA
- 1.3 Servicios destacados (3 columnas)
- 1.4 Galería de imágenes
- 1.5 Testimonios rotativos
- 1.6 Planes de precios
- 1.7 Blog reciente
- 1.8 Suscripción al boletín
- 1.9 Footer con enlaces y datos
ABOUT
- 2.1 Encabezado común
- 2.2 Hero con historia de la marca
- 2.3 Equipo en tarjetas
- 2.4 Valores y misión
- 2.5 CTA a reservar cita
- 2.6 Footer común
SERVICES
- 3.1 Encabezado común
- 3.2 Lista de servicios con iconos y descripción
- 3.3 Slider de casos de estudio
- 3.4 CTA a precios
- 3.5 Footer común
PRICING
- 4.1 Encabezado común
- 4.2 Comparador de paquetes en tarjetas
- 4.3 Preguntas frecuentes accordion
- 4.4 CTA a reserva
- 4.5 Footer común
BLOG
- 5.1 Encabezado común
- 5.2 Lista de artículos en tarjetas con imagen, título y extracto
- 5.3 Paginación
- 5.4 Footer común
CONTACT
- 6.1 Encabezado común
- 6.2 Formulario de contacto con campos nombre, email, mensaje
- 6.3 Mapa incrustado
- 6.4 Información de dirección y teléfono
- 6.5 Footer común
PROMPTS RELACIONADOS · EDUCACIÓN
