Sign-In Widget (third generation)
The Sign-In Widget enables registration, enrollment, verification, and recovery experiences for your users. It's where everyone in your org starts their Okta session.
The third generation of the Sign-In Widget offers the same user experience as the second generation, and adds accessibility improvements in color contrast, focus management, and screen reader behavior. It establishes a foundation for improvements in customization and globalization.
Is the third generation right for your org?
If your org prioritizes accessibility requirements or wants to avoid future migration efforts, consider enabling the third generation.
Customizations that you made in the second-generation Sign-In Widget don't appear if you move to the third generation. To recreate them, see Style the Sign-In Widget (third generation).
Self-service password reset flow
The third generation improves the self-service password reset flow by dynamically updating the password requirements as they're met. If a user submits a password that doesn't meet your requirements, they're notified of the ones they missed.
Branding
The third generation makes multibrand customization easier. You can use the API to directly configure Document Object Models (DOM) objects in the SIW HTML file. See Style the Sign-In Widget (third generation).
Browsers
The third generation supports most modern browsers:
- Chrome
- Safari
- Firefox
- Edge
- Internet Explorer
- Microsoft Edge Legacy
- Embedded browsers like Microsoft Office
- Hardware integrations like hand-held Android devices
Code configurations
useClassicEngine isn't supported.
Deployment
You can use the third generation in the following ways:
-
Okta-hosted sign-in page (default): Okta provides a sign-in page that's available at your org's URL. By default, a user who signs in on this page is redirected to the Okta End-User Dashboard.
-
Okta-hosted sign-in page (customizable): Okta provides a sign-in page that you can customize and make available under a custom subdomain of your company's top-level domain.
The third generation doesn't support self-hosting.
Compare generations
Feature |
Second generation |
Third generation |
---|---|---|
Deployment | Redirect (Okta-hosted) Embedded (self-hosted) Pinning to a specific Okta-hosted version |
Redirect (Okta-hosted) Pinning to a specific Okta-hosted version |
Authenticators | Email Password Okta Verify (Okta FastPass, push, TOTP) WebAuthn Smart Card Google Authenticator YubiKey OTP SMS Security Question Custom Duo Security RSA Symantec VIP IdP authenticator Social login |
Email Password Okta Verify (Okta FastPass, push, TOTP) WebAuthn Smart Card Google Authenticator YubiKey OTP SMS Security Question Custom Duo Security RSA Symantec VIP IdP authenticator Social login |
Features | IdP Discovery (routing rules) CAPTCHA |
IdP Discovery (routing rules) CAPTCHA |
Flows | Profile enrollment Authenticator enrollment Authenticator verification Forgot password Account unlock |
Profile enrollment Authenticator enrollment Authenticator verification Forgot password Account unlock |
Globalization |
All out-of-the-box translations String customization Bring your own language |
All out-of-the-box translations String customization Bring your own language Right-to-left languages (experimental, requires customization) |
Branding |
Branding and multibrands CSS overrides (code editor) |
Branding and multibrands |
Code configurations |
Config options:
Events:
Hooks:
Links API:
Custom Buttons API |
Config options:
Events:
Hooks:
Links API:
|
Multifactor authentication (MFA) for third-party agents |
Supported |
Limited support. Your third-generation customizations might not work as expected in these scenarios. The authentication flows complete but little or no styling appears on the Sign-In Widget. |
Enable the third-generation Sign-In Widget
-
In the Admin Console, go to .
- Select a brand.
- Go to the Pages tab, and then click Edit or Configure for the Sign-in page.
- Click the Settings tab.
- In the Sign-In Widget version section, click Edit.
- Click the Use third generation toggle so that it's active.
- Click Save to draft.
- Click Publish.
Customizations that you made in the second-generation Sign-In Widget don't appear if you move to the third generation. To recreate them, see Style the Sign-In Widget (third generation).
Pin a specific third-generation Sign-In Widget version
By default, the third-generation Sign-In Widget is upgraded to the latest minor version when an upgrade is available, but not to a major version.
You can pin the third-generation Sign-In Widget to a specific version. This lets you select a version that's compatible with custom brands and avoid breaking your configuration when an upgrade occurs. There are several ways to pin to a specific version:
- Pin to a specific version: Select a specific version, like 7.8. The third-generation Sign-In Widget stays on version 7.8 even after the release of version 7.9. You can pin to version 7.8 or later.
- Upgrade to minor versions only: Select the major version and the caret character, like 7^. This keeps the third-generation Sign-In Widget on major version 7 and gives you the latest minor version when it's released.
- Upgrade to the latest version: Select * (asterisk). This upgrades the third-generation Sign-In Widget to the latest major and minor version.
Enable the third-generation Sign-In Widget before you pin to a specific version. See Enable the third-generation Sign-In Widget.
-
In the Admin Console, go to .
- Select a brand.
- Go to the Pages tab, and then click Edit or Configure for the Sign-in page.
- Click the Settings tab.
- In the Sign-In Widget version section, click Edit.
- Select the version number from the Version dropdown.
- Click Save to draft.
- Click Publish.