DocsReferenceSuggestionIcon API

Icon API

Use this API to get local icons (like file, folder, and application icons) from the macOS device.

The icon API is accessed through the fig:// URL scheme.

File Icons

Using Paths

To retrieve the native macOS icon for a path, simply append the path to the file or folder.

fig:///Users/mschrage/Desktop

Fig will expand a leading ~ to the user's $HOME directory. So fig://~/Desktop is valid and will result an icon equivalent to the URL above.

Note: if the specified filepath does not exist on the user's local machine, Fig will fallback to displaying an icon based on the file extension. For instance, fig://~/this-file-does-not-exist.txt will display the default .txt file icon.

Using File Extensions

You can also request the icon for a file type directly using the following syntax:

fig://icon?type=txt
fig://icon?type=png

To get the generic folder icon, pass in folder as the type.

fig://icon?type=folder

Standard Icons

Fig also bundles a library of icons that can be access through the fig:// URL scheme.

fig://icon?type=NAME

The full list as of v1.0.40 is included below:

`alert` `android` `apple` `asterisk` `aws` `azure` `box` `carrot` `characters` `command` `commandkey` `commit` `database` `docker` `firebase` `gcloud` `git` `github` `gitlab` `gradle` `heroku` `invite` `kubernetes` `netlify` `node` `npm` `option` `package` `slack` `string` `twitter` `vercel` `yarn`

If we are missing an icon, please open an issue.

Adding Badges to Icons

You can also add badges to icons. Badges are used to provide additional information or to highlight a specific suggestion. For instance, the git completion spec uses badges to indicate whether files have been renamed, modified or deleted when staging.

You can add a badge to an icon by including color or badge (or both) as query parameters.

color (optional) must be a 6 character hex color. If not specified, it defaults to red (#ff0000).

Do not include a leading hashtag as the browser will interpret anything following as a URL fragment.

badge (optional) is a unicode string. (You can even use emojis! 🎉)

fig:///Users/mschrage/Desktop/hello-world.txt?color=2ecc71&badge=✓
fig://icon?type=txt&=2ecc71&badge=✓

Both of these URLs resolve to this image:

Template

Fig also allows you to generate standalone icons using the same query parameters you use to add badges.

color describes the background color of the icon. If not specified, it defaults to white (#ffffff).

badge (optional) is a unicode string.

For example, fig://template?color=2ecc71&badge=✓ will resolve to this image: