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#323738
  • activityBar.foreground#c5c5c5
  • activityBar.inactiveForeground#6d7070
  • dropdown.background#0e1415
  • dropdown.border#444849
  • dropdown.foreground#8dafb2
  • dropdown.listBackground#0e1415
  • editor.background#0E1415
  • editor.findMatchBackground#4f5253
  • editor.findMatchBorder#cd974b
  • editor.findMatchHighlightBackground#00000000
  • editor.findMatchHighlightBorder#cd974b
  • editor.findRangeHighlightBackground#00000000
  • editor.findRangeHighlightBorder#cd974b
  • editor.foreground#8DAFB2
  • editor.inactiveSelectionBackground#4f5253
  • editor.lineHighlightBackground#1a2021
  • editor.lineHighlightBorder#1a2021
  • editor.rangeHighlightBackground#00000000
  • editor.rangeHighlightBorder#00000000
  • editor.selectionBackground#1d2324
  • editor.selectionHighlightBackground#1d2324
  • editor.selectionHighlightBorder#1d2324
  • editorCursor.foreground#FFBC5D
  • editorGroupHeader.tabsBackground#323738
  • editorGroupHeader.tabsBorder#00000000
  • editorIndentGuide.activeBackground#212b2d
  • editorIndentGuide.background#212b2d
  • editorLineNumber.activeForeground#4e6264
  • editorLineNumber.foreground#4e6264
  • focusBorder#00000000
  • gitDecoration.addedResourceForeground#95cb82
  • gitDecoration.conflictingResourceForeground#cd974b
  • gitDecoration.deletedResourceForeground#c7423b
  • gitDecoration.ignoredResourceForeground#5e5f5f
  • gitDecoration.modifiedResourceForeground#0083B2
  • gitDecoration.submoduleResourceForeground#CC8BC9
  • gitDecoration.untrackedResourceForeground#6d7070
  • input.background#0e1415
  • input.border#0e1415
  • input.foreground#8dafb2
  • input.placeholderForeground#2d3a3b
  • inputOption.activeBorder#8e9090
  • list.activeSelectionBackground#575b5c
  • list.activeSelectionForeground#ffffff
  • list.focusBackground#3e4344
  • list.focusForeground#cfd0d0
  • list.hoverBackground#3e4344
  • list.hoverForeground#cfd0d0
  • list.inactiveSelectionBackground#575b5c
  • list.inactiveSelectionForeground#ffffff
  • panel.background#0E1415
  • panel.border#444849
  • peekView.border#444849
  • peekViewEditor.background#0E1415
  • peekViewResult.selectionBackground#575b5c
  • peekViewResult.selectionForeground#ffffff
  • scrollbar.shadow#00000000
  • selection.background#c8d8da1c
  • sideBar.background#323738
  • sideBar.foreground#cfd0d0
  • statusBar.background#24292a
  • statusBar.border#444849
  • statusBar.foreground#b7b9b9
  • statusBarItem.hoverBackground#24292a
  • statusBarItem.prominentHoverBackground#24292a
  • tab.border#00000000
  • tab.inactiveBackground#212627
  • terminal.ansiBlack#000000
  • terminal.ansiBlue#0083B2
  • terminal.ansiBrightBlack#777777
  • terminal.ansiBrightBlue#00a0d9
  • terminal.ansiBrightCyan#93c0ed
  • terminal.ansiBrightGreen#c4e2b9
  • terminal.ansiBrightMagenta#d8a6d6
  • terminal.ansiBrightRed#d46e69
  • terminal.ansiBrightWhite#FFFFFF
  • terminal.ansiBrightYellow#d6a96a
  • terminal.ansiCyan#71ADE7
  • terminal.ansiGreen#95cb82
  • terminal.ansiMagenta#CC8BC9
  • terminal.ansiRed#c7423b
  • terminal.ansiWhite#BBBBBB
  • terminal.ansiYellow#cd974b
  • terminal.foreground#8DAFB2
  • titleBar.activeBackground#323738
  • titleBar.inactiveBackground#323738
  • tree.indentGuidesStroke#6f7373

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
Chalice Color Themes by Artem Laman - VS Code Theme