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

# Introduction to Passkey API

> Add passkey support to your existing auth system with Hanko Passkey API.

Hanko Passkey API adds support for passkeys for **existing users** of your platform. It's designed to be used **together with your own auth system**, and can be used without any other Hanko product.

Users cannot create an account through the Passkey API. Instead, the Passkey API enables your users to add passkeys to their existing account (they have to be logged in first) or to use them to secure
payment transactions.

<Tip>
  Please note that the Passkey API is **not** a full authentication solution — it's only intended to be used together with another authentication system that doesn't support passkeys natively.

  If you need a complete, open source authentication solution, check out [Hanko](/introduction).
</Tip>

The Passkey API is designed to be used both from your backend and frontend:

* Some requests (e.g. logging in) can be made to the Passkey API directly from the frontend. These do not require a secret API key.

* All other requests that require a secret API key (e.g. registering a new passkey) should only be made from your backend. You should **never** leak that secret API key to the client.

## Next steps

<CardGroup cols={2}>
  <Card
    title="Set up a Passkey API project"
    icon={
  <svg width="20" height="20" viewBox="0 0 48 48" fill="#5465FF" xmlns="http://www.w3.org/2000/svg">
    <path d="M36.0611 12.8774V41.9346H32.0922V26.037H16.4355V29.9695H28.1247V31.9991C28.1245 37.076 28.1162 42.1529 28.1294 47.2296C28.1302 47.5458 28.147 47.7976 28.1834 47.9964C32.6231 47.2725 36.6568 45.3468 39.9439 42.5638V22.1278C39.9439 19.047 39.2607 15.6673 36.0611 12.8774Z"/>
    <path d="M28.1934 14.0905H32.1592V5.37542C34.5455 5.89249 43.5968 11.8123 43.9658 21.0866V38.3127C46.8954 34.2961 48.6284 29.3509 48.6284 23.9988C48.6284 11.9094 39.8063 1.88475 28.2498 0C28.2157 0.203994 28.2006 0.463484 28.1989 0.790525L28.1934 14.0905Z"/>
    <path d="M12.4336 35.119V6.06185H16.4025V21.9594H32.0591V18.0269H20.37V15.9973C20.3702 10.9204 20.3784 5.8435 20.3652 0.766797C20.3645 0.450663 20.3476 0.198827 20.3113 0C15.8716 0.723931 11.8378 2.64963 8.55078 5.43264V25.8686C8.55078 28.9494 9.23395 32.3291 12.4336 35.119Z"/>
    <path d="M20.435 33.9095H16.4692V42.6246C14.0829 42.1075 5.03154 36.1877 4.66259 26.9134V9.68738C1.733 13.7039 0 18.6492 0 24.0012C0 36.0907 8.82209 46.1153 20.3786 48C20.4126 47.796 20.4278 47.5365 20.4295 47.2095L20.435 33.9095Z"/>
  </svg>
}
    href="/passkey-api/setup-passkey-project"
  >
    Set up a Passkey API project on Hanko Cloud.
  </Card>

  <Card
    title="Example implementation"
    icon={
  <svg
    xmlns="http://www.w3.org/2000/svg"
    class="icon icon-tabler icon-tabler-brand-nodejs"
    width="24"
    height="24"
    viewBox="0 0 24 24"
    strokeWidth="2"
    stroke="#5465FF"
    fill="none"
    strokeLinecap="round"
    strokeLinejoin="round"
  >
    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
    <path d="M9 9v8.044a2 2 0 0 1 -2.996 1.734l-1.568 -.9a3 3 0 0 1 -1.436 -2.561v-6.635a3 3 0 0 1 1.436 -2.56l6 -3.667a3 3 0 0 1 3.128 0l6 3.667a3 3 0 0 1 1.436 2.561v6.634a3 3 0 0 1 -1.436 2.56l-6 3.667a3 3 0 0 1 -3.128 0" />
    <path d="M17 9h-3.5a1.5 1.5 0 0 0 0 3h2a1.5 1.5 0 0 1 0 3h-3.5" />
  </svg>
}
    href="/passkey-api/example-implementation"
  >
    A Node.js example showcasing implementation of the Passkey API without any
    SDK.
  </Card>

  <Card
    title="JavaScript/TypeScript SDK"
    icon={
  <svg
    xmlns="http://www.w3.org/2000/svg"
    class="icon icon-tabler icon-tabler-brand-typescript"
    width="24"
    height="24"
    viewBox="0 0 24 24"
    strokeWidth="2"
    stroke="#5465FF"
    fill="none"
    strokeLinecap="round"
    strokeLinejoin="round"
  >
    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
    <path d="M15 17.5c.32 .32 .754 .5 1.207 .5h.543c.69 0 1.25 -.56 1.25 -1.25v-.25a1.5 1.5 0 0 0 -1.5 -1.5a1.5 1.5 0 0 1 -1.5 -1.5v-.25c0 -.69 .56 -1.25 1.25 -1.25h.543c.453 0 .887 .18 1.207 .5" />
    <path d="M9 12h4" />
    <path d="M11 12v6" />
    <path d="M21 19v-14a2 2 0 0 0 -2 -2h-14a2 2 0 0 0 -2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2 -2z" />
  </svg>
}
    href="/passkey-api/js-sdk"
  >
    If you’re already using JS/TS for your backend, you can use our SDK to
    easily integrate the Passkey API.
  </Card>

  <Card
    title="Next.js with NextAuth"
    icon={
  <svg
    xmlns="http://www.w3.org/2000/svg"
    className="icon icon-tabler icon-tabler-brand-nextjs"
    width="30"
    height="30"
    viewBox="0 0 30 30"
    strokeWidth="2"
    stroke="#5465FF"
    fill="none"
    strokeLinecap="round"
    strokeLinejoin="round"
  >
    <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
    <path d="M9 15v-6l7.745 10.65a9 9 0 1 1 2.255 -1.993"></path>
    <path d="M15 12v-3"></path>
  </svg>
}
    href="/passkey-api/next-auth"
  >
    If you're using NextAuth for handling auth in your Next.js app, you can use
    our provider to easily add passkey support.
  </Card>
</CardGroup>
