# Token Anatomy - Type ## Token Anatomy - Type The `type` of Design Token defines which category of design property this decision belongs to, or ***when*** it can be applied.

In this infographic, the Token examples on the right side highlight the Type. Both code blocks have coloras the Token Type.

### Type = Design property For example, the system could interpret a Token with a Value of `#22c55e` applied to a text layer as a string property to create a text element or a color hex code. When we define a Token Type of `color` alongside the Value, it's much easier to communicate that this design decision is to be applied *when* the **color** of a text element should be green.

An infographic example of documenting a Token with a value of #b1f1cb with a different application depending on the Token Type that is defined.

### Token Types for design properties There are many 'Official' Token Types are listed in the [W3C Design Tokens Community Group (DTCG) Specifications for Design Tokens](https://tr.designtokens.org/format/#types). Most often, `type`matches a design property. For example, the `type` of Color can be applied to any design element requiring color. The DTCG Specifications define how the Token is written depending on its `type`. For example, a Typography Token requires several design decisions to be composed into a single token, whereas a Color Token does not. Tokens Studio supports 24 unique Token Types, and the DTCG is constantly adding new Token Types to the specification.

The Tokens page of the Tokens Studio Plugin shows all Token Types supported. The list is quite long, so the page is scrolled and shown side-by-side to capture them all.

*If you are ready to jump into Tokens Studio, this guide will walk you through the nuances of each Token Type.* {% content-ref url="../../manage-tokens/token-types" %} [token-types](https://docs.tokens.studio/manage-tokens/token-types) {% endcontent-ref %} *** ### Up next - Value Next, let's explore the `value` of a Design Token as this anatomic property depends on the Token's Type.

In this infographic, the Token examples on the right side highlight the Value. The top code block shows a hard-coded value. The bottom code block has a value that references another Token.