Auth0 Universal Login
Universal Login is Auth0's implementation of the login flow, which is the key feature of an Authorization Server. Each time a user needs to prove their identity, your applications redirect to Universal Login and Auth0 will do what is needed to guarantee the user's identity.
By choosing Universal Login, you don't have to do any integration work to handle the various flavors of authentication. You can start off using a simple username and password. With a simple toggle switch, you can add new features such as social login and multi-factor authentication (MFA). All of this is dynamic, and adjustable in real-time without requiring application-level changes, since all functionality is driven dynamically by the web pages served by the centralized Authentication Server. Your application will benefit from all improvements Auth0 does in the login flow without you changing a single line of code.
The login page appearance and behavior is customizable right from the Dashboard. The logo and colors of the login pages can be changed, and in more advanced use cases, the code of each page itself can be modified.
For information on the differences between Universal Login and traditional embedded login within your application, see our comparison guide.
Choose an experience
There are two available experiences in Universal Login. The Classic Universal Login Experience uses JavaScript controls for each page. The New Universal Login experience does not require JavaScript to work, and it offers a simpler and faster experience for end-users.
On the Dashboard, in Branding > Universal Login you can select which login experience to use for default, non-customized pages:

Choose an experience to learn more about:
Customization
In the Dashboard, you can see the settings for your login page by navigating to Universal Login and looking at the Settings tab. Here you can customize how the initial login screen is displayed, add your logo, and enter colors for the login button or page background.

Implement Universal Login
In addition to configuring Universal Login for your tenant's applications, you will also need to complete a few other steps:
Set up a connection(s) in the Dashboard (Choose Connections in the Dashboard's sidebar, then choose a type and pick one to configure, such as a database or a social login provider).
Set up your application in the Dashboard.
Configure your application's code to call Auth0's
/authorize
endpoint in order to trigger Universal Login, and then to deal with the response. You can either do this directly, or use one of our SDKs to make the process easier.
You can navigate to the login page from any browser:
https://YOUR_DOMAIN/authorize?
response_type=code|token&
client_id=YOUR_CLIENT_ID&
connection=CONNECTION&
redirect_uri=https://YOUR_APP/callback&
state=STATE
You can (optionally) specify a connection, but you must specify a state and choose whether you want a code
or token
response (the choice you make depends on your app type and the flow you are using). Finally, make sure to fill in the domain, client ID, and redirect URI if they haven't been pre-filled.
Use the SPA SDK
If you are already using Auth0's Single-Page App SDK, using the auth0.loginWithRedirect()
or auth0.loginWithPopup()
methods will bring you to the Authorize endpoint.
<button id="login">Login</button>
$('#login').click(async () => {
await auth0.loginWithRedirect();
});
Use the Quickstart guides
For detailed instructions on setting up your application to use Universal Login, check out our Quickstart guides and choose the one that best fits your chosen technologies. The Quickstart guides will walk you through all of the implementation steps.