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.

  • badge.background#cc3300
  • badge.foreground#EBEBEB
  • button.background#cc3300
  • button.foreground#EBEBEB
  • editor.background#040404
  • editor.foreground#EBEBEB
  • editor.hoverHighlightBackground#6dfae540
  • editor.lineHighlightBackground#FFFFFF11
  • editor.selectionBackground#6dfae540
  • editor.wordHighlightBackground#6dfae540
  • editor.wordHighlightStrongBackground#fcaf2122
  • editorBracketMatch.background#fa5e2a44
  • editorBracketMatch.border#fcaf21
  • editorCursor.foreground#EBEBEB
  • editorGroupHeader.tabsBackground#080808
  • editorIndentGuide.background#1a1a1a
  • editorLineNumber.foreground#444444
  • editorLink.activeForeground#fa5e2a
  • editorRuler.foreground#1a1a1a
  • editorSuggestWidget.foreground#EBEBEB
  • editorSuggestWidget.highlightForeground#fa5e2a
  • editorSuggestWidget.selectedBackground#333333
  • editorWhitespace.foreground#1a1a1a
  • editorWidget.background#1a1a1a
  • editorWidget.border#333333
  • extensionButton.prominentBackground#cc3300
  • extensionButton.prominentForeground#EBEBEB
  • extensionButton.prominentHoverBackground#cc552d
  • focusBorder#ff330088
  • foreground#EBEBEB
  • input.background#000000
  • input.border#666666
  • input.foreground#EBEBEB
  • input.placeholderForeground#2e2e2e
  • inputOption.activeBorder#666666
  • list.activeSelectionBackground#AAAAAA
  • list.activeSelectionForeground#000000
  • list.focusBackground#262626
  • list.hoverBackground#080808
  • list.inactiveSelectionBackground#444444
  • minimap.background#181818
  • panel.background#1e1e1e
  • panel.border#333333
  • panelTitle.activeBorder#ff330088
  • panelTitle.inactiveForeground#595959
  • peekView.border#ff330088
  • peekViewEditor.background#000000
  • peekViewEditor.matchHighlightBackground#fcaf2155
  • peekViewEditorGutter.background#000000
  • peekViewResult.background#0d0d0d
  • peekViewResult.fileForeground#f5f5f5
  • peekViewResult.lineForeground#e6e6e6
  • peekViewResult.matchHighlightBackground#fcaf2155
  • peekViewResult.selectionBackground#050505
  • peekViewResult.selectionForeground#EBEBEB
  • peekViewTitle.background#000000
  • peekViewTitleDescription.foreground#f7f7f7
  • peekViewTitleLabel.foreground#EBEBEB
  • progressBar.background#fa5e2a
  • scrollbar.shadow#000000
  • scrollbarSlider.activeBackground#ff3300aa
  • scrollbarSlider.background#333333aa
  • scrollbarSlider.hoverBackground#ff330055
  • sideBar.background#1e1e1e
  • sideBar.foreground#EBEBEB
  • sideBarSectionHeader.background#141414
  • sideBarSectionHeader.foreground#EBEBEB
  • tab.inactiveBackground#222222
  • tab.inactiveForeground#666666

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#555555
constant.numeric, constant.language, constant.character, constant.other#19DB76
variable#EBEBEB
variable.paramener#BBBBBB
keyword#4c4af1
storage#fcaf21
entity.name.type.modulebold
entity.other.inherited-class#fcaf21
entity.name.function#25d1b7
entity.name.tag#fa5e2a
entity.other.attribute-name#fcaf21italic
support.type, support.class, support.constant#fcaf21
invalid#CF433E
invalid.deprecated#CF433E
meta.structure.dictionary.json string.quoted.double.json#25d1b7
meta.diff, meta.diff.header#555555
markup.deleted#E61F44
markup.inserted#A6E22E
markup.changed#F7B83D
constant.numeric.line-number.find-in-files - match#8FBE00A0
entity.name.filename.find-in-files#E6DB74
meta.property-value, support.constant.property-value, constant.other.color#25d1b7
meta.structure.dictionary.json string.quoted.double.json#fcaf21
meta.structure.dictionary.value.json string.quoted.double.json#25d1b7
meta.property-name support.type.property-namenormal
meta.property-value punctuation.separator.key-value#EBEBEB
keyword.other.use, keyword.other.function.use, keyword.other.namespace, keyword.other.new, keyword.other.special-method, keyword.other.unit, keyword.other.use-as#fa5e2a
meta.use support.class.builtin, meta.other.inherited-class support.class.builtin#fa5e2anormal
variable.parameter.function.coffee#fcaf21
entity.name.section.markdown#fcaf21
punctuation.definition.heading.markdown#4c4af1
markup.raw.inline.markdown#25d1b7
punctuation.definition.bold.markdown, punctuation.definition.italic.markdown#4c4af1
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown#4c4af1
punctuation.definition.metadata.markdown#4c4af1
markup.underline.link.markdown, markup.underline.link.image.markdown, meta.image.inline.markdown#fa5e2a
markup.bold.markdown, markup.italic.markdown#fa5e2a
markup.italic.markdownitalic
markup.bold.markdownbold
markup.raw.block.markdown#664E4D
markup.deleted.git_gutter#F87856
markup.inserted.git_gutter#1BA2F7
markup.changed.git_gutter#81209E
meta.template.expression#EBEBEB
variable.language.this#fcaf21bold
keyword.control.flow, keyword.control.defaultitalic
keyword.control.flow, keyword.control.default, keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.logical.pythonitalic
meta.decorator punctuation.decoratoritalic
punctuation.definition.comment, comment#707070italic
keyword.control#fa5e2a
storage.type#4c4af1
support.function#25d1b7italic
storage.modifier#f84545italic
keyword.operator.logical, keyword.operator.arithmetic, keyword.operator.relational, keyword.operator.new, keyword.operator.assignment, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.logical.python#4c4af1
string#80d846
support.type.primitive, support.type.builtinbold
string.regexp#f84545
token.info-token#6796E6
token.warn-token#CD9731
token.error-token#F44747
token.debug-token#B267E6
meta.import variable.other.readwrite#B9B9B9bold
meta.objectliteral punctuation.definition.blockbold
punctuation.terminator#EBEBEB80
punctuation.definition.block#EBEBEB
punctuation.definition.block.tag.jsdoc#D4D4D4
comment.block.documentation variable#D4D4D4
variable.language.super#fcaf21
constant.other.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.range.regexp#fcaf21
constant.character.escape.backslash.regexp#80d846
constant.character.escape#f84545
meta.brace#EBEBEB
meta.array.literal meta.brace.square#80d846
support.constantitalic bold
[DEPRECATED] Coral Reef by inVitro - VS Code Theme