Docs

Which OAuth 2.0 Flow Should I Use?

Branding

Auth0 can be customized with a look and feel that aligns with your organization's brand requirements and user expectations. Branding Auth0 collateral provides a consistent user experience for your customers, and gives them peace of mind that they’re using a product from a trusted and secure provider.

Auth0 provides support for internationalization (I18N) and localization (L10N), both of which are important if you work on branding for an international clientele. Out-of-box collateral, such as the Auth0 Lock UI widget, comes ready enabled for multiple language support, with built-in extensibility for adding more languages if what you require doesn’t already exist.

Best Practice

Almost all applications need Internationalization and/or Localization in one form or another. Auth0 makes it easy to add, but you need to account for it up front: retro-fitting localization, for example, can be a painful process if left too late.

When considering the items you want to brand, as well as how best to brand them, there are a number of things you'll want to review:

  • Do you need to brand your login page?
  • Do you need to localize your login page?
  • If you are sharing an Auth0 tenant across customer organizations, should you add organization-specific branding to their login experience?
  • How can you customize emails so that they're not just branded, but vary based on user preference?
  • How will users know that they're still on your domain when they see your login page?
  • What do you need to do to provide additional browser security (e.g., implement Extended Validation)?
  • Where do you want to direct users in the event of errors?

Auth0 provides tremendous flexibility when it comes to customizing and configuring Auth0 pages such as Universal Login and Password Reset. So you can pretty much set up whatever UX look and feel you require. For many, the out-of-the-box experience - with perhaps a little alteration - is all that's required. However, for others the value of their brand and brand awareness requires more extensive customization. This flexibility extends to not only Auth0 pages, but via extensibility can also be applied to the email templates. Auth0 Custom Domain functionality further enhances consumer awareness by providing users with the confidence and peace of mind when it comes to safety and security.

If you are sharing an Auth0 tenant across multiple customer organizations, providing each organization with their own domain of users and managing their credentials, you will need to consider how each user will know which credentials they should use and how they will trust that they are entering them somewhere safe and secure. See Branding login by organization for details.

While Auth0 provides for default information when it comes to error situations, out-of-the-box information can be somewhat cryptic as the context that can only be provided by you is missing. Auth0 error page customization guidance can however help mitigate that by allowing you to provide information of a more context-specific nature via your own support organization.

Best Practice

To provide users with helpful resources if they experience problems you should also configure a friendly name and a suitable logo, as well as the support email and support URL for your organization. See Dashboard Tenant Settings for further details.

Get Started with Auth0 Videos

Watch these three short videos Brand: How It Works, Brand: Signup and Login Pages, and Brand: Emails and Error Pages to learn how branding works with Auth0, how to use Auth0’s Universal Login feature to customize your sign up and login pages, and how to use Auth0 email templates and make changes to the reply email address, subject, redirect URL, and URL lifetime.

OAuth 2.0 terminology

Universal login and login pages

Universal Login is the recommended method for authenticating users, and it centers around use of the Login page. You can customize the Login page via the Dashboard to support your organization's branding requirements Simple customizations can be made that include changes to the logo, primary color, or background color, as well as more advanced customizations that require you to directly modify the script powering the page itself.

Best Practice

If you choose to customize Universal Login page script then we strongly recommend that you make use of version control, and deploy to your Auth0 tenant via deployment automation or one of the alternative strategies.

