60+ VSCode 主题,你绝对需要尝试(深色 + 浅色)Atlantic Night August Ayu Base16 Bearded theme Dobri Next Horizo​​n Material Mayukai Night Owl Rosé Pine Rouge Tinacious Design

2025-06-10

60 多个你绝对需要尝试的 VSCode 主题(深色 + 浅色)

大西洋之夜

八月

香鱼

Base16

胡须主题

Dobri Next

地平线

材料

真由介

猫头鹰

桃红松

胭脂

精致的设计

大家好!

我不知道您怎么想,但我个人非常喜欢时不时地更改我的 VSCode 主题,主要是为了提高工作效率。

所以今天我带来了60 多个主题的列表供您尝试和测试。

查看它们并在下面的评论中告诉我你最喜欢的 🙂


1. 2077

带有 2077 主题的 React 代码片段


大西洋之夜

2.《大西洋之夜》

带有 Atlantic Night 主题的 React 代码片段

3. 大西洋夜深渊

使用 Atlantic Night Abyss 主题的 React 代码片段


八月

4. 八月 - Ariake Dark

使用 August - Ariake Dark 主题的 React 代码片段

5. 八月 - 城市之光渐暗

使用 August - City Lights Darker 主题的 React 代码片段

6. 八月 - 黑暗

使用 August - Dark 主题的 React 代码片段

7. 八月 - 道布里奇

使用 August - Dawbridge 主题的 React 代码片段

8. 八月 - 晚上 7 点上床睡觉

使用 August - In Bed By 7pm 主题的 React 代码片段

9. 八月 - 晚上 7 点前上床睡觉

使用“八月 - 晚上 7 点入睡”深色主题的 React 代码片段

10. 八月 - 夜猫子

使用 August - Night Owl 主题的 React 代码片段

11. 八月 - 诺德(黑暗)

使用 August - Nord (Darker) 主题的 React 代码片段


12.极光 X

使用 Aurora X 主题的 React 代码片段


香鱼

13. Ayu - Mirage

使用 Ayu - Mirage 主题的 React 代码片段

14. Ayu - 光

使用 Ayu - Light 主题的 React 代码片段


Base16

15. 16号基地 - 暗灰烬

使用 Base16 - Dark Ashes 主题的 React 代码片段

16. Base 16 - 深摩卡

使用 Base16 - Dark Mocha 主题的 React 代码片段

17. Base 16 - 黑暗海洋

使用 Base16 - Dark Ocean 主题的 React 代码片段

18. Base 16 - 黑暗暮光

使用 Base16 - Dark Twilight 主题的 React 代码片段

19. 基地 16 - 独角猫

使用 Base16 - Unikitty 主题的 React 代码片段

20. Base 16 - 浅摩卡

使用 Base16 - Light Mocha 主题的 React 代码片段

21. Base 16 - 轻流行音乐

使用 Base16 - Light Pop 主题的 React 代码片段

22. Base 16 - 点亮明天

使用 Base16 - Light Tomorrow 主题的 React 代码片段


23.熊主题

使用 Bear 主题的 React 代码片段


胡须主题

24. 胡须主题 - Arc Blueberry

使用 Bearded - Arc Blueberry 主题的 React 代码片段

25. 胡须主题曲 - 惊喜蓝莓

使用 Bearded - Surprising Blueberry 主题的 React 代码片段

26. Bearded 主题 - Monokai Light

使用 Bearded - Monokai Light 主题的 React 代码片段


27.城市之光

使用城市之光主题的 React 代码片段

28.钴蓝色 - 深色

使用 Cobalt Next - Dark 主题的 React 代码片段

29.钴2

使用 Cobalt 2 主题的 React 代码片段

30.蓝色代码

使用 Code Blue 主题的 React 代码片段


Dobri Next

31.Dobri Next - C05 - 电子

使用 Dobri Next - C05 - Electron 主题的 React 代码片段

32. Dobri Next - C09 - Eve

使用 Dobri Next - C09 - Eve 主题的 React 代码片段


33.德古拉

带有 Dracula 主题的 React 代码片段

34.夜晚的德古拉

使用 Dracula At Night 主题的 React 代码片段

35.电子

使用 Electron 主题的 React 代码片段

36.宁静

使用 Halcyon 主题的 React 代码片段


地平线

37.地平线

使用 Horizo​​n 主题的 React 代码片段

38. 地平线 - 明亮

使用 Horizo​​n - Bright 主题的 React 代码片段


39. LaserWave

使用 LaserWave 主题的 React 代码片段


材料

40. Material 主题 - 海洋

使用 Material - Ocean 主题的 React 代码片段

41. Material 主题 - Lighter

使用 Material - Lighter 主题的 React 代码片段


真由介

42. 魔界女王 - Mirage

使用 Mayukai - Mirage 主题的 React 代码片段

43. 魔王之怒 - Mono

使用 Mayukai - Mono 主题的 React 代码片段

44. 玛尤卡 - 日落

使用 Mayukai - Sunset 主题的 React 代码片段


45. Min 主题 - 深色

使用 Min-Dark 主题的 React 代码片段


猫头鹰

46.夜猫子

使用 Night Owl 主题的 React 代码片段

47. 夜猫子 - 光

使用 Night Owl - Light 主题的 React 代码片段


48. Noctis - Hibernus

使用 Noctis - Hibernus 主题的 React 代码片段

49.一夜之间 - 沉睡

使用 Overnight - Slumber 主题的 React 代码片段

50. Panda 语法

使用 Panda Syntax 主题的 React 代码片段

51.激进

使用 Radical 主题的 React 代码片段


桃红松

52. 玫瑰松

使用 Rosé Pine 主题的 React 代码片段

53. 桃红松 - 黎明

使用 Rosé Pine - Dawn 主题的 React 代码片段


胭脂

54.胭脂

使用 Rouge 主题的 React 代码片段

55.红色2

使用 Rouge 2 主题的 React 代码片段


56.海绿色主题

使用 Sea Green 主题的 React 代码片段

57.合成波 '84

使用 SynthWave '84 主题的 React 代码片段


精致的设计

58. Tinacious设计

使用 Tinacious Design 主题的 React 代码片段

59. Tinacious 设计 - 灯光

使用 Tinacious Design - Light 主题的 React 代码片段


60.东京之夜

带有东京之夜主题的 React 代码片段

61. Vue 主题

使用 Vue 主题的 React 代码片段


🎉 不要忘记在InstagramTwitter上关注我以获取更多相关内容。

鏂囩珷鏉ユ簮锛�https://dev.to/underscorecode/60-vscode-themes-you-definitely-need-to-try-dark-light-3mg5
PREV
样式化组件 101 💅 讲座 3:使用 Next.js 的 SSR + 自定义图标字体 😍 如果我们使用 Next.js,如何让样式化组件工作 😺
NEXT
使用 React Transition Group 为你的 React 应用添加动画