我們都想擁有一個看起來十分好看的代碼編輯器。

插件列表

為了實現這個目標，我們需要以下插件：

1. Customize UI
2. Activitus Bar
3. City Lights icon package
4. Nord Theme

Customize UI - Visual Studio Marketplace

City Lights Icon package - Visual Studio Marketplace

Activitus Bar - Visual Studio Marketplace

Nord - Visual Studio Marketplace

Customize UI

Customize UI 可以提供非常豐富的自定義選項。

但是在這裡，我們需要使用它提供的原生 Title bar 功能。

"customizeUI.font.monospace": "JetBrains Mono",
    "customizeUI.font.regular": "SF Pro Text",
    "customizeUI.fontSizeMap": {
        "12px": "11px",
        "13px": "11px",
        "menu": "13px",
        "monospace": "12px",
        "tab-title": "11px",
        "window-title": "11px"
    },
    "customizeUI.listRowHeight": 24,
    "customizeUI.stylesheet": {
        ".search-view .search-widgets-container": "padding-top: 0px !important",
        ".suggest-input-container": "padding: 3px 4px 3px !important;"
    },
    "customizeUI.titleBar": "inline",
		"window.nativeTabs": true,
    "window.titleBarStyle": "native",

Activitus Bar

Activitus Bar 可以讓編輯器的 Activitus Bar 顯示在 Status Bar 上，讓整個介面顯示起來更為簡潔。

City Lights icon package

City Lights icon 是一款低調的 icon package，讓我們的 icon 看起來更符合介面主題的要求。

Nord Theme

Nord 配色方案是我目前最喜歡的色彩。

它除了有 VSCode 色彩主題，還有 Terminal、Xcode 等。

Nord

END

就這樣，你就獲得一個好看的主題了。當然，一些更細節的地方需要自己的認真推敲。

附送上完整的 Settings.json 以供參考。

https://gist.github.com/qoli/9226ee96adc55c4f8b1fdb36bc35243b