Skip to main content
Privy offers the ability to sign up and log users in using a passkey. This lets users access their account simply and securely.
Enable passkey authentication in the Privy Dashboard before implementing this feature.
  • React
  • React Native

​
Login with Passkey

To authenticate your users with Privy’s out of the box UIs, check out UI components here.
Use loginWithPasskey from the useLoginWithPasskey hook to trigger the passkey login flow.
loginWithPasskey: ({ passkey?: string }) => void
​
passkey
string
Optionally prompt the user to sign in with a specific passkey credential.

​
Usage

import { useLoginWithPasskey } from '@privy-io/react-auth';

export default function LoginWithPasskey() {
  const { loginWithPasskey } = useLoginWithPasskey();

  return (
    <div>
      <button onClick={loginWithPasskey}>Log in with passkey</button>
    </div>
  );
}

​
Sign up with Passkey

Use signupWithPasskey from the useSignupWithPasskey hook to trigger the passkey signup flow.
signupWithPasskey: () => void

​
Usage

import { useSignupWithPasskey } from '@privy-io/react-auth';

export default function SignupWithPasskey() {
  const { signupWithPasskey } = useSignupWithPasskey();

  return (
    <div>
      <button onClick={signupWithPasskey}>Sign up with passkey</button>
    </div>
  );
}

​
Tracking Flow State

Track the state of the passkey flow via the state variable returned by both the useLoginWithPasskey and useSignupWithPasskey hooks.
state:
  | {status: 'initial'}
  | {status: 'error'; error: Error | null}
  | {status: 'generating-challenge'}
  | {status: 'awaiting-passkey'}
  | {status: 'submitting-response'}
  | {status: 'done'};
​
status
'initial' | 'error' | 'generating-challenge' | 'awaiting-passkey' | 'submitting-response' | 'done'
The current state of the passkey flow.
​
error
Error | null
The error that occurred during the passkey flow.

​
Callbacks

You can optionally pass callbacks into the useLoginWithPasskey and useSignupWithPasskey hooks to run custom logic after a successful login or signup, or to handle errors that occur during the flow.

​
onComplete

onComplete: ({user, isNewUser, wasAlreadyAuthenticated, loginMethod, linkedAccount}) => void

​
Parameters

​
User
PrivyUser
The user object returned after successful login or signup.”
​
isNewUser
boolean
Whether the user is a new user or an existing user.
​
wasAlreadyAuthenticated
boolean
Whether the user was already authenticated before the passkey flow.
​
loginMethod
'passkey'
The login method used to authenticate the user.
​
linkedAccount
LinkedAccount
The linked account if the user was already authenticated.

​
onError

onError: (error: Error) => void

​
Parameters

​
error
Error
The error that occurred during the passkey flow.

​
Resources

React starter repo

Get started with React and Privy.

Next.js starter repo

Get started with Next.js and Privy.

Whitelabel starter repo

Get started with a whitelabel Privy integration.
⌘I