React CorbadoAuth
Before we can begin to render the Corbado Authentication UI, the CorbadoProvider has to be integrated. Find more here.

​
Integration

The Authentication UI allows the user to log in or register with Corbado. Once the user is logged in, the onLoggedIn callback is executed.
components/Auth.tsx
import { CorbadoAuth } from "@corbado/react";

export default function Auth() {
    const onLoggedIn = () => {
        //post login actions like navigation can be performed here.
        console.log("User is logged in");
    };

    return <CorbadoAuth onLoggedIn={onLoggedIn} />;
}

​
Customize Styling and Translations

Corbado UI Components can be customized to match your application’s design and language preferences. You can adjust the styling and translations of the components to create a seamless user experience:

Custom Styling

Custom Translations

​
Next

Let your users manage their passkeys with the PasskeyList.