VS Code theme generator
Generate a VS Code color theme from any five-role color scheme. The export is a settings.json snippet — workbench colors (activity bar, title bar, status bar, editor), a full 16-color integrated-terminal palette, and basic token colors — so you can restyle your editor without installing a theme extension.
The scheme’s primary color drives the workbench chrome, the accent takes the status bar, and the six ANSI hues keep their conventional meaning (red still reads as an error) while borrowing the scheme’s saturation and lightness.
Open the Studio → make your own free · no signup · exports as colorschemes-theme.jsonc
How to install
- Open the Studio, pick or generate a scheme, and switch to the Themes tab
- Select VS Code and copy the snippet
- In VS Code, open Settings (JSON) via the Command Palette (⌘⇧P → "Preferences: Open User Settings (JSON)")
- Paste the keys into your settings.json and save — the colors apply instantly
Example VS Code themes
Generated from curated schemes — open one in the Studio to tweak it, or copy the export as-is.
// Paste into VS Code settings.json
"workbench.colorCustomizations": {
"activityBar.background": "#1e5631",
"activityBar.foreground": "#f6f8f4",
"titleBar.activeBackground": "#1e5631",
"titleBar.activeForeground": "#f6f8f4",
"statusBar.background": "#d9a441",
"statusBar.foreground": "#f6f8f4",
"editor.background": "#f6f8f4",
"editor.foreground": "#16241a",
"terminal.background": "#f6f8f4",
"terminal.foreground": "#16241a",
"terminal.ansiBlack": "#1d2f22",
"terminal.ansiBrightBlack": "#527a5d",
"terminal.ansiRed": "#a63a3a",
"terminal.ansiBrightRed": "#c76060",
"terminal.ansiGreen": "#1e5631",
"terminal.ansiBrightGreen": "#318c4f",
"terminal.ansiYellow": "#d9a441",
"terminal.ansiBrightYellow": "#e5c07b",
"terminal.ansiBlue": "#3a67a6",
"terminal.ansiBrightBlue": "#608bc7",
"terminal.ansiMagenta": "#a63aa6",
"terminal.ansiBrightMagenta": "#c760c7",
"terminal.ansiCyan": "#3aa6a6",
"terminal.ansiBrightCyan": "#60c7c7",
"terminal.ansiWhite": "#dbe2d4",
"terminal.ansiBrightWhite": "#f7f8f6"
},
"editor.tokenColorCustomizations": {
"comments": "#527a5d",
"keywords": "#1e5631",
"strings": "#1e5631",
"functions": "#3a67a6",
"numbers": "#d9a441"
} // Paste into VS Code settings.json
"workbench.colorCustomizations": {
"activityBar.background": "#47546a",
"activityBar.foreground": "#f8f9fb",
"titleBar.activeBackground": "#47546a",
"titleBar.activeForeground": "#f8f9fb",
"statusBar.background": "#d98e6a",
"statusBar.foreground": "#f8f9fb",
"editor.background": "#f8f9fb",
"editor.foreground": "#1b2330",
"terminal.background": "#f8f9fb",
"terminal.foreground": "#1b2330",
"terminal.ansiBlack": "#1d2430",
"terminal.ansiBrightBlack": "#52617a",
"terminal.ansiRed": "#d98e6a",
"terminal.ansiBrightRed": "#e7b8a2",
"terminal.ansiGreen": "#3ea33e",
"terminal.ansiBrightGreen": "#64c464",
"terminal.ansiYellow": "#a39a3e",
"terminal.ansiBrightYellow": "#c4bc64",
"terminal.ansiBlue": "#47546a",
"terminal.ansiBrightBlue": "#647696",
"terminal.ansiMagenta": "#a33ea3",
"terminal.ansiBrightMagenta": "#c464c4",
"terminal.ansiCyan": "#3ea3a3",
"terminal.ansiBrightCyan": "#64c4c4",
"terminal.ansiWhite": "#d4d9e2",
"terminal.ansiBrightWhite": "#f6f7f8"
},
"editor.tokenColorCustomizations": {
"comments": "#52617a",
"keywords": "#47546a",
"strings": "#3ea33e",
"functions": "#47546a",
"numbers": "#d98e6a"
} Also export for
Omarchy · Ghostty · Base16 · Windows Terminal · iTerm2 · Alacritty · Kitty · Xresources · Slack