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#1c1d1a
  • activityBar.border#1f1f1f
  • activityBar.foreground#9b9b9b
  • activityBar.inactiveForeground#5f5f5f
  • activityBarBadge.background#FFD569
  • activityBarBadge.foreground#000000
  • debugConsole.infoForeground#29b8db
  • debugConsole.warningForeground#fda471
  • diffEditor.insertedLineBackground#5262426e
  • diffEditor.insertedTextBackground#39a13e25
  • diffEditor.removedLineBackground#ff666637
  • diffEditor.removedTextBackground#a1393925
  • diffEditorGutter.insertedLineBackground#5262426e
  • diffEditorGutter.removedLineBackground#ff666637
  • dropdown.foreground#afda85
  • editor.background#2d2b2e
  • editor.foreground#fcfcfa
  • editor.lineHighlightBackground#74747421
  • editorGroupHeader.tabsBackground#2d2b2e
  • editorGroupHeader.tabsBorder#3b3b3b
  • editorGutter.addedBackground#afda85
  • editorGutter.background#2d2b2e
  • editorGutter.deletedBackground#ff6666
  • editorGutter.modifiedBackground#FFD569
  • editorOverviewRuler.addedForeground#afda85
  • editorOverviewRuler.deletedForeground#ff6666c4
  • editorOverviewRuler.modifiedForeground#fda471
  • editorSuggestWidget.background#3b3b3b
  • editorWidget.background#3b3b3b
  • gitDecoration.addedResourceForeground#afda85
  • gitDecoration.modifiedResourceForeground#FFD569
  • gitDecoration.untrackedResourceForeground#fda471
  • list.activeSelectionBackground#fcd45e5d
  • list.activeSelectionForeground#ffffff
  • list.focusForeground#FFD569
  • list.focusOutline#383838
  • list.highlightForeground#FFD569
  • list.hoverBackground#3d3b3e
  • list.hoverForeground#FFD569
  • list.inactiveFocusBackground#464646
  • list.inactiveSelectionBackground#383838
  • list.inactiveSelectionForeground#FFD569
  • panel.background#3c3c3c
  • panel.border#3c3c3c
  • panelTitle.activeBorder#FFD569
  • panelTitle.activeForeground#FFD569
  • panelTitle.inactiveForeground#9b9b9b
  • sideBar.background#222224
  • sideBar.border#232323
  • sideBar.foreground#9b9b9b
  • sideBarSectionHeader.background#272727
  • sideBarTitle.foreground#5e5e5e
  • statusBar.background#2f2f2f
  • statusBar.debuggingBackground#ff6666c4
  • statusBar.debuggingForeground#f1f1f1
  • statusBar.foreground#acacac
  • statusBar.noFolderBackground#3b3b3b
  • statusBarItem.compactHoverBackground#FFD569
  • statusBarItem.hoverBackground#ab464680
  • statusBarItem.hoverForeground#fcfcfa
  • tab.activeBackground#2d2b2e
  • tab.activeBorder#ffd866
  • tab.activeForeground#ffd866
  • tab.inactiveBackground#2d2b2e
  • tab.inactiveForeground#b3b3b3
  • terminal.ansiBlack#000000
  • terminal.ansiBlue#fda471
  • terminal.ansiBrightBlack#666666
  • terminal.ansiBrightBlue#29b8db
  • terminal.ansiBrightCyan#29b8db
  • terminal.ansiBrightGreen#23d18b
  • terminal.ansiBrightMagenta#d670d6
  • terminal.ansiBrightRed#f14c4c
  • terminal.ansiBrightWhite#e5e5e5
  • terminal.ansiBrightYellow#f5f543
  • terminal.ansiCyan#11a8cd
  • terminal.ansiGreen#afda85
  • terminal.ansiMagenta#bc3fbc
  • terminal.ansiRed#cd3131
  • terminal.ansiWhite#e5e5e5
  • terminal.ansiYellow#FFD569
  • terminal.background#3c3c3c
  • terminal.border#888888
  • terminal.foreground#ebebeb
  • terminalCursor.background#000000
  • terminalCursor.foreground#ffffff
  • textLink.activeForeground#b3954a
  • textLink.foreground#FFD569
  • titleBar.activeBackground#292929

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, comment markup.underline.link, comment string, comment punctuation.definition, comment punctuation, comment text, punctuation.definition.comment#727072italic
comment keyword#fda471
comment storage.type #727072
storage.type#78dce8italic
comment entity.name.type #c1c0c0
constant.other.php#ab9df2
constant.character.escape.php#B287FF
constant.numeric#ab9df2
constant.language#ab9df2
entity.other.inherited-class#78dce8italic
entity.name.function#afda85
keyword.control#ff6666e0
keyword.operator#ff6666e0
punctuation#939293
punctuation.section.embedded, punctuation.section.embedded entity.name.tag, punctuation.section.embedded constant.other, punctuation.section.embedded source#fc9867
entity.name#afda85
storage.modifier#fa8282e0italic
string#ffd866
string source, support.other.namespace.php#fcfcfa
support.function#afda85
support.class#78dce8
variable, variable.other#fcfcfa
variable.language, variable.parameter.function.language.special.self.python#c1c0c0italic
keyword#ff6666e0
punctuation.definition.variable, punctuation.definition.keyword.scss, punctuation.definition.entity.css#c1c0c0
string constant.other.placeholder#EEFFFF
constant.other.color#ffffff
invalid, invalid.illegal#FF5370
constant.other.color, meta.tag, punctuation.definition.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, keyword.other.template, keyword.other.substitution#939293
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#f07178
meta.function-call, variable.function, keyword.other.special-method#ffffff
meta.block variable.other#fcfcfa
support.other.variable, string.other.link#f07178
support.constant, constant.character, constant.escape, variable.parameter#fda471italic
keyword.other.unit#f07178
constant.other.symbol, constant.other.key, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#C3E88D
support.type, support.orther.namespace.use.php, meta.use.php, markup.changed.git_gutter, support.type.sys-types#FFCB6B
support.type#78DCE8italic
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name#FCFCFA
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#FF5370
entity.name.method.js#82AAFFitalic
meta.class-method.js entity.name.function.js, variable.function.constructor#82AAFF
entity.other.attribute-name#afda85italic
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#afda85italic
entity.other.attribute-name.class#FFCB6B
source.sass keyword.control#82AAFF
markup.inserted#C3E88D
markup.deleted#FF5370
markup.changed#C792EA
string.regexp#89DDFF
constant.character.escape#ab9df2
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#82AAFFitalic
source.js constant.other.object.key.js string.unquoted.label.js#FF5370italic
source.json meta.structure.dictionary.json support.type.property-name.json#fcfcfa
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#fcfafa
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#fcfafa
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#fcfafa
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 meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#fcfafa
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 meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#fcfafa
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 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#fcfafa
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 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 meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#fcfafa
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 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 meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#fcfafa
text.html.markdown, punctuation.definition.list_item.markdown#EEFFFF
text.html.markdown markup.inline.raw.markdown#C792EA
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#65737E
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#C3E88D
markup.italic#f07178italic
markup.bold, markup.bold string#f07178bold
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 string#f07178bold
markup.underline#F78C6Cunderline
markup.quote punctuation.definition.blockquote.markdown#65737E
markup.quoteitalic
string.other.link.title.markdown#82AAFF
string.other.link.description.title.markdown#C792EA
constant.other.reference.link.markdown#FFCB6B
markup.raw.block#C792EA
markup.raw.block.fenced.markdown#00000050
punctuation.definition.fenced.markdown#00000050
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#EEFFFF
variable.language.fenced.markdown#65737E
meta.separator#65737Ebold
markup.table#EEFFFF
entity.name.variable.field.cs#fcfcfa
entity.name.type.namespace.cs#78dce8
entity.name.variable.parameter.cs#fcfcfa
keyword.type.cs#78dce8
storage.type.cs#78dce8
entity.name.variable.enum-member.cs#fcfcfa
storage.modifier.import.java#78dce8
string.quoted.other.lt-gt.include.c#78dce8
meta.function-call.c#fcfcfa
variable.parameter.function.language.python#fda471
meta.tag.js.jsx, meta.jsx.children.js.jsx#fcfcfa
keyword.other.DDL.create.II.sql#afda85
entity.name.section.markdown#ffd866italic bold
markup.heading.markdown punctuation.definition.heading.markdown#ff6666c4
meta.function-call.generic.python#afda85
meta.function-call.arguments.python#ffffff