01
Autenticación
Inicio de sesión, registro, acceso mediante magic link y estados de confirmación.
Kit de interfaz de autenticación y onboardingDisponible
Kit premium de autenticación y onboarding para Next.js
Un kit de autenticación y onboarding para Next.js donde los flujos de cuenta, verificación y configuración del espacio mantienen el contexto de un paso al siguiente.
US$29· pago único
Cambiá el nombre del workspace en el paso Workspace y terminá el onboarding: la pantalla final muestra el nombre nuevo.
- 26 pantallas de autenticación y onboarding
- Modos claro y oscuro
- Diseños completamente responsive
Resumen
Autenticación y onboarding que funcionan como un único flujo continuo.
Login, recuperación, verificación, invitaciones y onboarding del espacio comparten contexto e interacciones coherentes, para que la experiencia sea continua y no una colección de formularios separados.
26
Pantallas de interfaz
6
Categorías de flujos
7
Pasos de onboarding
Claro y oscuro
Modos de tema
Flujos incluidos
Experiencias de autenticación y onboarding diseñadas para funcionar juntas.
Las pantallas incluidas cubren todo el recorrido frontend, desde el acceso y la recuperación de la cuenta hasta la configuración y finalización del espacio de trabajo.
02
Recuperación de cuenta
Experiencias para recuperar, restablecer y actualizar la contraseña.
03
Verificación
Verificación de correo electrónico, códigos de confirmación y estados de validación exitosa.
04
Seguridad
Autenticación en dos pasos, códigos de recuperación y alertas de inicio de sesión sospechoso.
05
Invitaciones
Estados para invitaciones activas, vencidas y utilizadas anteriormente.
06
Onboarding del espacio de trabajo
Un recorrido de siete pasos que incluye tipo de cuenta, espacio de trabajo, perfil, equipo, preferencias y finalización.
Sistema de interfaz reutilizable
Componentes compartidos para experiencias de autenticación consistentes.
Las estructuras incluidas comparten la misma tipografía, espaciado, estados de interacción y comportamiento responsive, lo que facilita personalizar el kit y conectarlo con un producto real.
Bases de autenticación
AuthShellAuthCardAuthStatus
Formularios y credenciales
SocialAuthButtonsPasswordFieldPasswordStrength
Verificación y seguridad
Campos de código de verificaciónEstados de autenticación en dos pasosEstados de códigos de recuperación
Estructura de onboarding
OnboardingShellNavegación de progresoPanel de resumen dinámico
Creado para personalizar
Adaptá cada flujo a tu producto y tecnología.
Stack técnico
Creado con Next.js 16, React 19, TypeScript y Tailwind CSS v4.
Arquitectura compartida y reutilizable
Las estructuras de autenticación y onboarding están centralizadas para facilitar los cambios visuales y de comportamiento.
Identidad demo reemplazable
Reemplazá el producto, la empresa, el espacio de trabajo y el usuario ficticios incluidos por tu propia marca.
Preparado para tu proveedor de autenticación
Conectá las interfaces con tu servicio de autenticación, backend y base de datos preferidos.
Experiencia responsive
Una experiencia cuidada en todas las pantallas, temas y estados.
Las tarjetas de autenticación, los diseños de onboarding, los indicadores de progreso y los controles de formularios se adaptan a escritorio, tablet y dispositivos móviles.
- Diseños de autenticación responsive
- Navegación de onboarding adaptable
- Indicadores de progreso compactos para dispositivos móviles
- Modos claro y oscuro
- Controles de interfaz accesibles mediante teclado
- Estados hover, focus y disabled consistentes
Contenido del paquete
Todo lo incluido en la descarga.
- Código fuente completo en Next.js
- Veintiséis pantallas de autenticación y onboarding
- Componentes de autenticación reutilizables
- Flujo de onboarding de espacios de trabajo en siete pasos
- Modos claro y oscuro
- Diseños responsive para escritorio, tablet y dispositivos móviles
- Estados e interacciones frontend demo
- Licencia comercial
- README para compradores
- Registro de cambios
- Guía de personalización
- Guía de implementación
- Política de soporte
Alcance claro del producto
Una base de interfaz frontend que conectás con tus propios servicios.
Este producto proporciona la interfaz, la navegación y el comportamiento frontend demo. No incluye un sistema de autenticación de producción ni infraestructura backend.
No incluido
- Backend de autenticación
- Base de datos
- Cuentas de usuario reales
- Sesiones de producción
- Envío de correos electrónicos
- Invitaciones o membresías guardadas en servidor
- Configuración de proveedores de autenticación
- Lógica de servidor específica del negocio
Usá las interfaces incluidas como base frontend y conectá después tu proveedor de autenticación, base de datos, APIs e infraestructura de producción preferidos.
¿Preferís no conectarlo vos? Conectamos estas pantallas a tu API en un Frontend Sprint a precio fijo.
Requisitos
Qué necesitás para trabajar con el kit.
- Node.js 20.9.0 o una versión posterior
- pnpm
- Un entorno local de desarrollo JavaScript
- Conocimientos básicos de Next.js, React, TypeScript y Tailwind CSS
- Un proveedor de autenticación o backend personalizado para uso en producción
Licencia y soporte
Creado para proyectos comerciales reales.
Un Producto Final por compra
Usá el kit para crear un Producto Final comercial.
Permitido para trabajos de clientes
El Producto Final licenciado puede crearse para tu propio negocio o para un cliente.
Código fuente incluido
Personalizá las interfaces, los flujos, el contenido y la identidad visual directamente dentro del proyecto proporcionado.
Alcance del soporte documentado
Los términos de soporte del producto se explican en la política de soporte incluida.
Preguntas frecuentes
Todo lo que necesitás saber sobre el kit.
¿Incluye un backend de autenticación completo?
No. Este es un kit de interfaz exclusivamente frontend. Debés conectarlo con tu proveedor de autenticación, backend y base de datos preferidos.
¿Cuántas pantallas incluye?
El kit incluye 26 pantallas de interfaz que cubren autenticación, recuperación de cuenta, verificación, seguridad, invitaciones y onboarding de espacios de trabajo.
¿Incluye un flujo completo de onboarding?
Sí. Incluye una experiencia de onboarding de espacios de trabajo en siete pasos, con navegación de progreso, diseños responsive y contenido contextual.
¿Incluye modos claro y oscuro?
Sí. Las experiencias de autenticación y onboarding son compatibles con ambos temas.
¿El kit es responsive?
Sí. Las pantallas y estructuras compartidas incluidas están diseñadas para escritorio, tablet y dispositivos móviles.
¿El onboarding de equipo guarda miembros e invitaciones reales?
No. La demo guarda los datos del equipo en la sesión del navegador (sessionStorage): se mantienen al recargar en la misma pestaña y se borran al cerrarla. Para miembros e invitaciones reales necesitás tu backend y tu base de datos.
¿Puedo usarlo para el proyecto de un cliente?
Sí. La licencia comercial incluida permite crear un Producto Final para tu propio negocio o para un cliente.
¿Qué recibiré después de comprar?
El paquete incluye el ZIP completo con el código fuente, la licencia comercial, el README, el registro de cambios y las guías de personalización, implementación y soporte.
Explorá el producto
Conocé la experiencia completa de autenticación y onboarding.
Abrí la demo en vivo para explorar los flujos incluidos, los diseños responsive y los modos claro y oscuro, y comprá el kit completo cuando estés listo.
Productos relacionados
Seguí construyendo con kits de UI relacionados para Next.js.
Premium SaaS Dashboard Kit for Next.js
DisponibleUS$29· pago único
Ver productoPremium Billing & Subscription UI Kit for Next.js
DisponibleUS$29· pago único
Ver productoBundle relacionado
Premium SaaS UI Bundle
Incluye 3 productos coordinados de StudioGrid Pro.
US$69 · US$18 menos que comprar los 3 por separado