Discover how to detect WebAuthn capabilities with `getClientCapabilities()` and
tailor authentication workflows for your users.


![José Luis Zapata](https://web.dev/images/authors/zapata.jpg) José Luis Zapata [GitHub](https://github.com/zapata131) [LinkedIn](https://www.linkedin.com/in/zapata131) [Bluesky](https://bsky.app/profile/zapata131.bsky.social) [Homepage](https://www.zapata131.com)

<br />


Published: January 22, 2025

<br />

How can you ensure your authentication workflows adapt seamlessly to your users'
browsers and devices?

Starting with [Chrome 133](https://developer.chrome.com/blog/chrome-133-beta.md.txt), the `getClientCapabilities()`
WebAuthn API is here to help you determine which authentication features are
supported by a browser. By calling
`PublicKeyCredential.getClientCapabilities()`, developers can retrieve a
list of supported capabilities and adapt authentication workflows accordingly.

This enhancement enables developers to create more robust and user-friendly
authentication flows tailored to their users' environments.

Here is how you can implement it:

```javascript
if (window.PublicKeyCredential &&
    PublicKeyCredential.getClientCapabilities) {
  const capabilities = await PublicKeyCredential.getClientCapabilities();
  if (capabilities.conditionalGet === true &&
      capabilities.passkeyPlatformAuthenticator === true) {
    // The browser supports passkeys and conditional mediation.
  }
}
```

This method helps you tailor authentication experiences for users by identifying
supported capabilities like passkeys, conditional mediation (passkey autofill in
dialogs), hybrid transport (cross-device authentication using Bluetooth), and
even extensions.

## Why feature detection matters

Understanding client capabilities lets you:

- Create smoother user experiences and improve authentication reliability by adapting your implementation to the client's supported features.
- Reduce errors caused by unsupported WebAuthn capabilities.

By using `getClientCapabilites()`, you can confidently create authentication
experiences that work across diverse devices and browsers.

## Start exploring

If you are ready to dive in you can check out [Simpler WebAuthn feature
detection with
`getClientCapabilities()`](https://web.dev/articles/webauthn-client-capabilities)
for a complete list of capabilities, detailed instructions, and some best
practices.

To learn more about passkeys and passwordless login, visit [the Passkeys Chrome
page](https://developer.chrome.com/docs/identity/passkeys)