Generate an API key

When designing for the generation of API keys, ensure users know what the key is created for, the security implications, and the end destination of the key.

Status:

Maintainer:

Example of an API key being generated

General access keys

Instant generation

Users click a primary Generate button. Consider displaying a Generating… state if the API key takes time to generate.

Example of a generate button.

Once the API key is generated it displays in a modal. Include a Copy button.

Example of a successfully created API key

Optionally:

  • Display two parts to the API key where required
  • Provide information text about the API key
  • Allow users to toggle the visibility of the key
  • Provide a secondary link to download the key
Example of a hidden API key

Example of a hidden API key

Example of a revealed API key

Example of a revealed API key

Name the API key

You can ask a user to provide a descriptive name before the key is generated. This is particularly useful in instances where a user may have keys for several applications stored in the same location.

Example of an API key with a custom name
Example of an API key destination selector

Example of an API key destination selector

Restricted access keys

A user may want to limit the access an application or service is granted. Restricted access allows a user to assign specific access control and permissions before the API key is generated.

Example of a restricted API key generation