Skip to main content
Coding Theme

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

Loading...

colors

Workbench UI color keys from the theme JSON colors map.

  • activityBar.background#2D2B55
  • activityBar.foreground#FFFF00
  • activityBarBadge.background#FF4081
  • activityBarBadge.foreground#FFFFFF
  • editor.background#1E1E2E
  • editor.findMatchBackground#FF408180
  • editor.findMatchHighlightBackground#FFFF0080
  • editor.foreground#F8F8F2
  • editor.selectionBackground#4D4B8380
  • editor.wordHighlightBackground#4D4B8380
  • editorBracketMatch.background#4D4B8380
  • editorBracketMatch.border#FF4081
  • editorCursor.foreground#FF4081
  • editorGroupHeader.tabsBackground#1E1E2E
  • editorLineNumber.activeForeground#FFFF00
  • editorLineNumber.foreground#A599E9
  • list.activeSelectionBackground#2D2B55
  • list.activeSelectionForeground#FFFF00
  • list.hoverBackground#252540
  • list.hoverForeground#00FFFF
  • menu.background#2D2B55
  • menu.foreground#A599E9
  • menubar.selectionBackground#1E1E2E
  • menubar.selectionForeground#FF4081
  • sideBar.background#252540
  • sideBar.foreground#A599E9
  • sideBarTitle.foreground#FFFF00
  • statusBar.background#2D2B55
  • statusBar.foreground#00FFFF
  • tab.activeBackground#2D2B55
  • tab.activeForeground#FF4081
  • tab.inactiveBackground#1E1E2E
  • tab.inactiveForeground#A599E9
  • terminal.background#1E1E2E
  • terminal.foreground#F8F8F2
  • terminalCursor.foreground#FF4081
  • titleBar.activeBackground#2D2B55
  • titleBar.activeForeground#FF4081

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6A9955
string, punctuation.definition.string#FF9D00
constant.numeric, constant.language, constant.character, constant.other#FF628C
variable#FF628C
keyword#FF4081
storage#00FFFF
entity.name.function#FFFF00
support.function#00FFFF
entity.name.type, entity.other.inherited-class#A599E9
meta.tag#FF628C
Coder Theme New by Tarun Jawla - VS Code Theme