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#0a0a0a
  • activityBar.dropBackground#399ef480
  • debugToolBar.background#0b121c
  • dropdown.background#222222
  • editor.background#0f0f0f
  • editor.findMatchBackground#ff777780
  • editor.foreground#efefef
  • editor.inactiveSelectionBackground#3a3d41
  • editor.lineHighlightBackground#3d3d3d55
  • editor.selectionBackground#0088ff3a
  • editor.selectionHighlightBackground#3a3d4150
  • editorCursor.foreground#f8f8f0
  • editorGroup.dropBackground#399ef480
  • editorGroupHeader.tabsBackground#399df40c
  • editorIndentGuide.background#263040
  • editorLineNumber.foreground#ffffffaa
  • editorWhitespace.foreground#263040
  • editorWidget.background#111111
  • foreground#efefef
  • input.background#1a1a1a
  • list.dropBackground#399ef480
  • list.focusBackground#399ef480
  • list.hoverBackground#ffffff1a
  • list.inactiveSelectionBackground#202020
  • panel.background#0a0a0a
  • panel.border#00000000
  • panelTitle.activeBorder#efefef80
  • panelTitle.inactiveForeground#efefef80
  • peekViewEditor.background#060a10
  • peekViewResult.background#090f18
  • peekViewTitle.background#080d14
  • pickerGroup.border#ffffff1a
  • scrollbar.shadow#000000
  • scrollbarSlider.background#0000003f
  • sideBar.background#0d0d0d
  • sideBar.foreground#bebebe
  • sideBarSectionHeader.background#0a0a0a
  • sideBarTitle.foreground#ffffff
  • statusBar.debuggingBackground#da6771
  • tab.border#00000000
  • tab.inactiveBackground#0a0a0a
  • terminal.ansiBlack#666666
  • terminal.ansiBrightBlack#666666
  • terminal.ansiBrightBlue#399ef4
  • terminal.ansiBrightCyan#21c5c7
  • terminal.ansiBrightGreen#4eb071
  • terminal.ansiBrightMagenta#b168df
  • terminal.ansiBrightRed#da6771
  • terminal.ansiBrightWhite#efefef
  • terminal.ansiBrightYellow#fff099
  • terminal.ansiCyan#21c5c7
  • terminal.ansiGreen#4eb071
  • terminal.ansiMagenta#b168df
  • terminal.ansiRed#da6771
  • terminal.ansiWhite#efefef
  • terminal.ansiYellow#fff099
  • terminal.border#1f1f1f
  • titleBar.activeBackground#0a0a0a
  • widget.shadow#000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
