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#2e2e2e
  • activityBar.foreground#fcfcfc
  • button.background#00000070
  • button.foreground#fcfcfc
  • button.hoverBackground#000
  • button.secondaryBackground#00000070
  • button.secondaryHoverBackground#000
  • editor.background#2e2e2e
  • editor.findMatchBackground#ff0000
  • editor.findMatchHighlightBackground#0000ff
  • editor.foreground#bababa
  • editor.lineHighlightBackground#494949
  • editor.selectionBackground#000000
  • editor.selectionHighlightBackground#00000070
  • editorBracketMatch.border#ffff00
  • editorCursor.foreground#9c9c9c
  • editorGroup.border#9c9c9c
  • editorGroupHeader.tabsBackground#2e2e2e
  • editorIndentGuide.activeBackground#fcfcfc
  • editorIndentGuide.background#5c5c5c
  • editorLineNumber.foreground#9c9c9c
  • editorWidget.border#ff0000
  • input.border#ff0000
  • list.activeSelectionBackground#000
  • list.hoverBackground#494949
  • list.inactiveSelectionBackground#000
  • minimap.background#424242
  • minimapSlider.activeBackground#00000070
  • minimapSlider.background#00000050
  • minimapSlider.hoverBackground#00000070
  • sideBar.background#2e2e2e
  • sideBarSectionHeader.background#424242
  • statusBar.background#424242
  • statusBar.foreground#fcfcfc
  • statusBar.noFolderBackground#424242
  • statusBarItem.hoverBackground#000
  • tab.activeBackground#2e2e2e
  • tab.border#424242
  • tab.inactiveBackground#424242
  • titleBar.activeBackground#424242
  • titleBar.activeForeground#fcfcfc
  • tree.indentGuidesStroke#9c9c9c

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#6fcd7d
string#e57569
keyword#81D0F0
keyword.operator#fff
storage#81D0F0
storage.modifier.import, storage.modifier.package#fff
support.function#81D0F0
variable.parameter#e06c75
constant.numeric#6fcd7d
constant.language#e88501
constant.other#e88501italic
text.html.basic meta.tag.sgml.html punctuation.definition.tag.html, text.html.basic meta.tag.sgml.html meta.tag.sgml.doctype.html, text.html.basic meta.tag.sgml.html meta.tag.sgml.doctype.html string.quoted.double.doctype.identifiers-and-DTDs.html#fff
text.html.basic constant.character.entity.html, text.xml constant.character.entity.xml#e88501
entity.name.tag#81D0F0
punctuation.definition.tag.begin, punctuation.definition.tag.end, punctuation.definition.tag.html#81D0F0
entity.other.attribute-name#6fcd7d
meta.selector.css entity.name.tag.css, meta.selector.css entity.other.attribute-name.class.css, meta.selector.css entity.other.attribute-name.id.css, meta.selector.css meta.attribute-selector.css entity.other.attribute-name.attribute.css, meta.selector.css meta.attribute-selector.css string.unquoted.attribute-value.css#81D0F0
meta.selector.css meta.attribute-selector.css punctuation.separator.operator.css#fff
meta.selector.css entity.other.attribute-name.pseudo-class.css, meta.selector.css entity.other.attribute-name.pseudo-element.css#fff
keyword.control.at-rule, meta.at-rule support.type.property-name#e3c745
meta.at-rule support.constant#6fcd7d
meta.at-rule keyword.operator#81D0F0
meta.property-name.css support.type.property-name.css#e3c745
meta.property-value.css#fff
meta.property-value.css support.constant, meta.property-value.css support.function, meta.property-value.css variable.parameter.misc.css, meta.property-value.css constant.other.color.rgb-value.css#e88501
meta.property-value.css constant.numeric.css, meta.property-value.css constant.numeric.css keyword.other.unit.css, meta.at-rule constant.numeric.css keyword.other.unit.css#6fcd7d
meta.property-value.css support.constant.color.w3c-standard-color-name.css#81D0F0
punctuation.separator.key-value.css, punctuation.terminator.rule.css, punctuation.section.property-list.css#fff
variable.language.js, storage.type.js, storage.type.function.js, meta.function.json.js storage.type.function.js, meta.class.instance.constructor, keyword.operator.new keyword.operator.new.js#81D0F0
support.function.js, support.function.ts, support.function.dom.js, support.constant.js, entity.name.function.js, entity.name.function.ts, meta.function.json.js variable.parameter.function.js#e3c745
text.xml meta.tag.preprocessor.xml punctuation.definition.tag.begin.xml, text.xml meta.tag.preprocessor.xml entity.name.tag.xml, text.xml meta.tag.preprocessor.xml entity.other.attribute-name.xml, text.xml meta.tag.preprocessor.xml string.quoted.double.xml, text.xml meta.tag.sgml.doctype.xml punctuation.definition.tag.begin.xml, text.xml meta.tag.sgml.doctype.xml keyword.doctype.xml#fff
text.tex.latex constant, text.tex.latex constant.other#81D0F0
text.tex.latex string.other.math#6fcd7d
text.tex.latex string.other.math punctuation.section.group.tex, text.tex.latex string.other.math punctuation.definition.arguments#fff
text.tex.latex meta.function.section.latex entity.name.section.latex#e3c745
text.tex.latex variable.parameter.function.latex#e88501italic
text.tex.latex constant.other.reference#e88501
text.tex.latex meta.preamble.latex support.class.latex#6fcd7d
source.c++ meta.preprocessor#81D0F0
sublimelinter.mark.error#D02000
sublimelinter.gutter-mark#FFFFFF
sublimelinter.mark.warning#DDB700
markup.deleted.git_gutter#F92672
markup.inserted.git_gutter#A6E22E
markup.changed.git_gutter#967EFB
markup.ignored.git_gutter#565656
markup.untracked.git_gutter#565656
punctuation.definition.template-expression.begin.js, punctuation.definition.template-expression.end.js, punctuation.definition.template-expression.begin.ts, punctuation.definition.template-expression.end.ts#81D0F0
meta.template.expression.js, meta.template.expression.ts#000000
support.module.node.js, support.type.object.module.js, support.module.node.js#000000
var.this, variable.language.this.js, variable.language.this.ts, variable.language.this.jsx, variable.language.this.tsx#4671bb
function.parameter#e06c75
function.parameter#e06c75
keyword.oper#e06c75
keyword.operator.expression.delete, keyword.operator.expression.in, keyword.operator.expression.of, keyword.operator.expression.instanceof, keyword.operator.new, keyword.operator.expression.typeof, keyword.operator.expression.void#81D0F0
support.type.property-name.json#81D0F0
keyword.operator.expression.import#81D0F0
entity.name.type.namespace#5978f3
entity.name.type#e3c745
support.type.primitive.ts,support.type.builtin.ts,support.type.primitive.tsx,support.type.builtin.tsx#42567b
isJDongYa Dark Theme by isJDongYa - VS Code Theme