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.activeBackground#f78166
  • activityBar.activeForeground#ffffff
  • activityBar.background#0d1117
  • activityBar.foreground#e6edf3
  • activityBarBadge.background#f78166
  • activityBarBadge.foreground#ffffff
  • badge.background#f78166
  • badge.foreground#ffffff
  • button.background#f78166
  • button.foreground#ffffff
  • button.hoverBackground#ff9a76
  • dropdown.background#21262d
  • dropdown.border#30363d
  • dropdown.foreground#e6edf3
  • editor.background#0d1117
  • editor.findMatchBackground#f7816640
  • editor.findMatchHighlightBackground#f7816620
  • editor.foreground#e6edf3
  • editor.selectionBackground#264f78
  • editor.selectionHighlightBackground#264f7840
  • editor.wordHighlightBackground#264f7820
  • editorBracketMatch.background#264f7840
  • editorBracketMatch.border#f78166
  • editorCursor.foreground#f78166
  • editorIndentGuide.activeBackground#f78166
  • editorIndentGuide.background#21262d
  • editorLineNumber.activeForeground#f78166
  • editorLineNumber.foreground#7d8590
  • errorForeground#f85149
  • focusBorder#f78166
  • infoForeground#58a6ff
  • input.background#21262d
  • input.border#30363d
  • input.foreground#e6edf3
  • inputOption.activeBackground#264f7820
  • inputOption.activeBorder#f78166
  • list.activeSelectionBackground#264f78
  • list.activeSelectionForeground#f78166
  • list.hoverBackground#21262d
  • list.inactiveSelectionBackground#21262d
  • panel.background#161b22
  • panel.border#30363d
  • progressBar.background#f78166
  • scrollbarSlider.activeBackground#30363d80
  • scrollbarSlider.background#30363d40
  • scrollbarSlider.hoverBackground#30363d60
  • selection.background#264f78
  • sideBar.background#161b22
  • sideBar.foreground#e6edf3
  • sideBarTitle.foreground#f78166
  • statusBar.background#0d1117
  • statusBar.foreground#f78166
  • statusBarItem.hoverBackground#264f7820
  • tab.activeBackground#161b22
  • tab.activeForeground#f78166
  • tab.border#30363d
  • tab.inactiveBackground#0d1117
  • tab.inactiveForeground#7d8590
  • terminal.background#0d1117
  • terminal.foreground#e6edf3
  • terminalCursor.background#e6edf3
  • terminalCursor.foreground#f78166
  • titleBar.activeBackground#0d1117
  • titleBar.activeForeground#f78166
  • titleBar.inactiveBackground#0d1117
  • titleBar.inactiveForeground#7d8590
  • warningForeground#d29922

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#7d8590italic
keyword, storage.type, storage.modifier#ff7b72bold
string, string.quoted, string.template#a5d6ff
constant.numeric#79c0ff
entity.name.function, support.function#d2a8ffbold
variable, variable.other, variable.parameter#e6edf3
entity.name.type, support.type, entity.name.class#f78166italic
entity.other.attribute-name, punctuation.definition.attribute#a5d6ffitalic
entity.name.function.macro, support.function.macro#f78166bold
entity.name.type.lifetime#f78166italic
punctuation, punctuation.separator, punctuation.terminator#8b949e
punctuation.bracket, punctuation.section#f78166
keyword.operator, punctuation.operator#ff7b72
constant.language, constant.other#79c0ffbold
punctuation.definition.lifetime#f78166italic
punctuation.definition.string.begin, punctuation.definition.string.end#a5d6ff
meta.attribute.rust#a5d6ffitalic
punctuation.definition.generic#f78166
entity.name.type.trait#f78166bold
entity.name.namespace#79c0ffbold
Leptos Rust Suite by Morshedul Munna - VS Code Theme