logo标签列表

VS Code集成终端的颜色主题

terminalvisual-studio-code
213

我们能否更改VS Code集成终端的颜色设置？我的终端只有白色，看起来很无聊。

输入图片说明

15
这是一个有用的主题生成器，可以修改您在 settings.json 中的 "workbench.colorCustomizations"。请访问链接：https://glitchbone.github.io/vscode-base16-term/#/ - Darragh Enright
1
每个终端窗口都有不同的背景颜色和自定义选项会很不错。 - jarmod
2
要自定义终端查找高亮颜色，请在暗色主题上添加 "terminal.selectionBackground": "#e26cffcb"。请参见 vscode-terminal-change-the-find-highlight-color。 - Ricardo
这里有一个视频，展示了如何在vscode中更改终端颜色 https://youtu.be/p4h-5B8k2NY - Adam
11个回答
345

您可以通过添加以下内容到用户设置来实际修改用户设置并逐个编辑每种颜色。

  1. 打开用户设置 (Ctrl+,)
  2. 搜索 workbench 并在 Color Customizations 下选择 Edit in settings.json
"workbench.colorCustomizations" : {
    "terminal.foreground" : "#00FD61",
    "terminal.background" : "#383737"
}

想要了解可以编辑哪些颜色，您可以在这里找到更多信息。

3
目前我的VSCode版本是1.17.2（最新版本），它正在正常运行。 - Zrag123
1
{btsdaf} - Mark A. Donohoe
2
这个运行正确！不过我也想学习如何在终端中获取对比颜色！ - theusual
4
截至1.24.0版本仍然有效。我认为混淆的一部分原因是你无法在设置中搜索“terminal.background”（“'workbench.colorCustomizations'：{}”是默认设置），因此乍一看似乎缺少此功能。 - Jim K.
1
明年我就40岁了，非常感谢你的示例，让VS Code终端像我的第一台电脑Amstrad CPC 464一样。 - JGilmartin
显示剩余8条评论
114

如果您对颜色挑剔，可以使用以下代码自定义每个部分。

步骤1： 打开用户设置
Windows：Ctrl+,
Mac：CMD+Shift+P

步骤2： 搜索“workbench：color customizations”，然后选择在settings.json中编辑。 将以下代码插入现有的{}中，并根据您的喜好进行自定义。

"workbench.colorCustomizations": {
    "terminal.background":"#131212",
    "terminal.foreground":"#dddad6",
    "terminal.ansiBlack":"#1D2021",
    "terminal.ansiBrightBlack":"#665C54",
    "terminal.ansiBrightBlue":"#0D6678",
    "terminal.ansiBrightCyan":"#8BA59B",
    "terminal.ansiBrightGreen":"#237e02",
    "terminal.ansiBrightMagenta":"#8F4673",
    "terminal.ansiBrightRed":"#FB543F",
    "terminal.ansiBrightWhite":"#FDF4C1",
    "terminal.ansiBrightYellow":"#FAC03B",
    "terminal.ansiBlue":"#00a1f9",
    "terminal.ansiCyan":"#8BA59B",
    "terminal.ansiGreen":"#95C085",
    "terminal.ansiMagenta":"#8F4673",
    "terminal.ansiRed":"#FB543F",
    "terminal.ansiWhite":"#A89984",
    "terminal.ansiYellow":"#FAC03B"
},

资源：这个网站有 VS Code 主题，你可以在设置中复制/粘贴。https://glitchbone.github.io/vscode-base16-term/#/

7
谢谢！蓝色缺失：例如"terminal.ansiBlue":"#00a1f9"。 - Panagiotis Panagi
21
该网站提供了许多终端主题定制方案，您可以将其复制/粘贴到您的设置中使用：https://glitchbone.github.io/vscode-base16-term/ - OJ7
这不是挑剔颜色的问题...更多的是，一些默认颜色并不适合每个人——黑色背景上的红色？几乎看不见...我的团队中还有其他人，例如，有困难看到绿色。 所以这将有助于每个人...是的，我在黑色背景上用了红色 :-) - AlexD
1
如果您是一位视觉学习者，这里有一个短视频 https://youtu.be/rYb_WpOc0UY - Adam
48

VSCode自带颜色主题，可用于更改编辑器和终端的颜色。

  • 要更改颜色主题，请在Windows/Ubuntu上按下Ctrl+K+T，在Mac上按下CMD+K+T。
  • 或者，您可以通过在Windows/Ubuntu上按下Ctrl+Shift+P，在Mac上按下CMD+Shift+P打开命令面板并键入color。从选项中选择preferences: color theme，以选择您喜欢的颜色。
  • 您还可以从左侧栏的扩展菜单中安装更多主题。只需搜索category:themes即可安装您喜欢的主题。（如果您需要按安装次数排序主题，请搜索category:themes @sort:installs）

编辑 - 用于手动编辑终端中的颜色

VSCode团队已将自定义颜色从用户设置页面中删除。目前，使用主题是在VSCode中自定义终端颜色的唯一方法。有关更多信息，请查看issue #6766

