---
title: How to restore VS Code’s previous UI design
url: https://roboin.io/article/en/2026/08/16/how-to-restore-the-old-vs-code-ui-design/
description: Microsoft is testing a new UI design for VS Code, so you may see a
  new interface that differs from the previous design depending on your
  environment. Microsoft still considers the new VS Code design experimental, so
  you can turn it on or off in the settings.
publishedDate: 2026-08-15T19:19:24.116Z
modifiedDate: 2026-08-15T19:19:24.116Z
thumbnail: https://roboin.io/api/media/file/vs-code-experimental-modern-ui-setting.png
thumbnailAlt: "Screenshot of the VS Code settings screen with [Workbench >
  Experimental: Modern UI] highlighted by a red border"
thumbnailCaption: N/A
---

# How to restore VS Code’s previous UI design

Microsoft is testing a new UI design for VS Code, so you may see a new interface that differs from the previous design depending on your environment. The new UI places each element inside a rounded container. I like the design, but it has divided opinion among users.

Microsoft still considers the new VS Code design experimental, so you can turn it on or off in the settings.

![Screenshot of VS Code’s traditional UI design](https://roboin.io/api/media/file/vs-code-traditional-ui-design.png)
*Previous VS Code design*

![Screenshot of VS Code’s new UI design](https://roboin.io/api/media/file/vs-code-experimental-modern-ui-design.png)
*New VS Code design*

VS Code describes the new design in its settings as follows:

> the side bars and bottom panel are shown as floating cards with rounded corners and gaps, and a set of refreshed workbench styles is applied, matching the Agents window design.

## How to restore the previous VS Code design

Microsoft has not rolled out the new VS Code design to all users, so you may see either the old or new design depending on your environment.

If Microsoft has rolled out the new design to your environment, you can restore the previous design by setting `workbench.experimental.modernUI` to `false`.

### Change the setting from the GUI

<Steps>
  Open the VS Code settings

  Enter "modern" in the settings search bar, then turn off [Workbench > Experimental: Modern UI]

  ![Screenshot of the VS Code settings screen with \[Workbench &gt; Experimental: Modern UI\] highlighted by a red border](https://roboin.io/api/media/file/vs-code-experimental-modern-ui-setting.png)

  You’ll see the previous UI design again
</Steps>

### Change the setting in `settings.json`

<Steps>
  Open the VS Code `settings.json` file

  Set `workbench.experimental.modernUI` to `false`.

  ```json
  {
      // ...existing settings
      "workbench.experimental.modernUI": false
  }
  ```

  You’ll see the previous UI design again
</Steps>