> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dynamic.xyz/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# useSignInWithPasskey

<Card title="Recommended: JavaScript SDK with React Hooks" icon="react" color="#4779FE">
  For new React apps, we recommend the JavaScript SDK with React Hooks (`@dynamic-labs-sdk/react-hooks`) instead of the legacy React SDK documented here. The JS SDK comes with many benefits such as a much smaller bundle size and other optimizations. Use the [React quickstart (JavaScript SDK)](/javascript/reference/react-quickstart) to get started.
</Card>

<Note>
  ### This is only for use with signin. Passkey is not currently supported for registration.
</Note>

### Summary

This hook provides a way for clients to sign-in to Dynamic using a passkey.

The hook needs to be initialized within a child of [DynamicContextProvider](/react/reference/providers/dynamiccontextprovider).

### Usage

Available methods:

* `signInWithPasskey`: Sign in to Dynamic by calling the function returned from this hook. This will automatically set the logged-in Dynamic `user` when successful. Optionally accepts a named parameters object: `{ relatedOriginRpId?: string }`.

### Usage

```TypeScript theme={"system"}
import { useSignInWithPasskey } from '@dynamic-labs/sdk-react-core';

const App = () => {
  const signInWithPasskey = useSignInWithPasskey();

  return (
    <button
      onClick={() => signInWithPasskey()}
    >
      Sign in with passkey
    </button>
  );
};
```

### Optional parameters

* `relatedOriginRpId` (optional): Specify the RP ID to use when signing in from a related origin (for example, a different subdomain or custom hostname related to your primary domain).

```TypeScript theme={"system"}
import { useSignInWithPasskey } from '@dynamic-labs/sdk-react-core';

const App = () => {
  const signInWithPasskey = useSignInWithPasskey();

  return (
    <button
      onClick={() => signInWithPasskey({ relatedOriginRpId: 'example.com' })}
    >
      Sign in with passkey
    </button>
  );
};
```

### Prerequisites

Before using this hook, ensure that:

1. [Passkey Authentication is Enabled](/react/authentication-methods/passkey#dashboard-configuration) as an authentication method.

2. Domain Configuration: For production use, your domain must be properly configured for WebAuthn. This includes:

   * HTTPS protocol (required for passkeys)
   * Proper domain registration in your Dynamic environment settings

3. User Has Registered Passkey: The user must have previously registered a passkey with your application. If they haven't, they'll need to register one first using the Dynamic widget or appropriate registration flow.

4. Browser Support: Ensure the user's browser supports WebAuthn. Most modern browsers support passkeys, but you may want to add feature detection.

### Important Notes

<Info>
  **Domain Scope**: Passkeys are scoped to top-level domains. A passkey created on `app.example.com` will work on `example.com` and `shop.example.com`, but will require a new registration for `app.different.com`.
</Info>

<Warning>
  **Browser Compatibility**: While most modern browsers support passkeys, always implement fallback authentication methods for broader compatibility.
</Warning>

<Note>
  **First-Time Users**: Users who haven't registered a passkey will need to complete the registration process before they can use this sign-in method. Consider providing clear instructions or alternative authentication options.
</Note>