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.activeBorder#FFFFFF
  • activityBar.background#007070
  • activityBar.border#FFFFFF
  • activityBar.dropBorder#FFFFFF
  • activityBar.foreground#FFFFFF
  • badge.background#252525
  • breadcrumb.background#252525
  • button.background#252525
  • button.hoverBackground#252525
  • checkbox.background#252525
  • checkbox.border#FFFFFF
  • contrastActiveBorder#FFFFFF
  • contrastBorder#FFFFFF
  • debugToolBar.border#FFFFFF
  • diffEditor.border#FFFFFF
  • dropdown.background#252525
  • dropdown.border#FFFFFF
  • editor.background#1D2951
  • editor.findMatchBorder#FFFFFF
  • editor.foldBackground#252525
  • editor.foreground#FFFFFF
  • editor.lineHighlightBackground#000080
  • editor.lineHighlightBorder#000035
  • editor.wordHighlightBorder#FFFFFF
  • editorBracketMatch.border#FFFFFF
  • editorCursor.foreground#FFFFFF
  • editorError.background#252525
  • editorError.border#FFFFFF
  • editorGroup.border#FFFFFF
  • editorGroupHeader.border#FFFFFF
  • editorHint.border#FFFFFF
  • editorHoverWidget.border#FFFFFF
  • editorInfo.background#252525
  • editorInfo.border#FFFFFF
  • editorLineNumber.foreground#858585
  • editorOverviewRuler.border#FFFFFF
  • editorPane.background#252525
  • editorSuggestWidget.border#FFFFFF
  • editorWarning.border#FFFFFF
  • editorWidget.border#FFFFFF
  • editorWidget.resizeBorder#FFFFFF
  • focusBorder#FFFFFF
  • imagePreview.border#FFFFFF
  • input.background#252525
  • input.border#FFFFFF
  • inputOption.activeBorder#FFFFFF
  • inputValidation.infoBorder#FFFFFF
  • list.dropBackground#252525
  • list.filterMatchBorder#FFFFFF
  • list.focusBackground#252525
  • list.hoverBackground#252525
  • menu.background#252525
  • menu.border#FFFFFF
  • menu.selectionBackground#252525
  • menu.selectionBorder#FFFFFF
  • menubar.selectionBorder#FFFFFF
  • merge.border#FFFFFF
  • minimap.background#252525
  • notebook.cellBorderColor#FFFFFF
  • notebook.focusedCellBorder#FFFFFF
  • notebook.focusedRowBorder#FFFFFF
  • notebook.selectedCellBorder#FFFFFF
  • notificationCenter.border#FFFFFF
  • notifications.border#FFFFFF
  • notificationToast.border#FFFFFF
  • panel.background#252525
  • panel.border#FFFFFF
  • panel.dropBorder#FFFFFF
  • panelInput.border#FFFFFF
  • panelSection.border#FFFFFF
  • panelSectionHeader.border#FFFFFF
  • panelTitle.activeBorder#FFFFFF
  • peekView.border#FFFFFF
  • pickerGroup.border#FFFFFF
  • progressBar.background#252525
  • quickInput.background#252525
  • sash.hoverBorder#FFFFFF
  • scm.providerBorder#FFFFFF
  • selection.background#555555A0
  • settings.checkboxBorder#FFFFFF
  • settings.dropdownBorder#FFFFFF
  • settings.numberInputBorder#FFFFFF
  • settings.textInputBorder#FFFFFF
  • sideBar.background#252525
  • sideBar.border#FFFFFF
  • sideBar.dropBackground#252525
  • sideBar.foreground#FFFFFF
  • sideBarSectionHeader.border#FFFFFF
  • statusBar.background#252525
  • statusBar.border#FFFFFF
  • statusBar.debuggingBorder#FFFFFF
  • statusBar.foreground#FFFFFF
  • statusBar.noFolderBorder#FFFFFF
  • tab.activeBackground#007070
  • tab.activeBorder#FFFFFF
  • tab.activeBorderTop#FFFFFF
  • tab.activeForeground#FFFFFF
  • tab.activeModifiedBorder#FFFFFF
  • tab.border#FFFFFF
  • tab.hoverBackground#007070
  • tab.hoverBorder#FFFFFF
  • tab.inactiveForeground#858585
  • tab.inactiveModifiedBorder#FFFFFF
  • tab.lastPinnedBorder#FFFFFF
  • tab.unfocusedActiveBorder#FFFFFF
  • tab.unfocusedActiveBorderTop#FFFFFF
  • tab.unfocusedHoverBorder#FFFFFF
  • terminal.background#252525
  • terminal.border#FFFFFF
  • terminal.foreground#00FF00
  • textBlockQuote.border#FFFFFF
  • titleBar.border#FFFFFF
  • welcomePage.background#252525
  • window.activeBorder#FFFFFF
  • window.inactiveBorder#FFFFFF

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6A737D
string#00FF00
keyword, storage.type#56B6C2
constant.numeric#D19A66
entity.name.function, support.function#61AFEF
variable#E06C75
constant.language#C678DD
entity.name.tag, entity.other.attribute-name#E5C07B