High-conversion landing page for gyms and fitness centers — where neon-dark aesthetics meet frictionless lead capture. Designed to make visitors feel the energy before they even walk through the door.
Fitness businesses live or die on first impressions and lead volume. Most gym websites are afterthoughts — bland stock photos, buried pricing, and contact forms that feel like tax returns. KlierFit is the opposite: a visually explosive landing experience that captures leads in under 30 seconds with a mobile-first flow designed around how people actually browse on their phones.
Built for: CrossFit boxes, boutique gyms, personal training studios, yoga centers, martial arts academies, and wellness centers.
| Feature | Description |
|---|---|
| 🎨 Neon-Dark Glassmorphism UI | Custom dark theme with electric accent colors that pulse with energy. Frosted glass overlays, gradient transitions, and micro-animations create a premium, unforgettable first impression. |
| 📅 Integrated Class Scheduling | Browse classes by type, instructor, and time. One-tap booking for group sessions or personal trainer slots — connected to n8n for real-time calendar sync. |
| 📱 Mobile-First Lead Capture | Sticky CTA buttons, swipe-friendly class cards, and a 3-field trial booking form. Designed for the 75%+ of fitness leads that come from mobile. |
| 🎬 Framer Motion Animations | Scroll-triggered reveals, parallax hero sections, and interactive hover states. Every interaction feels alive without sacrificing page speed. |
| 🌐 Bilingual Support | Full EN/ES localization with locale-aware scheduling. Ready for Latin American and US Hispanic markets. |
graph TD
A["📱 Visitor lands via<br/>Instagram Ad / Google / Referral"] --> B["🏋️ Hero Section<br/>Full-screen video + CTA"]
B --> C{"Engagement Path"}
C -->|"Explores"| D["📋 Class Grid<br/>Browse schedules + instructors"]
C -->|"Convinced"| E["📝 Trial Booking Form<br/>Name · Phone · Goal"]
D -->|"Finds class"| E
E --> F["⚡ n8n Webhook"]
F --> G["📊 CRM Lead Entry"]
F --> H["📱 WhatsApp Confirmation<br/>Welcome + first class details"]
F --> I["👤 Trainer Notification<br/>New prospect assigned"]
| Layer | Technology |
|---|---|
| Framework | React 19 + TypeScript |
| Styling | Tailwind CSS + custom CSS variables |
| Animations | Framer Motion |
| Icons | Lucide React |
| Orchestration | n8n webhooks for lead routing |
git clone https://github.com/SerjCallier/klierfit.git
cd klierfit
npm install
npm run devFuelled by KlierNav Innovations — AI-First Digital Agency
🇦🇷 Versión en Español
Landing page de alta conversión para gimnasios y centros fitness — donde la estética neón-oscura se encuentra con la captura de leads sin fricción.
Los negocios de fitness viven o mueren por las primeras impresiones y el volumen de leads. La mayoría de los sitios web de gimnasios son fotos stock genéricas, precios enterrados y formularios de contacto que parecen declaraciones juradas. KlierFit es lo opuesto: una experiencia visual explosiva que captura leads en menos de 30 segundos con un flujo mobile-first.
Ideal para: CrossFit boxes, gimnasios boutique, estudios de PT, centros de yoga, academias de artes marciales, centros wellness.
| Feature | Descripción |
|---|---|
| 🎨 UI Glassmorphism Neón-Dark | Tema oscuro con colores eléctricos, overlays de vidrio esmerilado, gradientes y micro-animaciones. |
| 📅 Agendamiento de Clases | Navegar clases por tipo, instructor y horario. Reserva en un tap conectada a n8n. |
| 📱 Lead Capture Mobile-First | CTAs sticky, tarjetas swipe, formulario de 3 campos. Diseñado para el 75%+ de leads fitness que llegan por celular. |
| 🎬 Animaciones Framer Motion | Reveals on-scroll, parallax, estados hover interactivos. Todo vivo sin sacrificar velocidad. |
| 🌐 Soporte Bilingüe | Localización completa EN/ES con scheduling locale-aware. |
- Framework: React 19 + TypeScript
- Estilos: Tailwind CSS + CSS custom properties
- Animaciones: Framer Motion
- Iconos: Lucide React