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.

  • 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
ThemeDatabase All Themes by enes ozturk - VS Code Theme