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#000000
  • activityBar.foreground#36a3d9
  • activityBar.inactiveForeground#ffffff
  • activityBarBadge.background#ffffff
  • activityBarBadge.foreground#000000
  • badge.background#458588
  • button.background#d79921
  • button.foreground#f9f5d7
  • dropdown.background#1c1d26
  • editor.background#222222
  • editor.findMatchBackground#ffffff33
  • editor.findMatchBorder#f3652370
  • editor.findMatchHighlightBackground#ffffff55
  • editor.findMatchHighlightBorder#ffffff77
  • editor.findRangeHighlightBackground#ffffbe55
  • editor.foreground#f2e5bc
  • editor.inactiveSelectionBackground#ffffbe55
  • editor.lineHighlightBackground#000000
  • editor.selectionBackground#3499dda0
  • editor.selectionForeground#ffffff
  • editor.selectionHighlightBackground#ffffbe55
  • editor.selectionHighlightBorder#aaaaaa
  • editor.wordHighlightBackground#ffffbe55
  • editor.wordHighlightStrongBackground#ffffbe55
  • editorCursor.foreground#ffffff
  • editorGroupHeader.border#ffffff00
  • editorGroupHeader.tabsBackground#000000
  • editorGutter.addedBackground#00aa77
  • editorGutter.deletedBackground#cc1100
  • editorGutter.modifiedBackground#ffaa66
  • editorLineNumber.activeForeground#ff6d00
  • editorWidget.background#272836
  • extensionButton.prominentBackground#599442
  • focusBorder#ffffff33
  • foreground#f2e5bc
  • gitDecoration.addedResourceForeground#00aa77
  • gitDecoration.conflictingResourceForeground#f42c3e
  • gitDecoration.deletedResourceForeground#cc1100
  • gitDecoration.ignoredResourceForeground#8a8f8f
  • gitDecoration.modifiedResourceForeground#ffaa66
  • gitDecoration.untrackedResourceForeground#7ec16e
  • gitlens.decorations.addedForegroundColor#00aa77
  • gitlens.decorations.deletedForegroundColor#cc1100
  • gitlens.decorations.modifiedForegroundColor#ffaa66
  • input.background#00000022
  • input.border#ffffff11
  • list.activeSelectionBackground#1c1d26
  • list.focusBackground#1c1d26
  • list.highlightForeground#ee7700
  • list.hoverBackground#1c1d26
  • list.inactiveSelectionBackground#1c1d26
  • panel.background#00000000
  • peekView.border#ffffff33
  • peekViewEditor.background#21222d
  • peekViewResult.background#21222d
  • peekViewResult.selectionBackground#3e588c
  • quickInput.background#000000
  • quickInputList.focusBackground#0099ff
  • scrollbarSlider.background#f36523
  • sideBar.background#000000
  • sideBar.border#ffffff39
  • sideBar.foreground#fbf1c7
  • sideBarSectionHeader.background#00000000
  • sideBarSectionHeader.border#ffffff22
  • statusBar.background#222222
  • statusBar.border#aaa0
  • statusBar.debuggingBackground#222222
  • statusBar.foreground#f2e5bc
  • statusBar.noFolderBackground#222222
  • tab.activeBackground#222222
  • tab.activeBorderTop#f36523
  • tab.activeForeground#f36523
  • tab.inactiveBackground#000000
  • tab.inactiveForeground#aaaaaa
  • terminal.ansiBlack#1d2021
  • terminal.ansiBlue#458588
  • terminal.ansiBrightBlack#928374
  • terminal.ansiBrightBlue#99c6ca
  • terminal.ansiBrightCyan#7ec16e
  • terminal.ansiBrightGreen#b8bb26
  • terminal.ansiBrightMagenta#d3869b
  • terminal.ansiBrightRed#f42c3e
  • terminal.ansiBrightWhite#ebdbb2
  • terminal.ansiBrightYellow#fabd2f
  • terminal.ansiCyan#689d6a
  • terminal.ansiGreen#98971a
  • terminal.ansiMagenta#b16286
  • terminal.ansiRed#cc241d
  • terminal.ansiWhite#a89984
  • terminal.ansiYellow#d79921
  • terminal.background#00000000
  • terminal.foreground#ebdbb2
  • titleBar.activeBackground#000000
  • titleBar.activeForeground#f2e5bc

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
emphasis—italic
strong—bold
header#458588—
comment, punctuation.definition.comment#928374italic
constant, support.constant, variable.arguments#D3869B—
constant.rgb-value#EBDBB2—
entity.name.selector#8EC07C—
entity.other.attribute-name#FABD2Fitalic
entity.name.tag, punctuation.tag#8EC07C—
invalid, invalid.illegal#CC241D—
invalid.deprecated#B16286—
meta.selector#8EC07C—
meta.preprocessor#FE8019—
meta.preprocessor.string#B8BB26—
meta.preprocessor.numeric#B8BB26—
meta.header.diff#FE8019—
storage#FB4934—
storage.modifier#FE8019—
string#F7994C—
string.tag#8C7AE6—
string.value#8C7AE6—
string.regexp#FE8019—
string.escape#FB4934—
string.quasi#8EC07C—
string.entity#B8BB26—
object#EBDBB2—
module.node#83A598—
support.type.property-name#689D6A—
keyword#FB4934—
keyword.control#FB4934—
keyword.control.module#8EC07C—
keyword.control.less#D79921—
keyword.operator#8EC07C—
keyword.operator.new#FE8019—
keyword.other.unit#B8BB26—
metatag.php#FE8019—
support.function.git-rebase#689D6A—
constant.sha.git-rebase#B8BB26—
meta.type.name, meta.return.type, meta.return-type, meta.cast, meta.type.annotation, support.type, storage.type.cs, variable.class#FABD2F—
variable.this, support.variable#D3869B—
entity.name, entity.static, entity.name.class.static.function, entity.name.function, entity.name.class, entity.name.type#FABD2F—
storage.type.function, entity.function, entity.name.function.static#8EC07C—
entity.name.function.function-call#8EC07C—
support.function.builtin#FE8019—
entity.name.method, entity.name.method.function-call, entity.name.static.function-call#689D6A—
brace#D5C4A1—
meta.parameter.type.variable, variable.parameter, variable.name, variable.other, variable, string.constant.other.placeholder#99C6CA—
variable.parameter—italic
prototype#D3869B—
storage.type.class#FB4934—
punctuation#A89984—
punctuation.quoted#EBDBB2—
punctuation.quasi#FB4934—
*url*, *link*, *uri*—underline
meta.function.python, entity.name.function.python#8EC07C—
storage.type.function.python, storage.modifier.declaration, storage.type.class.python#FB4934—
meta.function-call.generic#83A598—
meta.function-call.arguments#D5C4A1—
entity.name.function.decorator#FABD2Fbold
constant.other.caps—bold
keyword.operator.logical#FB4934—
punctuation.definition.logical-expression#FE8019—
string.inperpolated.dollar.shell#FE8019—
string.interpolated.dollar.shell, string.interpolated.backtick.shell#8EC07C—
keyword.control.directive#8EC07C—
support.function.C99#FABD2F—
meta.scope.prerequisites#FABD2F—
entity.name.function.target#B8BB26bold
storage.modifier.import.java, storage.modifier.package.java#BDAE93—
keyword.other.import.java, keyword.other.package.java#8EC07C—
storage.type.java#FABD2F—
storage.type.annotation#83A598bold
keyword.other.documentation.javadoc#8EC07C—
comment.block.javadoc variable.parameter.java#B8BB26bold
source.java variable.other.object, source.java variable.other.definition.java#EBDBB2—
meta.function-parameters.lisp#FABD2F—
markup.underline—underline
string.other.link.title.markdown#928374underline
markup.underline.link#D3869B—
markup.bold#FE8019bold
markup.heading#FE8019bold
markup.italic—italic
markup.inserted#B8BB26—
markup.deleted#D65D0E—
markup.changed#FE8019—
markup.punctuation.quote.beginning#98971A—
markup.punctuation.list.beginning#83A598—
markup.inline.raw, markup.fenced_code.block#8EC07C—
string.quoted.double.json#83A598—
source.json meta.structure.dictionary.json support.type.property-name.json#B8BB26—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#8EC07C—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#D3869B—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#B8BB26—
entity.other.attribute-name.css#FE8019—
source.css meta.selector#EBDBB2—
support.type.property-name.css#FE8019—
entity.other.attribute-name.class#B8BB26—
source.css support.function.transform, source.css support.function.timing-function, source.css support.function.misc#FB4934—
support.property-value, constant.rgb-value, support.property-value.scss, constant.rgb-value.scss#D65D0E—
entity.name.tag.css—normal
punctuation.definition.tag#83A598—
text.html entity.name.tag, text.html punctuation.tag#8EC07Cbold
source.js variable.language#FE8019—
source.ts variable.language#FE8019—
source.go storage.type#FABD2F—
source.go entity.name.import#B8BB26—
source.go keyword.package, source.go keyword.import#8EC07C—
source.go keyword.interface, source.go keyword.struct#83A598—
source.go entity.name.type#EBDBB2—
source.go entity.name.function#D3869B—
keyword.control.cucumber.table#83A598—
source.reason string.double, source.reason string.regexp#B8BB26—
source.reason keyword.control.less#8EC07C—
source.reason entity.name.function#83A598—
source.reason support.property-value, source.reason entity.name.filename#FE8019—
source.powershell variable.other.member.powershell#FE8019—
source.powershell support.function.powershell#FABD2F—
source.powershell support.function.attribute.powershell#BDAE93—
source.powershell meta.hashtable.assignment.powershell variable.other.readwrite.powershell#FE8019—
token.info-token#6796E6—
token.warn-token#CD9731—
token.error-token#F44747—
token.debug-token#B267E6—
variable.other.property#D3869B—