/
Contact usSee pricingStart building

    About B2B Saas Authentication

    Introduction
    Stytch B2B Basics
    Integration Approaches
      Full-stack overview
      Frontend (pre-built UI)
      Frontend (headless)
      Backend
    Next.js
      Routing
      Authentication
      Sessions
    Migrations
      Overview
      Reconciling data models
      Migrating user data
      Additional migration considerations
      Zero-downtime deployment
      Defining external IDs for members
      Exporting from Stytch
    Custom Domains
      Overview

    Authentication

    Single Sign On
    • Resources

      • Overview
        External SSO Connections
        Standalone SSO
    • Integration Guides

      • Start here
        Backend integration guide
        Headless integration guide
        Pre-built UI integration guide
    OAuth
    • Resources

      • Overview
        Authentication flows
        Identity providers
        Google One Tap
        Provider setup
    • Integration Guides

      • Start here
        Backend integration
        Headless frontend integration
        Pre-built UI frontend integration
    Connected AppsBeta
      Setting up Connected Apps
      About Remote MCP Servers
    • Resources

      • Integrate with AI agents
        Integrate with a remote MCP server
    Sessions
    • Resources

      • Overview
        JWTs vs Session Tokens
        How to use Stytch JWTs
        Custom Claims
    • Integration Guides

      • Start here
        Backend integration
        Frontend integration
    Email OTP
      Overview
    Magic Links
    • Resources

      • Overview
        Email Security Scanner Protections
    • Integration Guides

      • Start here
        Backend integration
        Headless frontend integration
        Pre-built UI frontend integration
    Multi-Factor Authentication
    • Resources

      • Overview
    • Integration Guides

      • Start here
        Backend integration
        Headless frontend integration
        Pre-built UI frontend integration
    Passwords
      Overview
      Strength policies
    UI components
      Overview
      Implement the Discovery flow
      Implement the Organization flow
    DFP Protected Auth
      Overview
      Setting up DFP Protected Auth
      Handling challenges
    M2M Authentication
      Authenticate an M2M Client
      Rotate client secrets
      Import M2M Clients from Auth0

    Authorization & Provisioning

    RBAC
    • Resources

      • Overview
        Stytch Resources & Roles
        Role assignment
    • Integration Guides

      • Start here
        Backend integration
        Headless frontend integration
    SCIM
    • Resources

      • Overview
        Supported actions
    • Integration Guides

      • Using Okta
        Using Microsoft Entra
    Organizations
      Managing org settings
      JIT Provisioning

    Testing

    E2E testing
    Sandbox values
Get support on SlackVisit our developer forum

Contact us

B2B Saas Authentication

/

Guides

/

Authentication

/

UI components

/

Overview

Pre-built B2B UI components overview

Our frontend JavaScript SDK provides pre-built UI components that you can use to easily add authentication and organization management to your application.

The three main components are:

  1. Discovery authentication
  2. Organization-specific login
  3. Admin Portal UI

All of Stytch's pre-built UI components can be stylized to fit the look and feel of your application, and you can play around with some of the styling options here.

Discovery authentication

Discovery refers to the flow where an end user authenticates before specifying the Organization they wish to access by logging into your application's centralized login page.

UI component during the Discovery flow

Once the user successfully authenticates, they'll be presented with a list of Organizations that they can access including current memberships, pending invites and Organizations they are eligible to join based on their verified email domain. You can optionally allow end users to create new Organizations for self-serve sign-ups by enabling the Create Organizations option in the Frontend SDKs tab in the Stytch Dashboard.

When the user selects an Organization (or creates a new one), the UI component will handle the intermediate session token exchange, producing a new session corresponding to that Organization.

Check out our Discovery flow UI component implementation guide for detailed implementation steps.

Organization-specific login

Organization-specific login refers to the flow where end users go to a specialized login page for their tenant, often a subdomain or route that contains the Organization Slug (e.g. acme-corp.yourapp.com or yourapp.com/team/acme-corp).

The pre-built UI component will surface the specific authentication methods that the Organization allows, and the end user can then log into the Organization directly if they are an active member, have a pending invite or are eligibile to join based on their verified email domain or the SSO Connection that they authenticated through.

UI component at the beginning of the Organization flow

At the end of the authentication flow, the UI component will start a new session for the appropriate Organization.

Check out our Organization flow UI component integration guide for detailed implementation steps.

Admin Portal UI

The Admin Portal provides all of the components that you'd need for your admin users to manage their Organization including:

  • Member management
  • Organization settings
  • SSO configuration and management
  • SCIM configuration and management

Each of these is a distinct component, for maximum flexibility in how you wish to embed into your application. All of the Admin Portal UI components leverage Stytch RBAC to only render the functionality that the logged in member is authorized for.

In order to use the Admin Portal UI you must enable Member actions & permissions in the Frontend SDKs tab of the Stytch Dashboard.

Check out our SDK Reference on the Admin Portal UI for more details on implementation and styling.

Member management

Member management UIUnstylized pre-built UI component for member management. Provides support for viewing members, inviting members, deactivating and reactivating members, and managing the member's authentication settings (e.g. resetting MFA) and profile information (e.g. updating email address).

Organization settings

Member management UIUnstylized pre-built UI component for managing an organization's authentication and authorization settings. Provides support for configuring allowed primary auth methods (e.g. SSO only), MFA policy, invite and Just-in-Time (JIT) provisioning settings by email domain, and automatic role assignments based on SCIM Group membership, email domain, or SSO Connection.

SSO configuration and management

Member management UIUnstylized pre-built UI component for viewing all SSO Connections for an Organization. Provides support for creating, updating and deleting SSO Connections for the Organization.

SCIM configuration and management

Member management UIUnstylized pre-built UI component for managing SCIM Connection. Provides support for creating, updating and deleting a SCIM Connection, as well as managing token rotation.

Discovery authentication

Organization-specific login

Admin Portal UI

Member management

Organization settings

SSO configuration and management

SCIM configuration and management