// fichaje.eu — Landing page (v2 — bold, tilted hero, autoplay slider) const Nav = () => ( ); const HeroApp = () => (

{}} role="employee"/>

{}} current="inicio" onNav={() => {}}/>

{}}/>

); const Hero = () => (

{/* Gradient orbs */}

Software 100% en la nube

Control horario
y gestión de RRHH
sin complicaciones

Solución completa y sencilla para digitalizar el control de jornada, gestionar personas y cumplir con la normativa laboral.

Pruébalo gratis Solicita una demo

Sin tarjeta de crédito Cancelación en cualquier momento

{/* Real plant image — decorativo, sin fondo */} Planta de oficina

{/* Floating accent badges over the app */}

Fichaje registrado

09:02 · Marc Vives

Vacaciones aprobadas

11 – 22 agosto · 8 días

14 personas fichadas

); const FeaturesGrid = () => (

Pensado para equipos
que quieren crecer

{[ { i: , bg: 'linear-gradient(135deg, #ECFDF5, #D1FAE5)', iconBg: 'linear-gradient(135deg, #10B981, #059669)', shadow: 'rgba(16,185,129,.22)', t: 'Sencillo y eficaz', d: 'Una interfaz intuitiva que ahorra tiempo y facilita el día a día de RRHH y empleados.', cta: 'Descubre las funciones', ctaColor: '#059669' }, { i: , bg: 'linear-gradient(135deg, #EFF6FF, #DBEAFE)', iconBg: 'linear-gradient(135deg, #2563EB, #1E40AF)', shadow: 'rgba(30,64,175,.22)', t: 'Cumple y descansa tranquilo', d: 'Cumple la normativa vigente y evita sanciones. Auditorías y registros siempre listos.', cta: 'Seguridad y cumplimiento', ctaColor: '#1E40AF' }, { i: , bg: 'linear-gradient(135deg, #FEF2F2, #FEE2E2)', iconBg: 'linear-gradient(135deg, #F43F5E, #BE123C)', shadow: 'rgba(244,63,94,.22)', t: 'Visibilidad total del equipo', d: 'Datos en tiempo real para tomar mejores decisiones y mejorar la productividad.', cta: 'Indicadores y reportes', ctaColor: '#BE123C' }, { i: , bg: 'linear-gradient(135deg, #F5F3FF, #EDE9FE)', iconBg: 'linear-gradient(135deg, #8B5CF6, #6D28D9)', shadow: 'rgba(139,92,246,.22)', t: 'Personalizable y a tu medida', d: 'Configura permisos, flujos y políticas según las necesidades de tu empresa.', cta: 'Más sobre personalización', ctaColor: '#6D28D9' }, ].map((f, i) => (

{f.i}

{f.t}

{f.d}

{f.cta}

))}

); const ModulesSection = () => (

Módulos diseñados
para RRHH y managers

Todo lo que necesitas en un solo lugar para gestionar personas y procesos clave de forma centralizada.

Explora los módulos

{[ { i: , t: 'Control horario', d: 'Registra y visualiza la jornada en tiempo real.' }, { i: , t: 'Asignación de tareas', d: 'Organiza tareas y proyectos entre equipos.' }, { i: , t: 'Vacaciones', d: 'Solicitudes, aprobaciones y calendario de ausencias.' }, { i: , t: 'Turnos', d: 'Planifica turnos y gestiona coberturas.' }, { i: , t: 'Documentos', d: 'Centraliza y firma documentos laborales de forma segura.' }, { i: , t: 'Organización', d: 'Equipos, departamentos y estructura de la empresa.' }, ].map((m, i) => (

{m.i}

{m.t}

{m.d}

))}

); const ScreenFrame = ({ children, role = 'employee', current = 'inicio' }) => (

{}} role={role}/>

{}} current={current} onNav={() => {}}/>

