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#e0e0e0
  • activityBar.foreground#525252
  • activityBarBadge.background#cccccc
  • activityBarBadge.foreground#525252
  • button.background#313131
  • button.foreground#e4e4e4
  • debugToolBar.background#e4e4e4
  • dropdown.background#e4e4e4
  • dropdown.foreground#525252
  • editor.background#ebebeb
  • editor.findMatchBackground#aaaaaa
  • editor.findMatchHighlightBackground#aaaaaa60
  • editor.findMatchHighlightForeground#e4e4e4F0
  • editor.foreground#a5a5a5
  • editor.lineHighlightBorder#0000001a
  • editor.rangeHighlightBackground#8888881a
  • editor.selectionBackground#d3d3d360
  • editorError.foreground#d1d1d1
  • editorGroup.dropBackground#9b9b9b80
  • editorGroup.focusedEmptyBorder#949494
  • editorGroupHeader.tabsBackground#e7e7e7
  • editorGutter.addedBackground#d1d1d1
  • editorGutter.deletedBackground#d1d1d1
  • editorGutter.modifiedBackground#d1d1d1
  • editorHoverWidget.background#e4e4e4
  • editorLineNumber.activeForeground#919191
  • editorLineNumber.foreground#5252524d
  • editorMarkerNavigation.background#e4e4e4
  • editorWarning.foreground#d1d1d1
  • editorWidget.background#e4e4e4
  • focusBorder#7c7c7c
  • foreground#525252
  • gitDecoration.addedResourceForeground#d1d1d1
  • gitDecoration.conflictingResourceForeground#d1d1d1
  • gitDecoration.deletedResourceForeground#d1d1d1
  • gitDecoration.ignoredResourceForeground#bbbbbb
  • gitDecoration.modifiedResourceForeground#aaaaaa
  • gitDecoration.stageDeletedResourceForeground#d1d1d1
  • gitDecoration.stageModifiedResourceForeground#d1d1d1
  • gitDecoration.untrackedResourceForeground#d1d1d1
  • input.background#e4e4e4
  • input.foreground#525252
  • inputOption.activeBorder#e4e4e4
  • list.activeSelectionBackground#ffffff33
  • list.activeSelectionForeground#d1d1d1
  • list.dropBackground#e4e4e4
  • list.errorForeground#000000
  • list.focusBackground#e4e4e480
  • list.focusOutline#0000001a
  • list.hoverBackground#ffffff1a
  • list.inactiveSelectionBackground#ffffff33
  • menu.selectionForeground#525252
  • notificationsErrorIcon.foreground#aaaaaa
  • notificationsInfoIcon.foreground#aaaaaa
  • notificationsWarningIcon.foreground#aaaaaa
  • panel.background#e4e4e4
  • panel.border#949494
  • panelTitle.activeBorder#949494
  • panelTitle.activeForeground#949494
  • panelTitle.inactiveForeground#52525270
  • peekView.border#949494
  • peekViewEditor.background#e4e4e4
  • peekViewEditor.matchHighlightBackground#d1d1d1
  • peekViewResult.background#e4e4e4
  • peekViewResult.matchHighlightBackground#d1d1d1
  • peekViewResult.selectionBackground#d1d1d1
  • peekViewTitle.background#e4e4e4
  • pickerGroup.border#0000001a
  • progressBar.background#d1d1d1
  • selection.background#aaaaaa60
  • sideBar.background#e4e4e4
  • sideBar.foreground#8a8a8a
  • sideBarSectionHeader.background#e0e0e0
  • statusBar.background#e4e4e4
  • statusBar.debuggingBackground#e4e4e4
  • statusBar.foreground#525252
  • statusBar.noFolderBackground#e4e4e4
  • statusBarItem.activeBackground#52525280
  • statusBarItem.hoverBackground#5252521a
  • tab.activeBackground#ebebeb
  • tab.activeBorder#d1d1d1
  • tab.activeForeground#525252
  • tab.border#ffffff33
  • tab.inactiveBackground#e4e4e4A0
  • tab.inactiveForeground#525252
  • terminal.border#d1d1d1
  • terminal.selectionBackground#dadada60
  • textLink.foreground#aaaaaa
  • titleBar.activeBackground#e4e4e4
  • titleBar.activeForeground#525252

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
Global settings#afafaf—
string#aaaaaa—
constant.language.false, constant.language.true#bebebe—
constant.numeric#5e5e5e—
variable, support.variable, support.class, support.constant, meta.definition.variable entity.name.function#979797—
variable.parameter#b1b1b1—
keyword, modifier, variable.language.this, support.type.object, constant.language#a3a3a3—
entity.name.function, support.function#777777—
storage.type, storage.modifier#b3b3b3—
support.module, support.node#bababaitalic
support.type#7c7c7c—
entity.name.type, entity.other.inherited-class, storage.type.java, entity.name.type.class.java, support.type.primitive#aaaaaa—
comment#b4b4b4—
entity.name.type.class#777777—
variable.object.property, meta.field.declaration entity.name.function#7c7c7c—
meta.definition.method entity.name.function#5e5e5e—
meta.function entity.name.function#5e5e5e—
template.expression.begin, template.expression.end, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end#979797—
entity.name.scope-resolution, entity.name.namespace#8b8b8b—
meta.embedded, source.groovy.embedded, meta.template.expression#bcbcbc—
meta.object-literal.key, meta.object-literal.key string, support.type.property-name.json#7c7c7c—
constant.language.json#8f8f8f—
entity.other.attribute-name.class#777777—
entity.other.attribute-name.id#777777—
source.css entity.name.tag#777777—
meta.tag, punctuation.definition.tag#7c7c7c—
entity.name.tag#bababa—
entity.other.attribute-name#525252—
markup.heading#818181—
text.html.markdown meta.link.inline, meta.link.reference#818181—
text.html.markdown beginning.punctuation.definition.list#818181—
markup.italic#bababaitalic
markup.bold#babababold
markup.bold markup.italic, markup.italic markup.bold#bababaitalic bold
markup.fenced_code.block.markdown punctuation.definition.markdown#818181—
markup.inline.raw.string.markdown#818181—
keyword.other.definition.ini#818181—
entity.name.section.group-title.ini#818181—
source.cpp meta.preprocessor, keyword.control.directive#7c7c7c—
source.cpp meta.preprocessor.pragma.cpp#525252—
keyword.other.unit.user-defined.cpp#7c7c7c—
source.cpp meta.preprocessor, entity.name.function.preprocessor.cpp#666666—
variable.other.property, variable.other.enummember#aaaaaa—
storage.modifier.import.java#aaaaaa—
support.type.property-name.toml#525252—
support.type.property-name.table.toml#adadad—
variable.source.cmake#858585—
, storage.source.cmake#858585—
Global settings#bcbcbc—