Tag
Tags help people filter content or see metadata at a glance.
- Use tags to show options for a specific context
- Five types: filled, outline, square, pill, or closable
- Use any non-actionable palette or gradient style
Examples
Pill
1
Square
2
Outlined
3
Gradient
4
Filled
5
Closable
6
Text
Resources
| Name | Resource | Status |
|---|---|---|
| Figma | Design Kit (Figma) | Private |
- Use tags to show options for a specific context
- Five types: filled, outline, square, pill, or closable
- Use any non-actionable palette or gradient style
Examples
Pill
1
Square
2
Outlined
3
Gradient
4
Filled
5
Closable
6
Text
Resources
| Name | Resource | Status |
|---|---|---|
| Figma | Design Kit (Figma) | Private |
- Use tags to show options for a specific context
- Five types: filled, outline, square, pill, or closable
- Use any non-actionable palette or gradient style
Examples
Pill
1
Square
2
Outlined
3
Gradient
4
Filled
5
Closable
6
Text
Resources
| Name | Resource | Status |
|---|---|---|
| Figma | Design Kit (Figma) | Private |
- Use tags to show options for a specific context
- Five types: filled, outline, square, pill, or closable
- Use any non-actionable palette or gradient style
Examples
Pill
1
Square
2
Outlined
3
Gradient
4
Filled
5
Closable
6
Text
Resources
| Name | Resource | Status |
|---|---|---|
| Figma | Design Kit (Figma) | Private |