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#ADB6C2
  • activityBar.foreground#69727E
  • activityBarBadge.background#B2BBC7
  • activityBarBadge.foreground#69727E
  • button.background#69727E
  • button.foreground#B8C1CD
  • debugToolBar.background#B8C1CD
  • dropdown.background#B8C1CD
  • dropdown.foreground#69727E
  • editor.background#BCC5D1
  • editor.findMatchBackground#8ba2c0
  • editor.findMatchHighlightBackground#8ba2c060
  • editor.findMatchHighlightForeground#B8C1CDF0
  • editor.foreground#9BA4B0
  • editor.lineHighlightBorder#38414D1a
  • editor.rangeHighlightBackground#89929E1a
  • editor.selectionBackground#8ba2c060
  • editorError.foreground#c08b8b
  • editorGroup.dropBackground#69727E80
  • editorGroup.focusedEmptyBorder#909AA6
  • editorGroupHeader.tabsBackground#B2BBC7
  • editorGutter.addedBackground#7399ca
  • editorGutter.deletedBackground#7399ca
  • editorGutter.modifiedBackground#7399ca
  • editorHoverWidget.background#B8C1CD
  • editorLineNumber.activeForeground#8F98A4
  • editorLineNumber.foreground#69727E4d
  • editorMarkerNavigation.background#B8C1CD
  • editorWarning.foreground#c0bb8b
  • editorWidget.background#B8C1CD
  • focusBorder#828B97
  • foreground#69727E
  • gitDecoration.addedResourceForeground#7399ca
  • gitDecoration.conflictingResourceForeground#9495aa
  • gitDecoration.deletedResourceForeground#c08b8b
  • gitDecoration.ignoredResourceForeground#A8B1BD
  • gitDecoration.modifiedResourceForeground#8ba2c0
  • gitDecoration.stageDeletedResourceForeground#c4a0a0
  • gitDecoration.stageModifiedResourceForeground#bab19a
  • gitDecoration.untrackedResourceForeground#7399ca
  • input.background#B8C1CD
  • input.foreground#69727E
  • inputOption.activeBorder#B8C1CD
  • list.activeSelectionBackground#D1DAE633
  • list.activeSelectionForeground#6C7682
  • list.dropBackground#B8C1CD
  • list.focusBackground#B8C1CD80
  • list.focusOutline#38414D1a
  • list.hoverBackground#D1DAE61a
  • list.inactiveSelectionBackground#D1DAE633
  • menu.selectionForeground#69727E
  • notificationsErrorIcon.foreground#8ba2c0
  • notificationsInfoIcon.foreground#8ba2c0
  • notificationsWarningIcon.foreground#8ba2c0
  • panel.background#B8C1CD
  • panel.border#909AA6
  • panelTitle.activeBorder#909AA6
  • panelTitle.activeForeground#909AA6
  • panelTitle.inactiveForeground#69727E70
  • peekView.border#909AA6
  • peekViewEditor.background#B8C1CD
  • peekViewEditor.matchHighlightBackground#7399ca
  • peekViewResult.background#B8C1CD
  • peekViewResult.matchHighlightBackground#7399ca
  • peekViewResult.selectionBackground#7399ca
  • peekViewTitle.background#B8C1CD
  • pickerGroup.border#38414D1a
  • progressBar.background#7399ca
  • selection.background#8ba2c060
  • sideBar.background#B8C1CD
  • sideBar.foreground#8A94A0
  • sideBarSectionHeader.background#ADB6C2
  • statusBar.background#B8C1CD
  • statusBar.debuggingBackground#B8C1CD
  • statusBar.foreground#69727E
  • statusBar.noFolderBackground#B8C1CD
  • statusBarItem.activeBackground#69727E80
  • statusBarItem.hoverBackground#69727E1a
  • tab.activeBackground#BCC5D1
  • tab.activeBorder#7399ca
  • tab.activeForeground#69727E
  • tab.border#D1DAE633
  • tab.inactiveBackground#B8C1CDA0
  • tab.inactiveForeground#69727E
  • terminal.border#7399ca
  • terminal.selectionBackground#8ba2c060
  • textLink.foreground#8ba2c0
  • titleBar.activeBackground#B8C1CD
  • titleBar.activeForeground#69727E

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
Global settings#A1AAB6—
string#8ba2c0—
constant.language.false, constant.language.true#AAB3BF—
constant.numeric#707985—
variable, support.variable, support.class, support.constant, meta.definition.variable entity.name.function#929BA7—
variable.parameter#A2ABB7—
keyword, modifier, variable.language.this, support.type.object, constant.language#99A3AF—
entity.name.function, support.function#7F8894—
storage.type, storage.modifier#A3ACB8—
support.module, support.node#A7B0BCitalic
support.type#828B97—
entity.name.type, entity.other.inherited-class, storage.type.java, entity.name.type.class.java, support.type.primitive#8ba2c0—
comment#A4ADB9—
entity.name.type.class#7F8894—
variable.object.property, meta.field.declaration entity.name.function#828B97—
meta.definition.method entity.name.function#707985—
meta.function entity.name.function#707985—
template.expression.begin, template.expression.end, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end#929BA7—
entity.name.scope-resolution, entity.name.namespace#8B94A0—
meta.embedded, source.groovy.embedded, meta.template.expression#A8B2BE—
meta.object-literal.key, meta.object-literal.key string, support.type.property-name.json#828B97—
constant.language.json#8D97A3—
entity.other.attribute-name.class#7F8894—
entity.other.attribute-name.id#7F8894—
source.css entity.name.tag#7F8894—
meta.tag, punctuation.definition.tag#828B97—
entity.name.tag#A7B0BC—
entity.other.attribute-name#69727E—
markup.heading#858E9A—
text.html.markdown meta.link.inline, meta.link.reference#858E9A—
text.html.markdown beginning.punctuation.definition.list#858E9A—
markup.italic#A7B0BCitalic
markup.bold#A7B0BCbold
markup.bold markup.italic, markup.italic markup.bold#A7B0BCitalic bold
markup.fenced_code.block.markdown punctuation.definition.markdown#858E9A—
markup.inline.raw.string.markdown#858E9A—
keyword.other.definition.ini#858E9A—
entity.name.section.group-title.ini#858E9A—
source.cpp meta.preprocessor, keyword.control.directive#828B97—
source.cpp meta.preprocessor.pragma.cpp#69727E—
keyword.other.unit.user-defined.cpp#828B97—
source.cpp meta.preprocessor, entity.name.function.preprocessor.cpp#8bbac0—
variable.other.property, variable.other.enummember#9EA7B3—
storage.modifier.import.java#8ba2c0—
support.type.property-name.toml#69727E—
support.type.property-name.table.toml#9FA9B5—
variable.source.cmake#87919D—
, storage.source.cmake#87919D—
Global settings#A8B2BE—