Theme Crafter

Theme Crafter is a VS Code extension with a Webview UI for creating workspace themes. It provides color token editing with live preview and saves variant- specific theme files.

Current capabilities

• Light/Dark variant toggle
• Randomize palette (seeded HSL generator)
• Touch mode toggle for larger controls
• Live VS Code-style mock preview panel
• Editable color token groups:
  • Editor
  • Sidebar
  • Activity Bar
  • Status Bar
  • Title Bar
  • Button
  • Tabs
  • List Selection
• Save action writes:
  • themes/custom-color-theme-dark.json
  • themes/custom-color-theme-light.json
• Save also updates workspace setting:
  • workbench.colorCustomizations

Quick start

1. Install dependencies and compile:

npm install
npm run compile

2. Open this folder in VS Code.
3. Press F5 to launch the Extension Development Host.
4. In the Extension Development Host window, open Command Palette and run Theme Crafter: Open.
5. Adjust colors and click Save Theme.