Skip to main content
Coding Theme

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#191c25
  • activityBar.border#191c25
  • activityBar.foreground#b5b4c9
  • activityBarBadge.background#2e313d
  • activityBarBadge.foreground#b5b4c9
  • button.background#3c3f4e
  • button.foreground#b5b4c9
  • checkbox.background#272935
  • checkbox.foreground#b5b4c9
  • diffEditor.insertedTextBackground#1c231688
  • diffEditor.removedTextBackground#2d1d1688
  • dropdown.background#272935
  • dropdown.border#191c25
  • dropdown.foreground#b5b4c9
  • editor.background#191c25
  • editor.findMatchBackground#ea5c0055
  • editor.findMatchHighlightBackground#2e313d55
  • editor.foreground#b5b4c9
  • editor.lineHighlightBackground#20222d
  • editor.selectionBackground#5b5f7144
  • editor.selectionHighlightBackground#2e313d
  • editor.wordHighlightBackground#27293555
  • editorError.foreground#cf8164
  • editorGroupHeader.tabsBackground#191c25
  • editorGroupHeader.tabsBorder#20222d
  • editorGutter.addedBackground#76a065
  • editorGutter.deletedBackground#cf8164
  • editorGutter.modifiedBackground#8296b0
  • editorInfo.foreground#8296b0
  • editorLineNumber.activeForeground#6c6f82
  • editorLineNumber.foreground#3c3f4e
  • editorOverviewRuler.border#191c25
  • editorUnnecessaryCode.opacity#000000c0
  • editorWarning.foreground#ab924c
  • errorForeground#cf8164
  • errorLens.errorBackground#2d1d1655
  • errorLens.errorForeground#cf8164
  • errorLens.hintBackground#1c231655
  • errorLens.hintForeground#76a065
  • errorLens.infoBackground#1c231655
  • errorLens.infoForeground#76a065
  • errorLens.warningBackground#26201155
  • errorLens.warningForeground#ab924c
  • focusBorder#2e313d
  • foreground#b5b4c9
  • gitDecoration.addedResourceForeground#76a065
  • gitDecoration.conflictingResourceForeground#a18daf
  • gitDecoration.deletedResourceForeground#cf8164
  • gitDecoration.ignoredResourceForeground#5b5f71
  • gitDecoration.modifiedResourceForeground#8296b0
  • gitDecoration.untrackedResourceForeground#ab924c
  • icon.foreground#b5b4c9
  • input.background#272935
  • input.foreground#b5b4c9
  • list.errorForeground#cf8164
  • list.focusOutline#0000
  • merge.commonContentBackground#2e313d22
  • merge.commonHeaderBackground#2e313d55
  • merge.currentContentBackground#76a06522
  • merge.currentHeaderBackground#76a06555
  • merge.incomingContentBackground#8296b022
  • merge.incomingHeaderBackground#8296b055
  • panelTitle.activeForeground#b5b4c9
  • problemsErrorIcon.foreground#cf8164
  • problemsInfoIcon.foreground#8296b0
  • problemsWarningIcon.foreground#ab924c
  • selection.background#6c6f82
  • sideBar.background#191c25
  • sideBar.border#20222d
  • sideBar.foreground#b5b4c9
  • sideBarSectionHeader.background#272935
  • sideBarSectionHeader.foreground#b5b4c9
  • sideBarTitle.foreground#b5b4c9
  • statusBar.background#272935
  • statusBar.debuggingBackground#1c2316
  • statusBar.foreground#b5b4c9
  • statusBar.noFolderBackground#2d1d16
  • symbolIcon.classForeground#ab924c
  • symbolIcon.constantForeground#76a065
  • symbolIcon.constructorForeground#c6aed7
  • symbolIcon.enumeratorForeground#ab924c
  • symbolIcon.enumeratorMemberForeground#a0b9d8
  • symbolIcon.fieldForeground#8296b0
  • symbolIcon.functionForeground#a18daf
  • symbolIcon.interfaceForeground#659ea2
  • symbolIcon.keyForeground#76a065
  • symbolIcon.methodForeground#a18daf
  • symbolIcon.moduleForeground#6c6f82
  • symbolIcon.objectForeground#6c6f82
  • symbolIcon.operatorForeground#6c6f82
  • symbolIcon.propertyForeground#a0b9d8
  • symbolIcon.stringForeground#76a065
  • symbolIcon.structForeground#6c6f82
  • symbolIcon.variableForeground#a0b9d8
  • tab.activeBackground#272935
  • tab.activeForeground#b5b4c9
  • tab.activeModifiedBorder#8296b0
  • tab.border#20222d
  • tab.inactiveBackground#191c25
  • terminal.ansiBlack#2e313d
  • terminal.ansiBlue#8296b0
  • terminal.ansiBrightBlack#5b5f71
  • terminal.ansiBrightBlue#a0b9d8
  • terminal.ansiBrightCyan#7dc2c7
  • terminal.ansiBrightGreen#92c47e
  • terminal.ansiBrightMagenta#c6aed7
  • terminal.ansiBrightRed#fe9f7c
  • terminal.ansiBrightWhite#f0ecfe
  • terminal.ansiBrightYellow#d2b45f
  • terminal.ansiCyan#659ea2
  • terminal.ansiGreen#76a065
  • terminal.ansiMagenta#a18daf
  • terminal.ansiRed#cf8164
  • terminal.ansiWhite#b5b4c9
  • terminal.ansiYellow#ab924c
  • terminal.background#191c25
  • terminal.foreground#b5b4c9
  • titleBar.activeBackground#191c25
  • titleBar.inactiveBackground#191c25

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#5b5f71italic
variable, string constant.other.placeholder#b5b4c9
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#a0b9d8italic
meta.function-call.arguments
variable.language#a18dafitalic
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, constant.other.color, constant.other.rune#a18daf
string, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js, punctuation.definition.string, string.regexp#659ea2
constant.character.escape#7dc2c7
keyword, keyword.control, storage.modifier, storage.type#8296b0
storage.class, storage.type.core, entity.name.type, meta.type_params#a18daf
meta.attribute#6c6f82
punctuation, meta.tag, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, keyword.operator#6c6f82
entity.name.import#659ea2
entity.other.attribute-name, meta.object-literal.key, support.type.property-name, support.type.vendored.property-name, entity.name.tag.yaml#8296b0
*url*, *link*, *uri*underline
invalid, invalid.illegal#cf8164
support.orther.namespace.use.php, meta.use.php, support.other.namespace.php#c6aed7
entity.name.tag, meta.tag.sgml#a18daf
source.css entity.other.attribute-name#c6aed7
source.css entity.other.attribute-name.pseudo-class#659ea2
markup.boldbold
markup.italicitalic
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold stringbold italic
markup.inline.raw, markup.fenced_code.block, markup.raw.block#6c6f82
string.other.link.title.markdown, meta.link.inline punctuation.definition.string, markup.underline.link#8296b0
string.other.link.title.markdown#8296b0underline
Substrata by austinhyde - VS Code Theme