UI Components
UI Components
UI Components
UI Components
Discover Corbado’s flexible UI components that can be embedded with a few lines of code.
Overview
Corbado helps you to add a full passkey authentication process to your application. As all of this involves a lot of complex UI, Corbado provides you with prebuilt and configurable UI components.
Available Packages
Corbado provides the UI components in two different packages:
- React components: Can be used for React or React-based frameworks (e.g. Remix, Next.js).
- VanillaJS components: Can be used for all other frameworks (e.g. Angular, Vue.js, Svelte).
Available UI Components
Note: You can use the Corbado VanillaJS components with any other framework / technology that uses JavaScript in the frontend (e.g. also Python, PHP or Java projects).
| Component | React | VanillaJS | Description |
|---|---|---|---|
| CorbadoProvider | <CorbadoProvider/> | Corbado.load() | Required when adding UI components to an application. Applies global project configuration (e.g., projectID, themes, etc.) to all Corbado components. Before using any of the following components, ensure the CorbadoProvider is properly set up. |
| Signup | <SignUp/> | Corbado.mountSignUpUI() | Component that allows users to create a new account. |
| Login | <Login/> | Corbado.mountLoginUI() | Component that allows users to log in to their account. |
| CorbadoAuth | <CorbadoAuth/> | Corbado.mountAuthUI() | Combines Signup and Login component and takes care of authentication-related navigation. |
| PasskeyList | <PasskeyList/> | Corbado.mountPasskeyListUI() | Can be embedded in user’s profile page and lists all passkeys created by the user. |
For all UI components, you can customize translations, themes and error screens. Find detailed information in the Customization page.