Auth0 widgets, such as Lock (https://auth0.com/lock), integrate seamlessly with Universal Login to provide out-of-box support for user login and sign up; Lock also has built-in support for multiple languages which can be leveraged to satisfy the requirements of an international audience. Alternatively the Auth0 JavaScript SDK (/libraries/auth0js) can be utilized when providing for a fully customized UX, using technologies such as React or Angular.

Universal Login advanced customization allows you to modify page script for greater customization flexibility. However you will be responsible for maintaining the page thereafter, including updating the version of any Auth0 widget - such as Lock - or Auth0 SDK used. You should also exercise caution regarding the use of third-party JavaScript on your Login Page, since sensitive security-related information often flows through the page and the introduction of cross-site scripting (XSS) vulnerabilities is of particular concern.

Is the Client the Resource Owner?

Branding login by organization

Whether or not you need to do special customization on the Universal Login page is determined by how you plan to manage your customers’ organization. Before reading through this section, make sure you have read through the Universal Login section and know how you are approaching organizations by reviewing Multiple Organization Architecture.

If your organization users will all be isolated from each other, than it’s important to make it clear on the Universal Login page which organization the login page is for. This can be done in a couple of ways:

  • Create JavaScript on the Universal Login Page that can pull resources from a CDN based on the organization presented to it.
  • Create a separate tenant for the organization and use the Universal Login page to customize as desired for that organization.

Is the Client a web app executing on the server?

Custom domain naming

By default, the URL associated with your tenant will include its name and possibly a region-specific identifier. For example, tenants based in the US have the a URL similar to https://example.auth0.com while those based in Europe have something that is of the fashion https://example.eu.auth0.com. A Custom Domain offers a way of providing your users with a consistent experience by using a name that’s consistent with your organization's brand.

Only one custom Domain Name can be applied per Auth0 Tenant, so if you absolutely must have independent domain name branding then you will require an architecture where multiple Auth0 Tenants are deployed to production.

In addition, Custom Domain functionality offers you complete control over the certificate management process. By default, Auth0 provides standard SSL certificates, but if you configure a custom domain, you can use Extra Validation (EV) SSL certificates or similar to provide the visual, browser-based cues that offer your visitors additional peace of mind.

In general, we see customers having the most success when they use a centralized domain for authentication - this is especially the case if the company offers multiple products or service brands. By using a centralized domain, you can provide end users with a consistent user experience while also minimizing the need to maintain multiple production tenants in Auth0.

If your customer organizations will be isolated from each other, and you require that users are presented a login page for each organization via a custom domain URL, then your only option is to create a separate tenant for each organization.

Is the Client absolutely trusted with user credentials?

Email template customization

Auth0 makes extensive use of email to provide both user notifications and to drive the functionality needed for secure identity management (for example, email verification, account recovery, and brute force protections), and Auth0 provides a number of templates for these.

Before customizing email templates, please set up your Email Provider.

Out of the box, the email templates used contain standard verbiage and Auth0 branding. However, you can configure almost every aspect of these templates to reflect the verbiage and user experience you want and make changes to things like the preferred language, accessibility options, and so forth.

Email templates are customized using Liquid syntax. If you are interested in customizing your templates based on user preferences, you will also have access to the metadata located in users' profiles, as well as any specific application metadata too.

Is the Client a Single Page App?

Password reset page customization

The Password Reset page is used whenever a user takes advantage of password change functionality and, as with the login page, you can customize it to reflect your organization's particular branding requirements.

If your organization users will all be isolated from each other (i.e, each organization gets its own Auth0 database connection), and you are branding the Universal Login pages by organization, then it's also important to brand things like the password reset page so users know for which organization the password change is occurring. This can be done in a couple of ways:

  • Create JavaScript on the Password Reset page that can pull resources from a CDN based on the connection parameter that indicates from which organization the user is coming.
  • Create a separate tenant for an organization and use Universal Login to customize what is required for that organization.

Authorization Code Grant with PKCE

Error page customization

If there are issues encountered during user interactive workflow (e.g. user sign up or login), Auth0 provides error messages that indicate what the problem is under the hood. The default messages are somewhat cryptic, especially to the end user, since they will likely be missing context that only you can supply. As such, we recommend customizing your error pages to provide the missing context-specific information directly to your users. Furthermore, customizing your error pages allows you to display your branding, not Auth0's, as well as provide useful information to your users as to what should be done next. This information might include a link to a FAQ or how to get in touch with your company's support team or help desk.

Best Practice

Out-of-the-box there is no user interface for customizing Auth0 provided error pages, but you can use the Tenant Settings endpoint of the Management API to configure them. Alternatively, if you can create and host your own error page, then you can have Auth0 direct users to that page instead of using the Auth0-hosted option.

Implicit Grant

Guardian multi-factor page customization

The Multi-factor Authentication pages can be customized by adjusting the Universal Login branding options in the Universal Login Settings section.

If you need further customization, you can also customize the full HTML content to reflect your organization's particular UX requirements.

Is the Client a Native/Mobile App?

Project Planning Guide

We provide planning guidance in PDF format that you can download and refer to for details about our recommended strategies.

B2B IAM Project Planning Guide

Keep reading