AI token editor
Edit GitHub tokens
Describe what you want to change in plain English. Claude rewrites only the tokens you mention and leaves the rest alone. Download the modified CSS / JSON when you're happy.
Try:
Anonymous: 3/hr · Members: 30/hr.
Current
{
"color": {
"canvas": {
"default": {
"dark": {
"$value": "#0d1117",
"$type": "color",
"$description": "Default dark canvas background"
},
"light": {
"$value": "#ffffff",
"$type": "color",
"$description": "Default light canvas background"
}
},
"inset": {
"dark": {
"$value": "#010409",
"$type": "color",
"$description": "Deeper dark background"
}
},
"subtle": {
"dark": {
"$value": "#161b22",
"$type": "color",
"$description": "Subtle dark surface"
},
"light": {
"$value": "#f6f8fa",
"$type": "color",
"$description": "Subtle light surface"
}
}
},
"fg": {
"default": {
"dark": {
"$value": "#e6edf3",
"$type": "color",
"$description": "Primary text on dark"
},
"light": {
"$value": "#1f2328",
"$type": "color",
"$description": "Primary text on light"
}
},
"muted": {
"dark": {
"$value": "#7d8590",
"$type": "color",
"$description": "Muted text on dark"
},
"light": {
"$value": "#636c76",
"$type": "color",
"$description": "Muted text on light"
}
},
"subtle": {
"dark": {
"$value": "#6e7681",
"$type": "color",
"$description": "Subtle text on dark"
},
"light": {
"$value": "#6e7781",
"$type": "color",
"$description": "Subtle text on light"
}
}
},
"border": {
"default": {
"dark": {
"$value": "#30363d",
"$type": "color",
"$description": "Default border on dark"
},
"light": {
"$value": "#d0d7de",
"$type": "color",
"$description": "Default border on light"
}
},
"muted": {
"dark": {
"$value": "#21262d",
"$type": "color",
"$description": "Muted border on dark"
},
"light": {
"$value": "#d8dee4",
"$type": "color",
"$description": "Muted border on light"
}
}
},
"success": {
"emphasis": {
"$value": "#2da44e",
"$type": "color",
"$description": "Primary success/green CTA color"
},
"fg": {
"$value": "#1f883d",
"$type": "color",
"$description": "Success text and hover state"
}
},
"accent": {
"emphasis": {
"$value": "#0969da",
"$type": "color",
"$description": "Primary blue accent for links"
},
"fg": {
"$value": "#0366d6",
"$type": "color",
"$description": "Accent text and hover state"
}
},
"done": {
"emphasis": {
"$value": "#a371f7",
"$type": "color",
"$description": "Purple accent color"
}
},
"sponsors": {
"emphasis": {
"$value": "#bf3989",
"$type": "color",
"$description": "Pink sponsor color"
}
},
"severe": {
"fg": {
"$value": "#fb8500",
"$type": "color",
"$description": "Orange warning color"
}
},
"gradient": {
"purple": {
"start": {
"$value": "#8957e5",
"$type": "color",
"$description": "Purple gradient start"
},
"mid": {
"$value": "#6e40c9",
"$type": "color",
"$description": "Purple gradient middle"
}
},
"blue": {
"end": {
"$value": "#0969da",
"$type": "color",
"$description": "Blue gradient end"
}
},
"cyan": {
"$value": "#39c5cf",
"$type": "color",
"$description": "Cyan accent in gradients"
}
}
},
"font": {
"family": {
"sans": {
"$value": "-apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Noto Sans\", Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\"",
"$type": "fontFamily",
"$description": "System font stack for body text"
},
"mono": {
"$value": "\"SF Mono\", ui-monospace, SFMono-Regular, Consolas, \"Liberation Mono\", Menlo, monospace",
"$type": "fontFamily",
"$description": "Monospace font stack for code"
}
},
"size": {
"xs": {
"$value": "0.75rem",
"$type": "fontSize",
"$description": "12px - captions, labels"
},
"sm": {
"$value": "0.875rem",
"$type": "fontSize",
"$description": "14px - default body text"
},
"base": {
"$value": "1rem",
"$type": "fontSize",
"$description": "16px - large body text"
},
"lg": {
"$value": "1.25rem",
"$type": "fontSize",
"$description": "20px - subheadings"
},
"xl": {
"$value": "1.5rem",
"$type": "fontSize",
"$description": "24px - card headings"
},
"2xl": {
"$value": "2rem",
"$type": "fontSize",
"$description": "32px - page headings"
},
"3xl": {
"$value": "2.5rem",
"$type": "fontSize",
"$description": "40px - section headings"
},
"4xl": {
"$value": "3.5rem",
"$type": "fontSize",
"$description": "56px - large headings"
},
"5xl": {
"$value": "4.5rem",
"$type": "fontSize",
"$description": "72px - hero titles"
}
},
"weight": {
"normal": {
"$value": 400,
"$type": "fontWeight",
"$description": "Regular text weight"
},
"medium": {
"$value": 500,
"$type": "fontWeight",
"$description": "Medium weight"
},
"semibold": {
"$value": 600,
"$type": "fontWeight",
"$description": "Semibold for headings and buttons"
},
"bold": {
"$value": 700,
"$type": "fontWeight",
"$description": "Bold weight"
}
},
"lineHeight": {
"tight": {
"$value": 1.1,
"$type": "number",
"$description": "Tight line height for large headings"
},
"snug": {
"$value": 1.25,
"$type": "number",
"$description": "Snug line height for headings"
},
"normal": {
"$value": 1.5,
"$type": "number",
"$description": "Normal line height for body"
},
"relaxed": {
"$value": 1.75,
"$type": "number",
"$description": "Relaxed line height"
}
}
},
"spacing": {
"1": {
"$value": "0.25rem",
"$type": "spacing",
"$description": "4px - micro spacing"
},
"2": {
"$value": "0.5rem",
"$type": "spacing",
"$description": "8px - extra small"
},
"3": {
"$value": "0.75rem",
"$type": "spacing",
"$description": "12px - small"
},
"4": {
"$value": "1rem",
"$type": "spacing",
"$description": "16px - medium (base)"
},
"6": {
"$value": "1.5rem",
"$type": "spacing",
"$description": "24px - large"
},
"8": {
"$value": "2rem",
"$type": "spacing",
"$description": "32px - extra large"
},
"12": {
"$value": "3rem",
"$type": "spacing",
"$description": "48px - 2xl"
},
"16": {
"$value": "4rem",
"$type": "spacing",
"$description": "64px - 3xl"
},
"24": {
"$value": "6rem",
"$type": "spacing",
"$description": "96px - 4xl"
},
"32": {
"$value": "8rem",
"$type": "spacing",
"$description": "128px - 5xl"
}
},
"radius": {
"sm": {
"$value": "3px",
"$type": "borderRadius",
"$description": "Small radius for pills"
},
"md": {
"$value": "6px",
"$type": "borderRadius",
"$description": "Medium radius for buttons and inputs"
},
"lg": {
"$value": "12px",
"$type": "borderRadius",
"$description": "Large radius for cards"
}
},
"shadow": {
"sm": {
"$value": "0 1px 0 rgba(27, 31, 36, 0.04)",
"$type": "shadow",
"$description": "Small shadow for subtle elevation"
},
"md": {
"$value": "0 3px 6px rgba(140, 149, 159, 0.15)",
"$type": "shadow",
"$description": "Medium shadow for cards"
},
"lg": {
"$value": "0 8px 24px rgba(140, 149, 159, 0.2)",
"$type": "shadow",
"$description": "Large shadow for elevated elements"
},
"xl": {
"$value": "0 12px 48px rgba(31, 35, 40, 0.12)",
"$type": "shadow",
"$description": "Extra large shadow for modals"
}
},
"border": {
"width": {
"$value": "1px",
"$type": "borderWidth",
"$description": "Default border width"
}
}
}Edited (apply an instruction)
Apply an instruction to see the edited tokens here.
GitHub is a trademark of its respective owner. Tokens are an analytical reference, not an endorsement.