Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.tokencraft.dev/llms.txt

Use this file to discover all available pages before exploring further.

​
list_tokens_by_mode

Retrieves all design tokens within a specific mode of a tokenset.

​
Tool Schema

{
  "name": "list_tokens_by_mode",
  "description": "List all tokens for a specific mode",
  "inputSchema": {
    "type": "object",
    "properties": {
      "tokenset_id": {
        "type": "string",
        "description": "The ID of the tokenset"
      },
      "mode_id": {
        "type": "string",
        "description": "The ID of the mode"
      }
    },
    "required": ["tokenset_id", "mode_id"]
  }
}

​
Parameters

ParameterTypeRequiredDescription
tokenset_idstringYesThe ID of the tokenset
mode_idstringYesThe ID of the mode to list tokens from

​
Response

{
  "tokens": [
    {
      "id": "550e8400-e29b-41d4-a716-446655440030",
      "name": "color.primary",
      "type": "color",
      "value": "#007AFF",
      "description": "Primary brand color",
      "alias_to": null,
      "mode_id": "550e8400-e29b-41d4-a716-446655440020",
      "tokenset_id": "550e8400-e29b-41d4-a716-446655440010",
      "created_at": "2025-01-15T13:00:00Z",
      "updated_at": "2025-01-15T13:00:00Z"
    },
    {
      "id": "550e8400-e29b-41d4-a716-446655440031",
      "name": "color.secondary",
      "type": "color",
      "value": "#5856D6",
      "description": "Secondary brand color",
      "alias_to": null,
      "mode_id": "550e8400-e29b-41d4-a716-446655440020",
      "tokenset_id": "550e8400-e29b-41d4-a716-446655440010",
      "created_at": "2025-01-15T13:05:00Z",
      "updated_at": "2025-01-15T13:05:00Z"
    }
  ],
  "total": 2
}

​
Example Usage in Claude

​
List Tokens in Light Mode

You: Show me all tokens in the Light mode of my color tokenset

Claude: Here are the tokens in the Light mode:

**Colors (Light Mode)**
1. **color.primary** = #007AFF
   - Primary brand color

2. **color.secondary** = #5856D6
   - Secondary brand color

3. **color.accent** = #FF9500
   - Accent color for highlights

Total: 3 tokens

​
Compare Modes

You: Show tokens in both Light and Dark modes side by side

Claude: Let me get the tokens from both modes.

**Light Mode:**
- color.primary: #007AFF
- color.secondary: #5856D6
- color.background: #FFFFFF

**Dark Mode:**
- color.primary: #0A84FF
- color.secondary: #5E5CE6
- color.background: #000000

The dark mode has adjusted values for better contrast.

​
Token Types

Tokens can have different types:
  • color: Hex colors, RGB values
  • dimension: Spacing, sizing values
  • fontFamily: Font family names
  • fontSize: Font sizes
  • typography: Complete text styles
  • number: Numeric values
  • And many more…

​
Common Use Cases

​
1. Theme Review

You: Show me all the colors in my dark theme

​
2. Token Inventory

You: What tokens exist in the Light mode?

​
3. Mode Comparison

You: Compare the typography tokens between Light and Dark modes

​
Notes

  • Tokens in different modes can have different values for the same name
  • The alias_to field indicates if a token references another token
  • Use token IDs for individual token operations
  • The response includes creation and update timestamps

​
See Also