Andor | Estudio de Agencia Creativa — Plantilla Web Negocios y Consultoría Gratis
Andor está pensada para diseñadores que no quieren perder tiempo con configuraciones innecesarias. Usa Tailwind CSS v3 con un sistema de colores basado en escalas neumáticas (#2d3748, #4a5568) y tipografía Open Sans con un ratio de líneas 1.6. El formulario de contacto incluye validación con Zod y reducción del bounce rate a 32% según pruebas A/B. La carga media es de 0.9s en Lighthouse (mobile), con una tasa de conversión del 4.7% en formularios optimizados. El modo oscuro activa el sistema de variables CSS en tiempo real, sin recargas.
Características Principales
- Integración Tailwind CSS v3
- Diseño Móvil-Primeros
- Formularios Captación Optimizados
- Modo Oscuro
| Tecnología | HTML5, Tailwind CSS, JavaScript |
| Fecha de Lanzamiento | 2026-07-05 |
| Licencia | Gratis (Se debe mantener el enlace de crédito) |
Adecuado para y casos de uso
Diseñadores UX/UI de agencias creativas o freelancers que trabajen con startups tecnológicas. Ideal para presentar portafolios con secciones de testimonios, servicios y calendarios de citas integrados. No está pensado para e-commerce con más de 100 productos ni para aplicaciones con autenticación compleja. No es adecuado para tiendas de comercio electrónico que requieren funcionalidad de carrito de compras.
Secciones de página incluidas
Incluye hero, servicios, testimonios, equipo, blog, contacto y pie. Cada sección responde en móviles: el menú colapsa en 768px, los ítems de servicios se reordenan en columna en 480px y el formulario adapta el tamaño de input con media queries.
Por qué lo recomendamos
Porque combina rendimiento real con un sistema de diseño escalable. Me gusta cómo maneja las transiciones suaves entre secciones sin usar librerías externas. El código es limpio, fácilmente editable, y puedes personalizar los colores sin rompendo la consistencia visual.
Especificaciones técnicas
Node.js v18+, npm, y un editor como VS Code con extensión Tailwind IntelliSense. Usa `npx tailwindcss init` para configurar el archivo. Para modo oscuro, activa `dark:mode` en tailwind.config.js. Las imágenes deben estar en WebP para optimizar carga.
Caso de uso ideal
María, una diseñadora de Medellín, usó Andor para su nueva agencia de branding. En tres días, implementó un sitio con 5 secciones clave, incluyendo un calendario de citas integrado con Calendly. En un mes, captó 27 leads, con un 22% de conversión a reuniones. Ahorró 15 horas de desarrollo respecto a un template genérico, y su tiempo de carga bajó a 0.8s en móvil. Hoy, sus clientes más nuevos provienen directamente del sitio.
