将 VS Code 打造成 Trae 编辑器风格

Trae Themes

将 VS Code 打造成 Trae 编辑器风格的配色方案,包含三个主题。

主题 预览
Deep Blue(深蓝)
Dark(暗色)
Light(亮色)

本插件源码来源于 Trae\resources\app\extensions\theme-icube,主要修复了深蓝(Deep Blue)配色问题。暗色(Dark)保持原版未改动。

安装步骤

第一步:下载字体

前往 JetBrains Mono 下载并安装字体。

第二步:设置行高

在 VS Code 设置中调整行高,模拟 Trae 的视觉间距。打开 settings.json 添加:

json 复制代码
"editor.lineHeight": 1.7

第三步:安装本插件

  1. 前往 Releases 下载 trae-themes-*.vsix
  2. VS Code 中 Ctrl+Shift+PExtensions: Install from VSIX... 选择下载的文件
  3. 安装后 Ctrl+K Ctrl+T 选择主题

深蓝配色修复

以下修复仅针对 Deep Blue(深蓝)主题。

Trae 与 VS Code 不兼容

Trae 使用了自有的 icube.* 颜色变量,VS Code 无法识别,导致 UI 区域颜色丢失。

  • 状态栏背景透明
  • 侧栏 / 面板 / 分栏之间的边框分割线缺失
  • 输入框边框
  • 扩展安装按钮

Trae 原版遗漏

修复项 修复前 修复后
选项卡
鼠标移入提示
弹窗
MD 代码块 / 引用块背景
终端固定区悬停

亮色修复

  • 状态栏文字不可见 → 背景 #EDEFF2,文字 #31353A

二次开发

bash 复制代码
git clone https://github.com/642661520/vscode-trae-themes.git
cd vscode-trae-themes
# 编辑 themes/ 下的主题 JSON 文件,修改颜色
npm run package
# 生成 trae-themes-0.0.2.vsix,即可安装测试

License

MIT

相关推荐
豆包MarsCode4 天前
从内容选题到复盘,TraeWork 让 1 个人顶 1 支团队
trae
武雄(小星Ai)5 天前
2026 AI编程工具横评:Trae、Cursor、Copilot、Claude Code实测对比
ai·copilot·cursor·编程工具·trae·claude code·对比评测
豆包MarsCode5 天前
用 TRAE Work,1个人就能编写完一整套课程
trae
咖啡星人k5 天前
AI 编程工具集体变脸:Cursor 漏洞、TRAE 限额、Claude Code 数据收集风波
人工智能·安全·microsoft·cursor·trae·ai编程工具
梦想的颜色9 天前
2026 VibeCoding 工具链精选|IDE + 大模型成套组合推荐,按场景分级收录
ide·trae·ai 编程·vibecoding·国产海外 ai 编程方案·氛围编程成套配置·副业 ai 开发工具栈
豆包MarsCode10 天前
用 TRAE Work,1个人也能轻松做好自媒体
trae
豆包MarsCode11 天前
万字长文|数据分析7大场景实战教程
trae
麦哲思科技任甲林11 天前
Codex+ChatGPT 胜过TRAE+DeepSeek组合的感受
chatgpt·deepseek·trae·工程化ai
丁劲犇11 天前
Trae的十二时辰-驱动GLM5.2用AI重构Python版飞鸽传书(iptux)
开发语言·人工智能·python·重构·trae·glm-5.2
wMoqi14 天前
trae cn 中ai开发配置skill mcp 规则参考(yudao-cloud项目-个人用)
ai·skill·yudao·mcp·trae