—#efefefff—
comment#414d62—
string#64aeb3—
constant.numeric#64aeb3—
constant.language#52708b—
constant.character, constant.other#52708b—
variable—
keyword#508aaa—
storage#52708b
storage.type#6AB0A3
entity.name.class#52708bunderline
entity.other.inherited-class#52708bitalic underline
entity.name.function#508aaa
variable.parameter#ffffffitalic
entity.name.tag#6AB0A3
entity.other.attribute-name#52708b
support.function#6AB0A3
support.constant#52708b
support.type, support.class#52708bitalic
support.other.variable—
invalid#f8f8f0
invalid.deprecated#f8f8f0—
meta.structure.dictionary.json string.quoted.double.json#64aeb3—
meta.diff, meta.diff.header#75715E—
markup.deleted#00A8C6—
markup.inserted#A6E22E—
markup.changed#E6DB74—
constant.numeric.line-number.find-in-files - match#8FBE00A0—
entity.name.filename.find-in-files#E6DB74—
keyword.other#5c6b86—
meta.property-value, support.constant.property-value, constant.other.color#64aeb3—
meta.structure.dictionary.json string.quoted.double.json#52708b—
meta.structure.dictionary.value.json string.quoted.double.json#64aeb3—
meta.property-name support.type.property-name—normal
meta.property-value punctuation.separator.key-value#ffffff—
keyword.other.use, keyword.other.function.use, keyword.other.namespace, keyword.other.new, keyword.other.special-method, keyword.other.unit, keyword.other.use-as#6AB0A3—
meta.use support.class.builtin, meta.other.inherited-class support.class.builtin#ffffffnormal
variable.other#ffffffnormal
variable.parameter.function.coffee#64aeb3italic
entity.name.section.markdown#52708b—
punctuation.definition.heading.markdown#508aaa—
markup.raw.inline.markdown#64aeb3—
punctuation.definition.bold.markdown, punctuation.definition.italic.markdown#508aaa—
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown#508aaa—
punctuation.definition.metadata.markdown#508aaa—
markup.underline.link.markdown, markup.underline.link.image.markdown, meta.image.inline.markdown#6AB0A3italic
markup.bold.markdown, markup.italic.markdown#6AB0A3—
markup.italic.markdown—italic
markup.bold.markdown—bold
markup.raw.block.markdown#00a8c6—
markup.deleted.git_gutter#e61f44—
markup.inserted.git_gutter#a7da1e—
markup.changed.git_gutter#f7b83d—
entity.other.attribute-name.class.css#508aaa—
token.info-token#6796e6—
token.warn-token#cd9731—
token.error-token#f44747—
token.debug-token#b267e6—
comment#414d62—
string#64aeb3—
constant.numeric#64aeb3—
constant.language#52708b—
constant.character, constant.other#52708b—
variable—
keyword#508aaa—
storage#52708b
storage.type#6AB0A3
entity.name.class#52708bunderline
entity.other.inherited-class#52708bitalic underline
entity.name.function#508aaa
variable.parameter#ffffff
entity.name.tag#6AB0A3
entity.other.attribute-name#52708b
support.function#6AB0A3
support.constant#52708b
support.type, support.class#52708b
support.other.variable—
invalid#f8f8f0
invalid.deprecated#f8f8f0—
meta.structure.dictionary.json string.quoted.double.json#64aeb3—
meta.diff, meta.diff.header#75715E—
markup.deleted#00A8C6—
markup.inserted#A6E22E—
markup.changed#E6DB74—
constant.numeric.line-number.find-in-files - match#8FBE00A0—
entity.name.filename.find-in-files#E6DB74—
keyword.other#5c6b86—
meta.property-value, support.constant.property-value, constant.other.color#64aeb3—
meta.structure.dictionary.json string.quoted.double.json#52708b—
meta.structure.dictionary.value.json string.quoted.double.json#64aeb3—
meta.property-name support.type.property-name—normal
meta.property-value punctuation.separator.key-value#ffffff—
keyword.other.use, keyword.other.function.use, keyword.other.namespace, keyword.other.new, keyword.other.special-method, keyword.other.unit, keyword.other.use-as#6AB0A3—
meta.use support.class.builtin, meta.other.inherited-class support.class.builtin#ffffffnormal
variable.other#ffffffnormal
variable.parameter.function.coffee#64aeb3
entity.name.section.markdown#52708b—
punctuation.definition.heading.markdown#508aaa—
markup.raw.inline.markdown#64aeb3—
punctuation.definition.bold.markdown, punctuation.definition.italic.markdown#508aaa—
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown#508aaa—
punctuation.definition.metadata.markdown#508aaa—
markup.underline.link.markdown, markup.underline.link.image.markdown, meta.image.inline.markdown#6AB0A3
markup.bold.markdown, markup.italic.markdown#6AB0A3—
markup.italic.markdown—
markup.bold.markdown—bold
markup.raw.block.markdown#00a8c6—
markup.deleted.git_gutter#e61f44—
markup.inserted.git_gutter#a7da1e—
markup.changed.git_gutter#f7b83d—
entity.other.attribute-name.class.css#508aaa—
token.info-token#6796e6—
token.warn-token#cd9731—
token.error-token#f44747—
token.debug-token#b267e6—