Login box

Design the authentication experience for your application.

Choose the sign in types to build your desired authentication flows. Select the styles to make it match your brand.

Read below to learn how to use the Builder to design the authentication experience for your application.

Find Your Login Box

Go to your Frontegg Portal and navigate to the Login Box page in the Builder.

🚧

Editing Builder

When editing the Builder, commit your changes and then publish for them to take effect.

Sign In Types

In the Builder's left panel under sign in types, select and configure the sign in and sign up options for your application.

📘

Be sure to update the email templates for whichever sign in options you choose. Read more about how to customize emails templates or go to Environments ➜ er {\n display: fl ➜ Emails to manage the templates.


Passkeys

Allow users to login fast and more secure using passkeys authentication.

  • It’s quicker - Users can quickly access their account without the need to memorize passwords.
  • It’s safer - Passkeys can't be guessed, leaked or even phished.
  • It’s easier to use - Passkeys work seamlessly across any device and platform.

Read more about Passkeys here.

Social sign on

Allow your users to sign in using their social accounts.

In the left panel, a switch appears for each social option that you can enable.

Toggle the switch on for any that you want to enable. You can toggle on all of them, none of them, or anything in between.

Whichever you enable, you need to configure each one by entering information from each account. For instance, you need to enter information like client id, secret, and redirect url.

📘

Adding Social Logins

Learn more about how to add social logins to your application or go to Environments ➜ SSO option that you ➜ Authentication ➜ Social-Logins.


Single Sign on

Allow your users to sign in using SSO.

In the left panel, a switch appears for each SSO option that you can enable.

Toggle the switch on for any that you want to enable. You can toggle on all of them, none of them, or anything in between.

Whichever you enable, you need to configure each one by entering information from each account.

📘

Adding SSO

Learn more about how to add SSO to your application or go to Environments ➜ n in with password.

➜ Authentication ➜ SSO.


Email sign on

Go passwordless by selecting magic code or magic link or enable sign in with password.

📘

Whichever option you toggle on, click the âš™ configure button and fill in the required information.

The configuration is really easy.

For magic link, simply choose an expiration time.


If you choose the password authentication flow, configure the settings to control how to secure user passwords.

📘

Learn more about passwordless authentication and remember to configure the email template.


Allow Signups

Select whether the login box allows users to sign up directly through the login box.

Toggle the switch on to allow sign ups.


📘

The option to sign up in the login box appears only if toggled on.


User Approval

Require users to agree to your Terms of Service, Privacy Policy, or both when signing up using your Login Box.

To display links to your policies in your Login Box and get users to agree to them, enable the Terms of Service, Privacy Policy, or both by toggling one or more switches on under User Approval.

After enabling one or both options, you should be redirected to the settings page to configure the layout and links.

For layout, choose between two options for how the user agrees:

  • Showing only text and requiring user click signup button
  • Requiring user to select a checkbox in order to agree and signup

See how each option looks in the Builder's preview before deciding which one to choose.

For links, enter a link to each of your written policies for each approval type that you enabled.

  • Terms of Use
  • Privacy Policy
  • Both

After enabling and configuring User Approvals, your Login Box displays the layout you configured with links to your policies as shown in the Builder preview.

Guides

Follow the guides below for help with authentication and authorization features.