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#181818
  • activityBar.border#2B2B2B
  • activityBar.foreground#D7D7D7
  • activityBar.inactiveForeground#868686
  • editor.background#1F1F1F
  • editor.foreground#CCCCCC
  • editor.inactiveSelectionBackground#3A3D41
  • editor.lineHighlightBackground#2A2A2A
  • editor.selectionBackground#264F78
  • editorBracketMatch.background#0064001a
  • editorBracketMatch.border#888888
  • editorCursor.foreground#AEAFAD
  • editorLineNumber.activeForeground#C6C6C6
  • editorLineNumber.foreground#858585
  • sideBar.background#181818
  • sideBar.border#2B2B2B
  • sideBar.foreground#CCCCCC
  • statusBar.background#181818
  • statusBar.border#2B2B2B
  • statusBar.foreground#CCCCCC
  • tab.activeBackground#1F1F1F
  • tab.activeForeground#FFFFFF
  • tab.border#2B2B2B
  • tab.inactiveBackground#181818
  • tab.inactiveForeground#8A8A8A
  • titleBar.activeBackground#181818
  • titleBar.activeForeground#CCCCCC
  • titleBar.border#2B2B2B

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
keyword.control.tesslang#C586C0
keyword.control.import.tesslang#C586C0
entity.name.import.tesslang#4EC9B0bold
storage.type.tesslang#569CD6
support.function.tesslang#DCDCAA
entity.name.function.tesslang#DCDCAA
string.quoted.double.tesslang, string.quoted.simple.tesslang#CE9178
constant.character.escape.tesslang#D7BA7D
constant.numeric.tesslang#B5CEA8
keyword.operator.tesslang#D4D4D4
comment.line.double-slash.tesslang, comment.block.tesslang#6A9955italic
Tesseract Language Syntax Highlighter by Fran23135dev - VS Code Theme