Skip to main content
GET
/
api
/
v1
/
tokensets
/
{id}
/
export
Export Tokenset
curl --request GET \
  --url https://app.tokencraft.dev/api/v1/api/v1/tokensets/{id}/export \
  --header 'Authorization: Bearer <token>'

Export Tokenset

Exports all modes of a tokenset in your chosen format. This is useful when you want to download a complete tokenset with all its variations.

Endpoint

GET /api/v1/tokensets/{id}/export?format={format}

Request

Path Parameters

ParameterTypeRequiredDescription
idstringYesTokenset ID

Query Parameters

ParameterTypeRequiredDescription
formatstringNoExport format (default: json)

Supported Formats

FormatDescriptionExtension
jsonW3C Design Tokens with mode extensions.json
cssCSS variables (separated by mode).css
iosSwift code for iOS.swift
androidXML resources for Android.xml

Response

The response content type and structure depend on the chosen format.

JSON Format

Content-Type: application/json
{
  "$modes": {
    "light": {
      "colors": {
        "primary": {
          "500": {
            "value": "#3b82f6",
            "type": "color"
          }
        }
      }
    },
    "dark": {
      "colors": {
        "primary": {
          "500": {
            "value": "#60a5fa",
            "type": "color"
          }
        }
      }
    }
  }
}

CSS Format

Content-Type: text/css
/* Light Mode */
:root[data-theme="light"] {
  --colors-primary-500: #3b82f6;
}

/* Dark Mode */
:root[data-theme="dark"] {
  --colors-primary-500: #60a5fa;
}

iOS Format

Content-Type: text/plain
import UIKit

enum DesignTokens {
    enum Light {
        enum Color {
            static let colorsPrimary500 = UIColor(red: 0.231, green: 0.510, blue: 0.965, alpha: 1.000)
        }
    }
    
    enum Dark {
        enum Color {
            static let colorsPrimary500 = UIColor(red: 0.376, green: 0.647, blue: 0.980, alpha: 1.000)
        }
    }
}

Android Format

Content-Type: application/xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- Light Mode -->
    <color name="colors-primary-500-light">#3b82f6</color>
    
    <!-- Dark Mode -->
    <color name="colors-primary-500-dark">#60a5fa</color>
</resources>

Examples

curl -H "Authorization: Bearer dtk_your_token_here" \
  "https://app.tokencraft.dev/api/v1/tokensets/tokenset-123/export?format=json" \
  -o tokens.json

JavaScript Example

async function exportTokenset(tokensetId, format = 'json') {
  const response = await fetch(
    `https://app.tokencraft.dev/api/v1/tokensets/${tokensetId}/export?format=${format}`,
    {
      headers: {
        'Authorization': `Bearer ${process.env.TOKENCRAFT_TOKEN}`
      }
    }
  );
  
  if (format === 'json') {
    return await response.json();
  }
  
  return await response.text();
}

// Usage
const tokens = await exportTokenset('tokenset-123', 'json');
const css = await exportTokenset('tokenset-123', 'css');

Error Responses

400 Bad Request

{
  "error": "Invalid format. Supported formats: json, css, ios, android"
}

404 Not Found

{
  "error": "Tokenset not found"
}

Use Cases

1. Download Complete Tokenset

Export all modes for local development:
#!/bin/bash
TOKENSET_ID="tokenset-123"
TOKEN="dtk_your_token_here"

curl -H "Authorization: Bearer $TOKEN" \
  "https://app.tokencraft.dev/api/v1/tokensets/$TOKENSET_ID/export?format=json" \
  -o tokens.json

curl -H "Authorization: Bearer $TOKEN" \
  "https://app.tokencraft.dev/api/v1/tokensets/$TOKENSET_ID/export?format=css" \
  -o tokens.css

2. CI/CD Build Step

Automatically sync tokens during builds:
# .github/workflows/sync-tokens.yml
- name: Download tokens
  run: |
    curl -H "Authorization: Bearer ${{ secrets.TOKENCRAFT_TOKEN }}" \
      "${{ secrets.API_BASE }}/tokensets/${{ secrets.TOKENSET_ID }}/export?format=css" \
      -o src/styles/tokens.css

3. Multi-platform Export

Generate platform-specific files:
async function exportAllPlatforms(tokensetId) {
  const formats = ['json', 'css', 'ios', 'android'];
  
  for (const format of formats) {
    const content = await exportTokenset(tokensetId, format);
    const filename = `tokens.${getExtension(format)}`;
    fs.writeFileSync(filename, content);
    console.log(`Exported ${filename}`);
  }
}

Best Practices

1. Cache Exports

Tokens don’t change frequently:
const cache = new Map();
const CACHE_TTL = 5 * 60 * 1000; // 5 minutes

async function getCachedExport(tokensetId, format) {
  const key = `${tokensetId}-${format}`;
  const cached = cache.get(key);
  
  if (cached && Date.now() - cached.timestamp < CACHE_TTL) {
    return cached.data;
  }
  
  const data = await exportTokenset(tokensetId, format);
  cache.set(key, { data, timestamp: Date.now() });
  
  return data;
}

2. Automate Syncing

Set up scheduled exports:
// Run daily at 2 AM
cron.schedule('0 2 * * *', async () => {
  const tokens = await exportTokenset(tokensetId, 'json');
  fs.writeFileSync('tokens.json', JSON.stringify(tokens, null, 2));
  console.log('Tokens synced');
});

3. Version Control

Commit generated files:
#!/bin/bash
./scripts/sync-tokens.sh

if [[ `git status --porcelain` ]]; then
  git add tokens.json tokens.css
  git commit -m "Update design tokens"
  git push
fi

Next Steps