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#221a0f
  • activityBar.foreground#829AA0
  • activityBarBadge.background#274D58
  • activityBarBadge.foreground#DCB893
  • badge.background#274D58
  • badge.foreground#DCB893
  • breadcrumb.activeSelectionForeground#c2a383
  • breadcrumb.focusForeground#c2a383
  • breadcrumb.foreground#9c6e43
  • button.background#6e583b
  • diffEditor.removedTextBackground#702c22e1
  • dropdown.background#51412c
  • dropdown.foreground#DCB893
  • editor.background#221a0f
  • editor.foreground#d3af86
  • editor.lineHighlightBackground#4e3923a1
  • editor.selectionBackground#7c5021a9
  • editorCursor.foreground#d3af86
  • editorGroupHeader.tabsBackground#131510
  • editorGutter.deletedBackground#7e2b1e
  • editorGutter.modifiedBackground#3C616B
  • editorHoverWidget.background#221a14
  • editorLineNumber.activeForeground#c2a383
  • editorLineNumber.foreground#8D643D
  • editorRuler.foreground#cc986869
  • editorWhitespace.foreground#a57a4c
  • editorWidget.background#131510
  • editorWidget.foreground#C2A383
  • focusBorder#a57a4c
  • gitDecoration.addedResourceForeground#7b991a
  • gitDecoration.deletedResourceForeground#dc3958
  • gitDecoration.modifiedResourceForeground#f79a32
  • gitDecoration.untrackedResourceForeground#9dbe31
  • gitlens.trailingLineForegroundColor#cc9868
  • icon.foreground#C2A383
  • input.background#51412c
  • input.foreground#d3af86
  • input.placeholderForeground#998158
  • inputOption.activeBorder#a57a4c
  • inputValidation.errorBackground#5f0d0d
  • inputValidation.errorBorder#9d2f23
  • inputValidation.infoBackground#2b2a42
  • inputValidation.infoBorder#1b60a5
  • inputValidation.warningBackground#51412c
  • list.activeSelectionBackground#7c5021
  • list.focusBackground#7c5021AA
  • list.highlightForeground#e3b583
  • list.hoverBackground#7c502166
  • list.inactiveSelectionBackground#645342
  • menu.background#362712
  • menu.foreground#C2A383
  • panelTitle.activeBorder#274D58
  • panelTitle.activeForeground#D4B290
  • panelTitle.inactiveForeground#8D643D
  • peekView.border#5e452b
  • peekViewEditor.background#221a14
  • peekViewEditor.matchHighlightBackground#84613daa
  • peekViewResult.background#362712
  • peekViewTitle.background#362712
  • pickerGroup.border#e3b583
  • pickerGroup.foreground#e3b583
  • progressBar.background#7f5d38
  • quickInput.background#352612
  • quickInput.foreground#DCB893
  • rust_analyzer.inlayHints.foreground#7e6944
  • scrollbarSlider.activeBackground#5c452dbb
  • scrollbarSlider.background#3b2b1be1
  • scrollbarSlider.hoverBackground#473522dc
  • selection.background#84613daa
  • sideBar.background#362712
  • sideBar.foreground#C2A383
  • sideBarSectionHeader.background#241a10
  • sideBarSectionHeader.foreground#8b6a4a
  • statusBar.background#274952
  • statusBar.debuggingBackground#175429
  • statusBar.debuggingForeground#DCB893
  • statusBar.foreground#DCB893
  • statusBar.noFolderBackground#422d2d
  • statusBar.noFolderForeground#DCB893
  • tab.activeBorder#274D58
  • tab.activeForeground#D4B290
  • tab.border#5e3a1b
  • tab.inactiveBackground#221a0f
  • tab.inactiveForeground#8D643D
  • terminal.ansiBlue#719190
  • terminal.ansiBrightBlue#8ab1b0
  • terminal.ansiBrightCyan#4c96a8
  • terminal.ansiBrightGreen#a3b95a
  • terminal.ansiBrightMagenta#98676a
  • terminal.ansiBrightRed#f14a68
  • terminal.ansiBrightYellow#fcac51
  • terminal.ansiCyan#418292
  • terminal.ansiGreen#889b4a
  • terminal.ansiMagenta#7e5053
  • terminal.ansiRed#dc3958
  • terminal.ansiYellow#f79a32
  • terminal.foreground#c2a383
  • titleBar.activeBackground#423523
  • welcomePage.buttonHoverBackground#312318

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
source#d3af86
meta.embedded, source.groovy.embedded, source.elixir.embedded, source.coffee.embedded#d3af86
comment, punctuation.definition.comment#a57a4c
punctuation.definition.string, punctuation.definition.variable, punctuation.definition.string, punctuation.definition.parameters, punctuation.definition.string, punctuation.definition.array, punctuation.definition.entity, punctuation.separator.inheritance, comment.line.keyword.punctuation.yard, comment.line.punctuation.yard, punctuation.section.function.ruby, punctuation.separator.object.ruby#d3af86
none#d3af86
keyword.operator#d3af86
keyword, keyword.control, keyword.operator.haskell, keyword.other.haskell, keyword.other.forall.haskell, keyword.other.arrow.haskell, keyword.other.big-arrow.haskell, keyword.other.double-colon.haskell, variable.language.rust, variable.language, comment.line.keyword.yard, keyword.operator.expression#98676a
variable, variable.parameter.function, support.variable.property, comment.line.parameter.yard, entity.name.function.member#dc3958
entity.name.function, meta.require, support.function.any-method, support.function, keyword.operator.new#8ab1b0
entity.name.namespace#f06431
support.class, entity.name.class, entity.name.type, variable.other.constant.elixir, entity.other.inherited-class, comment.line.type.yard, storage.type.struct, support.type.primitive, support.type.builtin#f06431
keyword.other.special-method#8ab1b0
storage#98676a
string, constant.other.symbol#889b4a
constant.numeric#f79a32
none#f79a32
none#f79a32
constant, meta.object-literal.key, constant.other.symbol, storage.type.haskell, variable.other.enummember#f79a32
entity.name.tag#dc3958
entity.other.attribute-name#f79a32
entity.other.attribute-name.class#f06431
entity.other.attribute-name.id#8ab1b0
entity.other.attribute-name.pseudo-class#98676a
support.constant#98676a
meta.selector#98676a
none#f79a32
markup.heading, markup.heading.setext, punctuation.definition.heading, entity.name.section#8ab1b0
keyword.other.unit#f79a32
markup.bold, punctuation.definition.bold#f06431bold
markup.italic, punctuation.definition.italic#98676aitalic
markup.inline.raw#889b4a
string.other.link#dc3958
meta.link#f79a32
markup.list#dc3958
markup.quote#f79a32
meta.separator#d3af86
markup.inserted#889b4a
markup.deleted#dc3958
markup.changed#98676a
constant.other.color#889b4a
string.regexp#7e602c
constant.character.escape#7e602c
punctuation.section.embedded, punctuation.definition.template-expression, variable.interpolation#088649
invalid.illegal#dc3958
entity.name.function.infix.haskell, entity.other.inherited-class.haskell#d3af86
meta.attribute.rust, meta.preprocessor.haskell, keyword.other.preprocessor.haskell#7e602c