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#CBC0B2
  • activityBar.foreground#877B6E
  • activityBarBadge.background#D0C4B7
  • activityBarBadge.foreground#877B6E
  • button.background#877B6E
  • button.foreground#D6CABD
  • debugToolBar.background#D6CABD
  • dropdown.background#D6CABD
  • dropdown.foreground#877B6E
  • editor.background#DACFC1
  • editor.findMatchBackground#d6b997
  • editor.findMatchHighlightBackground#d6b99760
  • editor.findMatchHighlightForeground#D6CABDF0
  • editor.foreground#B9AD9F
  • editor.lineHighlightBorder#564A3C1a
  • editor.rangeHighlightBackground#A79C8E1a
  • editor.selectionBackground#d6b99760
  • editorError.foreground#c08b8b
  • editorGroup.dropBackground#877B6E80
  • editorGroup.focusedEmptyBorder#AEA395
  • editorGroupHeader.tabsBackground#D0C4B7
  • editorGutter.addedBackground#caa773
  • editorGutter.deletedBackground#caa773
  • editorGutter.modifiedBackground#caa773
  • editorHoverWidget.background#D6CABD
  • editorLineNumber.activeForeground#ADA193
  • editorLineNumber.foreground#877B6E4d
  • editorMarkerNavigation.background#D6CABD
  • editorWarning.foreground#c0bb8b
  • editorWidget.background#D6CABD
  • focusBorder#A09487
  • foreground#877B6E
  • gitDecoration.addedResourceForeground#caa773
  • gitDecoration.conflictingResourceForeground#9495aa
  • gitDecoration.deletedResourceForeground#c08b8b
  • gitDecoration.ignoredResourceForeground#C6BAAD
  • gitDecoration.modifiedResourceForeground#d6b997
  • gitDecoration.stageDeletedResourceForeground#c4a0a0
  • gitDecoration.stageModifiedResourceForeground#bab19a
  • gitDecoration.untrackedResourceForeground#caa773
  • input.background#D6CABD
  • input.foreground#877B6E
  • inputOption.activeBorder#D6CABD
  • list.activeSelectionBackground#EFE3D533
  • list.activeSelectionForeground#8A7F71
  • list.dropBackground#D6CABD
  • list.focusBackground#D6CABD80
  • list.focusOutline#564A3C1a
  • list.hoverBackground#EFE3D51a
  • list.inactiveSelectionBackground#EFE3D533
  • menu.selectionForeground#877B6E
  • notificationsErrorIcon.foreground#d6b997
  • notificationsInfoIcon.foreground#d6b997
  • notificationsWarningIcon.foreground#d6b997
  • panel.background#D6CABD
  • panel.border#AEA395
  • panelTitle.activeBorder#AEA395
  • panelTitle.activeForeground#AEA395
  • panelTitle.inactiveForeground#877B6E70
  • peekView.border#AEA395
  • peekViewEditor.background#D6CABD
  • peekViewEditor.matchHighlightBackground#caa773
  • peekViewResult.background#D6CABD
  • peekViewResult.matchHighlightBackground#caa773
  • peekViewResult.selectionBackground#caa773
  • peekViewTitle.background#D6CABD
  • pickerGroup.border#564A3C1a
  • progressBar.background#d6b997
  • selection.background#d6b99760
  • sideBar.background#D6CABD
  • sideBar.foreground#A89D8F
  • sideBarSectionHeader.background#CBC0B2
  • statusBar.background#D6CABD
  • statusBar.debuggingBackground#D6CABD
  • statusBar.foreground#877B6E
  • statusBar.noFolderBackground#D6CABD
  • statusBarItem.activeBackground#877B6E80
  • statusBarItem.hoverBackground#877B6E1a
  • tab.activeBackground#DACFC1
  • tab.activeBorder#d6b997
  • tab.activeForeground#877B6E
  • tab.border#EFE3D533
  • tab.inactiveBackground#D6CABDA0
  • tab.inactiveForeground#877B6E
  • terminal.border#d6b997
  • terminal.selectionBackground#d6b99760
  • textLink.foreground#d6b997
  • titleBar.activeBackground#D6CABD
  • titleBar.activeForeground#877B6E

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
Global settings#BFB3A5
string#d6b997
constant.language.false, constant.language.true#C8BCAE
constant.numeric#8E8275
variable, support.variable, support.class, support.constant, meta.definition.variable entity.name.function#B0A597
variable.parameter#C0B4A7
keyword, modifier, variable.language.this, support.type.object, constant.language#B7AC9E
entity.name.function, support.function#9D9184
storage.type, storage.modifier#C1B5A8
support.module, support.node#C5BAACitalic
support.type#A09487
entity.name.type, entity.other.inherited-class, storage.type.java, entity.name.type.class.java, support.type.primitive#d6b997
comment#C2B6A8
entity.name.type.class#9D9184
variable.object.property, meta.field.declaration entity.name.function#A09487
meta.definition.method entity.name.function#8E8275
meta.function entity.name.function#8E8275
template.expression.begin, template.expression.end, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end#B0A597
entity.name.scope-resolution, entity.name.namespace#A99D90
meta.embedded, source.groovy.embedded, meta.template.expression#C6BBAD
meta.object-literal.key, meta.object-literal.key string, support.type.property-name.json#A09487
constant.language.json#ABA092
entity.other.attribute-name.class#9D9184
entity.other.attribute-name.id#9D9184
source.css entity.name.tag#9D9184
meta.tag, punctuation.definition.tag#A09487
entity.name.tag#C5BAAC
entity.other.attribute-name#877B6E
markup.heading#A3978A
text.html.markdown meta.link.inline, meta.link.reference#A3978A
text.html.markdown beginning.punctuation.definition.list#A3978A
markup.italic#C5BAACitalic
markup.bold#C5BAACbold
markup.bold markup.italic, markup.italic markup.bold#C5BAACitalic bold
markup.fenced_code.block.markdown punctuation.definition.markdown#A3978A
markup.inline.raw.string.markdown#A3978A
keyword.other.definition.ini#A3978A
entity.name.section.group-title.ini#A3978A
source.cpp meta.preprocessor, keyword.control.directive#A09487
source.cpp meta.preprocessor.pragma.cpp#877B6E
keyword.other.unit.user-defined.cpp#A09487
source.cpp meta.preprocessor, entity.name.function.preprocessor.cpp#dfb5af
variable.other.property, variable.other.enummember#BCB0A2
storage.modifier.import.java#d6b997
support.type.property-name.toml#877B6E
support.type.property-name.table.toml#BDB2A4
variable.source.cmake#A59A8C
, storage.source.cmake#A59A8C
Global settings#C6BBAD