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#262424
  • activityBar.border#000
  • activityBar.dropBackground#262424
  • activityBar.foreground#FABD0F
  • activityBar.inactiveForeground#BA8800
  • activityBarBadge.background#6b8328
  • activityBarBadge.foreground#fff
  • badge.background#7f5d38
  • button.background#6e583b
  • dropdown.background#51412c
  • editor.background#262424
  • editor.findMatchBackground#FABD0F
  • editor.foreground#BA8800
  • editor.lineHighlightBackground#5e452b
  • editor.selectionBackground#FABD0F
  • editor.selectionForeground#262424
  • editorCursor.foreground#d3af86
  • editorGroupHeader.tabsBackground#131510
  • editorHoverWidget.background#221a14
  • editorLineNumber.activeForeground#adadad
  • editorSuggestWidget.background#000
  • editorSuggestWidget.border#FABD0F
  • editorSuggestWidget.foreground#F9EFD4
  • editorSuggestWidget.highlightForeground#F9EFD4
  • editorSuggestWidget.selectedBackground#333030
  • editorWhitespace.foreground#a57a4c
  • editorWidget.background#131510
  • focusBorder#a57a4c
  • input.background#51412c
  • 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#CCCCCC
  • panel.background#000
  • panel.border#3D3A3A
  • panelTitle.activeBorder#FABD0F
  • peekView.border#5e452b
  • peekViewEditor.background#221a14
  • peekViewEditor.matchHighlightBackground#84613daa
  • peekViewResult.background#362712
  • peekViewTitle.background#362712
  • pickerGroup.border#e3b583
  • pickerGroup.foreground#e3b583
  • progressBar.background#7f5d38
  • selection.background#84613daa
  • sideBar.background#3D3A3A
  • sideBar.border#000000
  • sideBar.dropBackground#262424
  • sideBar.foreground#F9EFD4
  • sideBarSectionHeader.background#333030
  • sideBarSectionHeader.border#20202000
  • sideBarSectionHeader.foreground#F9EFD4
  • sideBarTitle.foreground#BA8800
  • statusBar.background#FABD0F
  • statusBar.debuggingBackground#423523
  • statusBar.foreground#000
  • statusBar.noFolderBackground#423523
  • statusBarItem.remoteBackground#6e583b
  • tab.activeBackground#BA8800
  • tab.activeBorder#F9EFD4
  • tab.activeBorderTop#00000000
  • tab.activeForeground#262424
  • tab.hoverBackground#FABD0F
  • tab.hoverBorder#6b665a
  • tab.inactiveBackground#3D3A3A
  • tab.inactiveForeground#8d8778
  • terminal.ansiBlue#61DBFB
  • terminal.ansiYellow#FABD0F
  • terminal.background#000
  • terminal.border#FABD0F
  • terminal.foreground#F9EFD4
  • terminal.selectionBackground#fabb0f4d
  • terminalCursor.foreground#FABD0F
  • titleBar.activeBackground#000
  • titleBar.activeForeground#F9EFD4
  • titleBar.border#BA8800
  • titleBar.inactiveBackground#414141
  • titleBar.inactiveForeground#505050

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#d3af86
meta.embedded, source.groovy.embedded#d3af86
variable.parameter.function#d3af86
comment, punctuation.definition.comment#a57a4c
punctuation.definition.string, punctuation.definition.variable, punctuation.definition.string, punctuation.definition.parameters, punctuation.definition.string, punctuation.definition.array#d3af86
none#d3af86
keyword.operator#d3af86
keyword, keyword.control, keyword.operator.new.cpp, keyword.operator.delete.cpp, keyword.other.using, keyword.other.operator#98676a
variable#dc3958
entity.name.function, meta.require, support.function.any-method#8ab1b0
support.class, entity.name.class, entity.name.type, entity.name.namespace, entity.name.scope-resolution#f06431
keyword.other.special-method#8ab1b0
storage#98676a
support.function#7e602c
string, constant.other.symbol, entity.other.inherited-class#889b4a
constant.numeric#f79a32
none#f79a32
none#f79a32
constant#f79a32
entity.name.tag#dc3958
entity.other.attribute-name#f79a32
entity.other.attribute-name.id, punctuation.definition.entity#8ab1b0
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#7e602c
string.regexp#7e602c
constant.character.escape#7e602c
punctuation.section.embedded, variable.interpolation#088649
invalid.illegal#dc3958

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Saveur-Biere.com Custom Theme - Coding Theme