Skip to main content

FIDO's Figma Kits

FIDO Alliance has two free Figma UI kits. Each contains a collection of ready-to-use, customizable UI components to help start your work with passkeys. Use them to accelerate the creation of prototypes and other mockups of passkey interfaces.

Steps to use the kits include:

  1. Go to FIDO's Figma community page
  2. (Optional) Browse the pages in the kits without copying them
  3. Copy the UI Kit to your Figma environment
  4. Copy the components needed
  5. Or, use the kit as a quick reference to common UI patterns

Passkey operating system dialogs kit

The Passkey operating system dialogs kit contains common user interface dialogs associated with passkeys for mobile and desktop operating systems. You can use the workflow diagrams in this kit as a reference and use the fully editable Figma components for your organization's own mockups. This kit includes operating system user interface dialogs for the following:

  • iOS
  • Android
  • macOS Chromium
  • macOS Safari
  • Windows Chromium
  • Windows Edge

Sample website user interfaces for passkeys

The Passkey prototypes kit contains the DigitalFiles and DigitalBiz user interfaces found in the Design Guidelines. Use the UI kit to help start work on your own prototypes. This UI kit contains pre-built passkey assets including:

  • Animations
  • Accessibility information
  • Layouts (for example, the passkey cards interface)
  • Icons
  • Illustrations
  • Prototypes (the same prototypes FIDO Alliance used in user experience research)
  • Symbols