# Token Anatomy - Description

## Token Anatomy - Description

The `description` of a Design Token can be used to define additional details, like ***why*** or ***how*** we made this decision. The `description` is optional.&#x20;

<figure><img src="https://3704321769-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fds8Db2rgs9JSaG6grP0o%2Fuploads%2FPVOhLCiPqVNKvjFibqWO%2Ftoken-anatomy-card-description%402x.png?alt=media&#x26;token=e21ac8d1-5da1-4a73-9163-6bd558796266" alt=""><figcaption><p>In this infographic, the Token examples on the right side highlight the Description. Only the bottom example has a description. </p></figcaption></figure>

### Description = Additional context when needed

You can think of a Token's **description** as a place to add a note or reminder about this design decision for your engineers or future self.

For example, a Font Family Token may have a description with a link to download the files.

<figure><img src="https://3704321769-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fds8Db2rgs9JSaG6grP0o%2Fuploads%2FAnLH0Cr899uYkbuqeNMj%2Ftoken-intro-example-description.png?alt=media&#x26;token=6b6bed0e-089d-41c5-98cc-7a3dd6b827df" alt=""><figcaption><p>An infographic example of documenting a Font Family Token with a Description that includes a note and URL to download the Font.</p></figcaption></figure>

### Descriptions are meta-data shared across tools and technologies.

Descriptions are technically meta-data, so the `description` is available anywhere a Token is utilized. Engineers can view the description in code and design tools often add the `description` to token properties.&#x20;

For example, if a brand color is bright and vibrant it may have limited use cases. Any constraints can be added to the `description` in the Token as below.&#x20;

> *Only use for brand logo and branded illustrations as this lime green is not accessible for interactive elements.*

When that Token is attached to a color style in Figma, the `description` is visible to designers using Figma's native UI.&#x20;

The additional context you can add to the `description` of a Token helps cross-functional team members understand ***why*** or ***how*** they might use these design decisions in their own work.&#x20;

***

### Up next - Name

Next, let's explore the `name` of a Design Token as this anatomic property often provides an indication of design decisions that are detailed in the `description` .&#x20;

<figure><img src="https://3704321769-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fds8Db2rgs9JSaG6grP0o%2Fuploads%2FA3gVG461B2oCHdAVQnBZ%2Ftoken-anatomy-name.png?alt=media&#x26;token=098fae50-39fc-4640-bafd-3cdd9493938d" alt=""><figcaption><p>In this infographic, the Token examples on the right side highlight the Name. The top code block shows a Token Name with groups. The bottom code block shows a flat Token Name.</p></figcaption></figure>

<div data-full-width="true"><figure><img src="https://3704321769-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fds8Db2rgs9JSaG6grP0o%2Fuploads%2FZFWyIDJ8TTgum6566W4X%2Fspacer-image.png?alt=media&#x26;token=ca910cc6-4dd1-4019-940b-c67bbb539bd4" alt=""><figcaption></figcaption></figure></div>
