Modernizing the VS Code UI

This explains a deliberate redesign of Visual Studio Code’s user interface focused on clarifying hierarchy, reducing visual noise, and creating a single design foundation that supports both traditional code editing and newer workflows like agent sessions. Work began with refreshed Dark 2026 and Light 2026 color themes and then used the Agents window as the proving ground for a shared system of typography, spacing, surfaces, controls, and design tokens. Rather than remaking the editor, changes target the shared workbench shell (Activity Bar, side bars, editor groups, panel, tabs, status bar) so the experience remains dense, customizable, and familiar while making controls easier to discover and important content stand out.

The modernization was rolled out incrementally - experimental in Stable, default in Insiders, then a controlled Stable experiment - while keeping an option to revert to the classic UI. Broad feedback revealed common issues: increased overall density that reduced visible code, pill-style tabs feeling detached, wider status-bar spacing, harder-to-find panel separators, theming/contrast needs, and some rendering performance concerns. On a 1920×1080 screen at 100% zoom the new UI used roughly 20 px more horizontally and 12-18 px more vertically. In response, developers added layout density controls (including a compact option that reduces spacing) and tuned tabs, borders, and responsiveness based on reported patterns.