Stop Hand-Editing JSON: Engineering Your VS Code Theme with YAML

Series Navigation – Part 1: From Zero to Your First VS Code Theme – Part 2: Stop Hand-Editing JSON: Engineering Your Theme with YAML (this article) – Part 3: Light, Dark, and Beyond: Building Multi‑theme Variants with Gravity Compensation (coming soon) – Part 4: From Theme to Design System: Visual Contracts and Brand Ecosystems (coming soon) In Part 1, you learned how to create and publish your first VS Code theme from scratch. But as your theme grows, you probably run into these problems: A single JSON file becomes thousands of lines long; changing one color means hunting across the file and risking mistakes. Adding syntax highlighting for different languages means piling rules into one huge tokenColors array—hard to read, even harder to maintain. Wanting a light version? You have to duplicate the whole file and manually tweak hundreds of color values. It’s time to bring engineering to your theme. This guide will show you how to refactor your monolithic JSON theme into a modular, main