Skip to main content
Coding Theme

Color themes

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#00212B
  • activityBar.border#073642
  • activityBar.foreground#93a1a1
  • badge.background#047aa6
  • button.background#2AA19899
  • debugExceptionWidget.background#00212B
  • debugExceptionWidget.border#AB395B
  • debugToolBar.background#00212B
  • dropdown.background#00212B
  • dropdown.border#2AA19899
  • editor.background#002B36
  • editor.findMatchBackground#732b0d99
  • editor.findMatchHighlightBackground#424d0099
  • editor.foreground#93a1a1
  • editor.lineHighlightBorder#073642
  • editor.rangeHighlightBackground#073642cc
  • editor.selectionBackground#268bd240
  • editor.selectionHighlightBackground#005A6FAA
  • editor.wordHighlightBackground#424d0080
  • editor.wordHighlightStrongBackground#732b0d80
  • editorBracketMatch.background#b588002e
  • editorBracketMatch.border#b589004d
  • editorCursor.foreground#b58900
  • editorGroup.border#00212B
  • editorGroup.dropBackground#2AA19844
  • editorGroupHeader.border#073642
  • editorGroupHeader.tabsBackground#00212B
  • editorHoverWidget.background#004052
  • editorIndentGuide.activeBackground1#586e75bf
  • editorIndentGuide.background1#586e754d
  • editorLineNumber.activeForeground#93a1a1
  • editorLineNumber.foreground#8394964d
  • editorMarkerNavigationError.background#AB395B
  • editorMarkerNavigationWarning.background#5B7E7A
  • editorRuler.foreground#586e754d
  • editorWhitespace.foreground#657b8380
  • editorWidget.background#00212B
  • errorForeground#ffeaea
  • focusBorder#2AA19899
  • input.background#003847
  • input.foreground#93a1a1
  • input.placeholderForeground#839496AA
  • inputOption.activeBorder#2AA19899
  • inputValidation.errorBackground#571b26
  • inputValidation.errorBorder#a92049
  • inputValidation.infoBackground#052730
  • inputValidation.infoBorder#363b5f
  • inputValidation.warningBackground#5d5938
  • inputValidation.warningBorder#9d8a5e
  • list.activeSelectionBackground#005A6F
  • list.dropBackground#00445488
  • list.highlightForeground#1ebcc5
  • list.hoverBackground#004454AA
  • list.inactiveSelectionBackground#00445488
  • minimap.selectionHighlight#268bd240
  • panel.background#00212B
  • panel.border#073642
  • panelTitle.border#073642
  • peekView.border#2b2b4a
  • peekViewEditor.background#10192c
  • peekViewEditor.matchHighlightBackground#7744AA40
  • peekViewResult.background#00212B
  • peekViewTitle.background#00212B
  • pickerGroup.border#2AA19899
  • pickerGroup.foreground#2AA19899
  • ports.iconRunningProcessForeground#369432
  • progressBar.background#047aa6
  • quickInputList.focusBackground#005A6F
  • selection.background#2AA19899
  • sideBar.background#00212B
  • sideBar.border#073642
  • sideBar.foreground#839496
  • sideBarTitle.foreground#93a1a1
  • statusBar.background#00212B
  • statusBar.border#073642
  • statusBar.debuggingBackground#00212B
  • statusBar.foreground#93a1a1
  • statusBar.noFolderBackground#00212B
  • statusBarItem.prominentBackground#003847
  • statusBarItem.prominentHoverBackground#003847
  • statusBarItem.remoteBackground#2AA19899
  • tab.activeBackground#002B37
  • tab.activeForeground#d6dbdb
  • tab.border#003847
  • tab.inactiveBackground#00212B
  • tab.inactiveForeground#93a1a1
  • tab.lastPinnedBorder#2AA19844
  • terminal.ansiBlack#000000
  • terminal.ansiBlue#268bd2
  • terminal.ansiBrightBlack#000000
  • terminal.ansiBrightBlue#268bd2
  • terminal.ansiBrightCyan#2aa198
  • terminal.ansiBrightGreen#859900
  • terminal.ansiBrightMagenta#d33682
  • terminal.ansiBrightRed#dc322f
  • terminal.ansiBrightWhite#fdf6e3
  • terminal.ansiBrightYellow#b58900
  • terminal.ansiCyan#2aa198
  • terminal.ansiGreen#859900
  • terminal.ansiMagenta#d33682
  • terminal.ansiRed#dc322f
  • terminal.ansiWhite#fdf6e3
  • terminal.ansiYellow#b58900
  • terminal.background#002b36
  • terminal.foreground#93a1a1
  • titleBar.activeBackground#002C39

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
entity.name.variable#93a1a1
comment, punctuation.definition.comment#cb4b16
string, string.regexp, constant.other.symbol#859900
constant.character.escape#657b83
constant.numeric, constant.character, constant.keyword, constant#d33682
entity.name,support.function#b58900
punctuation,meta.brace#657b83
invalid#dc322f
Solarized Min by nashpatty - VS Code Theme