{children}

); const PANELS = [ { id: 'inicio', t: 'Dashboard del empleado', s: 'Lo importante de tu día, en un vistazo.', role: 'employee', current: 'inicio', screen: () => {}}/> }, { id: 'fichaje', t: 'Fichaje con un solo clic', s: 'Entrada, pausa, comida y salida con timeline visual.', role: 'employee', current: 'fichaje', screen: () => }, { id: 'cal', t: 'Calendario y ausencias', s: 'Planificación visual y control total de ausencias.', role: 'employee', current: 'calendario', screen: () => }, { id: 'org', t: 'Gestión centralizada de personas', s: 'Todos los datos y métricas clave en tiempo real.', role: 'admin', current: 'organizacion', screen: () => }, { id: 'config', t: 'Configuración de empresa', s: 'Personaliza la plataforma según tus necesidades.', role: 'admin', current: 'config', screen: () => }, { id: 'control', t: 'Control horario para managers', s: 'Reporte editable día a día con auditoría de cambios.', role: 'admin', current: 'control', screen: () => }, { id: 'protocolos', t: 'Cuadro de mando con métricas', s: 'KPIs, gráficas y alertas para tomar decisiones.', role: 'admin', current: 'protocolos', screen: () => }, { id: 'docs', t: 'Mis documentos y firma digital', s: 'Contratos, nóminas y políticas firmadas online.', role: 'employee', current: 'misdocs', screen: () => }, { id: 'tareas', t: 'Tareas del equipo', s: 'Kanban integrado en RRHH para coordinar trabajo.', role: 'employee', current: 'tareas', screen: () => }, ]; const PanelsSlider = () => { const trackRef = React.useRef(null); const [idx, setIdx] = React.useState(0); const [paused, setPaused] = React.useState(false); // Autoplay React.useEffect(() => { if (paused) return; const id = setInterval(() => { const el = trackRef.current; if (!el) return; const child = el.children[0]; if (!child) return; const slideW = child.getBoundingClientRect().width + 32; const next = (idx + 1) % PANELS.length; el.scrollTo({ left: next * slideW, behavior: 'smooth' }); }, 3000); return () => clearInterval(id); }, [idx, paused]); // Track current index from scroll React.useEffect(() => { const el = trackRef.current; if (!el) return; const onScroll = () => { const child = el.children[0]; if (!child) return; const slideW = child.getBoundingClientRect().width + 32; setIdx(Math.round(el.scrollLeft / slideW)); }; el.addEventListener('scroll', onScroll); return () => el.removeEventListener('scroll', onScroll); }, []); const goTo = (i) => { const el = trackRef.current; if (!el) return; const child = el.children[0]; if (!child) return; const slideW = child.getBoundingClientRect().width + 32; el.scrollTo({ left: i * slideW, behavior: 'smooth' }); }; const scroll = (dir) => { const next = (idx + dir + PANELS.length) % PANELS.length; goTo(next); }; return (

setPaused(true)} onMouseLeave={() => setPaused(false)}>

Todo lo que tu equipo necesita,
en un solo lugar

Cada pantalla diseñada para que el día a día de RRHH y empleados sea más simple.

{PANELS.map((p) => (

{p.screen()}

{p.t}

{p.s}

))}

{PANELS.map((_, i) => (

goTo(i)}/> ))}

); }; const TrustSection = () => (

Más claridad para RRHH.
Más tiempo
para lo importante.

Miles de empresas ya confían en fichaje.eu para simplificar su día a día.

{[ 'Cumple con la normativa laboral', 'Ahorra tiempo en tareas repetitivas', 'Mejora la experiencia del equipo', 'Soporte cercano y en español', ].map(t => (

{t}

))}

{[ { i: , v: '+1.000', l: 'empresas activas' }, { i: , v: '+25.000', l: 'usuarios' }, { i: , v: '99,9%', l: 'disponibilidad' }, { i: , v: '+10 años', l: 'evolucionando juntos' }, ].map((s, i) => (

{s.i}

{s.v}

{s.l}

))}

); const Pricing = () => (

Elige el plan que mejor
se adapta a tu empresa

Starter

Ideal para pequeñas empresas

3,25 €

por usuario / mes

Pruébalo gratis

Más popular

Business

Para equipos en crecimiento

4,50 €

por usuario / mes

Pruébalo gratis

Promociones

{[ { t: 'Pack 50', s: 'Hasta 50 usuarios', p: '100 €', desc: 'Ahorra y gestiona hasta 50 usuarios.' }, { t: 'Pack 100', s: 'Hasta 100 usuarios', p: '150 €', desc: 'Ahorra y gestiona hasta 100 usuarios.' }, ].map(pk => (

{pk.t}

{pk.s}

{pk.p} /mes

{pk.desc}

))}

); const CTABand = () => (

{/* glow sutil para que el negro respire */}

Comienza a transformar la gestión
de tu equipo hoy mismo

Pruébalo gratis Solicita una demo

); const Footer = () => ( ); const Landing = () => ( <>

Control horarioy gestión de RRHHsin complicaciones

Pensado para equiposque quieren crecer

Módulos diseñadospara RRHH y managers

Todo lo que tu equipo necesita,en un solo lugar