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#120a00
  • activityBar.foreground#d3af86
  • badge.background#274D58
  • badge.foreground#DCB893
  • breadcrumb.activeSelectionForeground#c2a383
  • breadcrumb.focusForeground#c2a383
  • breadcrumb.foreground#cc9868
  • button.background#6e583b
  • diffEditor.removedTextBackground#702c22e1
  • dropdown.background#51412c
  • editor.background#120a00
  • editor.foreground#c92
  • editor.lineHighlightBackground#321
  • editor.selectionBackground#432
  • editor.wordHighlightBackground#0000
  • editor.wordHighlightBorder#ccc
  • editorCursor.foreground#fff
  • editorGroupHeader.background#120a00
  • editorGroupHeader.tabsBackground#120a00
  • editorGutter.deletedBackground#7e2b1e
  • editorGutter.modifiedBackground#3C616B
  • editorHoverWidget.background#221a14
  • editorIndentGuide.activeBackground#ffc400
  • editorIndentGuide.background#333
  • editorLineNumber.activeForeground#fc6
  • editorLineNumber.foreground#b92
  • editorRuler.foreground#cc986869
  • editorWhitespace.foreground#a57a4c
  • editorWidget.background#131510
  • focusBorder#a57a4c
  • gitDecoration.addedResourceForeground#7b991a
  • gitDecoration.deletedResourceForeground#dc3958
  • gitDecoration.modifiedResourceForeground#f79a32
  • gitDecoration.untrackedResourceForeground#9dbe31
  • gitlens.trailingLineForegroundColor#cc9868
  • icon.foreground#a57a4c
  • input.background#51412c
  • inputOption.activeBorder#a57a4c
  • inputValidation.errorBackground#5f0d0d
  • inputValidation.errorBorder#9d2f23
  • inputValidation.infoBackground#2b2a42
  • inputValidation.infoBorder#1b60a5
  • inputValidation.warningBackground#51412c
  • list.activeSelectionBackground#653
  • list.activeSelectionForeground#fff
  • list.focusBackground#7c5021AA
  • list.focusOutline#0000
  • list.highlightForeground#e3b583
  • list.hoverBackground#7c502166
  • list.inactiveSelectionBackground#653
  • list.inactiveSelectionForeground#fff
  • 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
  • scrollbarSlider.activeBackground#5c452dbb
  • scrollbarSlider.background#3b2b1be1
  • scrollbarSlider.hoverBackground#473522dc
  • selection.background#14613daa
  • sideBar.background#120a00
  • sideBar.foreground#ad793e
  • sideBarSectionHeader.background#241a10
  • sideBarSectionHeader.foreground#8b6a4a
  • statusBar.background#120a00
  • statusBar.debuggingBackground#241a10
  • statusBar.debuggingForeground#DCB893
  • statusBar.foreground#C2A383
  • statusBar.noFolderBackground#423523
  • statusBar.noFolderForeground#DCB893
  • tab.activeBackground#423523
  • tab.activeBorder#423523
  • tab.activeForeground#fff
  • tab.border#0000
  • tab.inactiveBackground#221a0f
  • tab.inactiveForeground#DCB893
  • 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#120a00
  • titleBar.background#120a00
  • welcomePage.buttonHoverBackground#312318

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#E6E1C4
text.html#fbfbfb
meta.block, meta.parameters#ddd
comment, punctuation.definition.comment#6B4E32
variable, entity.other.attribute-value.handlebars variable.parameter.handlebars, support.module, entity.name.function, support.type.object, entity.name.type.alias, meta.type.declaration#3af
keyword, storage.type, storage.modifier support.constant.handlebars, meta.function#EE6644
meta.function-call.method entity.name.function, meta.property.object, constant.other.color, meta.tag, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, meta.property variable, constant.other.unit, support.function, meta.function-call.method variable.function, meta.function.static entity.name.function, string.template entity.name.function, variable.other.property#EFAC32
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#EFAC32
support.other.variable, string.other.link, meta.template.expression#F2777A
constant.numeric, constant.language, support.constant, constant.character, variable.parameter, keyword.other.unit#6C99BB
keyword.other.template, string, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, punctuation.definition.string, meta.object.member.js#D9D762
meta.function-call support.function, keyword.other.special-method, meta.block-level, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#fb3
entity.name.class, entity.name.type.class, support.type, support.class, meta.use.php, support.other.namespace, markup.changed.git_gutter#fb3
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#EC5F67
variable.language, variable.parameter.handlebars#7bf
entity.name.method.js, entity.other.attribute-name#f85
meta.class-method.js, variable.function.constructor#D8DEE9
markup.inserted#99C794
markup.deleted#EC5F67
markup.changed#BB80B3
string.regexp#8856D2
string.regexp constant.character.escape, string.regexp source.ruby.embedded, string.regexp string.regexp.arbitrary-repitition#BE73FD
constant.character.escape#5FB3B3
*url*, *link*, *uri*underline
constant.numeric.line-number.find-in-files - match#AB7967
entity.name.filename.find-in-files#99C794
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#6699CCitalic
source.json meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#FAC863
source.json meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#C594C5
source.json meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#D8DEE9
source.json meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#6699CC
source.json meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#AB7967
source.json meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#EC5f67
source.json meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#F99157
source.json meta meta.structure.dictionary.json string.quoted.double.json - meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta.structure.dictionary.json punctuation.definition.string - meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#FAC863
source.json meta.structure.dictionary.json string.quoted.double.json - meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta.structure.dictionary.json punctuation.definition.string - meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#f84
meta.selector.css entity.name.tag, meta.selector.css entity.other.attribute-name.class, meta.selector.css entity.other.attribute-name.id#EFAC32
meta.property-group support.constant.property-value.css, meta.property-value support.constant.property-value.css#C699BB
meta.property-value support.constant.named-color.css, meta.property-value constant#6C99BB
meta.selector.css entity.name.tag#CDA869
meta.selector.css entity.other.attribute-name.tag.pseudo-class#8F9D6A
meta.selector.css entity.other.attribute-name.id#1af
meta.selector.css entity.other.attribute-name.class#EFAC32
support.type.property-name.css#C5AF75
meta.property-group support.constant.property-value.css, meta.property-value support.constant.property-value.css#F9EE98
meta.preprocessor.at-rule keyword.control.at-rule#8693A5
meta.property-value support.constant.named-color.css, meta.property-value constant#CA7840
meta.constructor.argument.css#8F9D6A
sublimelinter.annotations
sublimelinter.outline.illegal
sublimelinter.underline.illegal
sublimelinter.outline.warning
sublimelinter.underline.warning
sublimelinter.outline.violation
sublimelinter.underline.violation
brackethighlighter.unmatched#611
brackethighlighter.curly#333
brackethighlighter.round#333
brackethighlighter.square#333
brackethighlighter.angle#333
brackethighlighter.tag#333
brackethighlighter.quote#333
sublimelinter.mark.warning#DDB700
sublimelinter.gutter-mark#FFFFFF
sublimelinter.mark.error#D02000
variable.other.dollar.js#FF8822
rainbowth0#E6E1C4
rainbowth0-lineHighlight#E6E1C4
rainbowth1orange
rainbowth1-lineHighlightorange
rainbowth2yellow
rainbowth2-lineHighlightyellow
rainbowth3green
rainbowth3-lineHighlightgreen
rainbowth4blue
rainbowth4-lineHighlightblue
rainbowth5indigo
rainbowth5-lineHighlightindigo
rainbowth6violet
rainbowth6-lineHighlightviolet
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
markup.warning, markup.changed, region.yellowish
markup.error, markup.deleted, region.redish
silverwind-theme by silverwind - VS Code Theme