37
谢谢你的回答，但全局主题对终端窗口的影响非常有限，只是在很宽泛的意义上影响背景和前景颜色。我和提问者想要独立地给提示符、输入命令和输出着色，而不仅仅是在白底黑字和黑底白字之间切换。你知道有什么方法可以更好地控制终端文本颜色吗？ - kjhughes
1
似乎他们已经在用户设置页面中移除了自定义颜色的功能。目前在VSCode中使用主题似乎是自定义终端颜色的唯一方法。请查看https://github.com/Microsoft/vscode/issues/6766。 - Dani Akash
很遗憾，答案似乎是目前不支持，但是这仍然是有用的信息。我会给你分配赏金。谢谢你追查这个问题。 - kjhughes
2
据我所知，仍然可以从设置中进行自定义。打开设置并查找“workbench.colorCustomizations”。 - Mark A. Donohoe
1
这是为了更改全局颜色主题，不会影响集成终端。 - Akh
显示剩余2条评论
35

将 workbench.colorCustomizations 添加到用户设置中

"workbench.colorCustomizations": {
  "terminal.background":"#FEFBEC",
  "terminal.foreground":"#6E6B5E",
  ...
}

请检查 https://glitchbone.github.io/vscode-base16-term 获取一些预设。

7
交互式预设网站是一个非常棒的资源。 - mdisibio
13
我找到的最好的颜色方案是在这个GitHub仓库中列出的VSCode Snazzy。它不仅美观，而且非常易于查看，不会刺激我的眼睛。
非常容易安装: 将snazzy.json的内容复制到您的VS Code "settings.json"文件中即可。 (如果您不知道如何打开“settings.json”文件，请首先按Ctrl+Shift+P，然后写入“Preferences: open settings(JSON)”并按回车键)。

注意：对于那些尝试过ColorTool并在VSCode外部正常工作但在VSCode内部无法正常工作的人，你们在实现上没有犯错，这只是VSCode开发人员的一个决定，使得VSCode的终端可以独立着色。

12

前往VSCode的设置

在Windows/Linux上 - 文件 > 首选项 > 设置 或 快捷键(ctrl,)

在macOS上 - 代码 > 首选项 > 设置 或 快捷键(⌘,) 或 搜索(⇧⌘P) → “首选项: 打开用户设置”

搜索"workbench: color customizations"并打开settings.json文件

如果您是第一次编辑它，您会看到 workbench.colorCustomizations 是空的。

"workbench.colorCustomizations": {
}

在 workbench.colorCustomizations 下编辑或粘贴您的配置。

填写自定义选项，这里分享 Isotope 主题。

"workbench.colorCustomizations": {

    "terminal.background":"#000000",
    "terminal.foreground":"#D0D0D0",
    "terminalCursor.background":"#D0D0D0",
    "terminalCursor.foreground":"#D0D0D0",
    "terminal.ansiBlack":"#000000",
    "terminal.ansiBlue":"#0066FF",
    "terminal.ansiBrightBlack":"#808080",
    "terminal.ansiBrightBlue":"#0066FF",
    "terminal.ansiBrightCyan":"#00FFFF",
    "terminal.ansiBrightGreen":"#33FF00",
    "terminal.ansiBrightMagenta":"#CC00FF",
    "terminal.ansiBrightRed":"#FF0000",
    "terminal.ansiBrightWhite":"#FFFFFF",
    "terminal.ansiBrightYellow":"#FF0099",
    "terminal.ansiCyan":"#00FFFF",
    "terminal.ansiGreen":"#33FF00",
    "terminal.ansiMagenta":"#CC00FF",
    "terminal.ansiRed":"#FF0000",
    "terminal.ansiWhite":"#D0D0D0",
    "terminal.ansiYellow":"#FF0099"
}

现在您可以在VS Code终端中看到您的更改。

更多主题 => Base16主题

更多自定义 => VSCode终端颜色

1
Base16主题链接很棒。 - Santiago Corredoira
terminalCursor.background 和 terminalCursor.foreground 不应该是相同的颜色。如果光标在文本上方，你将看不到文本。在我的主题中，我将 terminalCursor.background 设置为与 terminal.background 相同的颜色，这样就可以解决问题了。 - wjandrea
5

如果您需要预先构建的终端主题，请首先查看此链接

复制您想要的主题，在settings.json中添加：

"workbench.colorCustomizations":{
 //paste the copied theme  
}
4

我使用 Oh My Zsh，它使命令行变得更加有趣同时拥有许多实用功能。

在这里查看链接：https://ohmyz.sh/

2

请查看 VSCode 1.61 (2021年9月) 的以下更新内容：

此更新新增功能：

    export interface TerminalOptions {
        /**
         * Supports all ThemeColor keys, terminal.ansi* is recommended for contrast/consistency
         */
        color?: ThemeColor;
    }
    export interface ExtensionTerminalOptions {
        /**
         * Supports all ThemeColor keys, terminal.ansi* is recommended for contrast/consistency
         */
        color?: ThemeColor;
    }
你能否举个例子展示这是什么样子的，以及需要放在哪里？（或者这些是shell命令吗？） - Sterling
@Sterling，除了https://github.com/microsoft/vscode/issues/128228#issuecomment-879163304中你能看到的内容外，我没有太多其他的东西。 - VonC
0
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接