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#202020
  • activityBar.foreground#ffffff
  • activityBarBadge.background#775aff
  • activityBarBadge.foreground#ffffff
  • button.background#775aff
  • button.foreground#ffffff
  • button.hoverBackground#5c37fd
  • editor.background#000000
  • editor.findMatchBackground#850585
  • editor.findMatchHighlightBackground#ea5c0055
  • editor.findRangeHighlightBackground#3a3d4166
  • editor.foreground#ffffff
  • editor.hoverHighlightBackground#264f7840
  • editor.inactiveSelectionBackground#300C3A
  • editor.lineHighlightBackground#101010
  • editor.rangeHighlightBackground#ffffff0b
  • editor.selectionBackground#581254
  • editor.selectionHighlightBackground#701C2A70
  • editor.wordHighlightBackground#775aff40
  • editor.wordHighlightStrongBackground#490000b8
  • editorCursor.foreground#dfdfdf
  • editorGroupHeader.noTabsBackground#000000
  • editorGroupHeader.tabsBackground#202020
  • editorWhitespace.foreground#101010
  • foreground#ffffff
  • input.background#000000
  • input.foreground#cccccc
  • sideBar.background#101010
  • sideBar.dropBackground#ffffff1f
  • sideBarSectionHeader.background#202020
  • statusBar.background#392b79
  • statusBar.debuggingBackground#cc6633
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#ffffff
  • statusBar.noFolderBackground#68217a
  • statusBar.noFolderForeground#ffffff
  • statusBarItem.activeBackground#ffffff2e
  • statusBarItem.hoverBackground#ffffff1f
  • statusBarItem.prominentBackground#388a34
  • statusBarItem.prominentHoverBackground#369432
  • tab.activeBackground#000000
  • tab.activeForeground#ffffff
  • tab.border#181818
  • tab.inactiveBackground#202020
  • tab.inactiveForeground#ffffff80
  • tab.unfocusedActiveForeground#ffffff80
  • tab.unfocusedInactiveForeground#ffffff40
  • titleBar.activeBackground#202020
  • titleBar.activeForeground#ffffff80
  • titleBar.inactiveBackground#000000
  • titleBar.inactiveForeground#ffffff50

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
text, source#ffffff—
git_changes_change#A29F46—
git_changes_add#1f9a12—
git_changes_del-#A72822—
comment, punctuation.definition.comment#ff0000—
constant.numeric#a6e22e—
constant.language#775aff—
constant.character, constant.other#9a79d7—
variable—
keyword, storage.type, storage.modifier#775aff—
keyword.operator.logical.python#775aff—
keyword.operator, punctuation#625b88—
string.quoted, punctuation.definition.string, storage.type.string#d3c970—
string.quoted.docstring#7c9f57—
meta.fstring.python storage.type.string.python, meta.fstring.python punctuation.definition string.quoted.single.python, meta.fstring.python punctuation.definition string.quoted.multi.python, , meta.fstring.python punctuation.definition string.quoted.raw.single.python, meta.fstring.python punctuation.definition string.quoted.raw.multi.python#FFED44—
string.quoted.single.python constant.character.format.placeholder.other.python#9C9130—
comment.line.note, string.quoted.docstring.note#b14a58—
storage#e8364f
entity.name.function.decorator#8abeb7—
entity.name.class#A6E22E—
entity.other.inherited-class#c5c8f6—
entity.name.function, entity.name.type.class#ffffffbold
variable.parameter#c5c8f6—
entity.name.tag.namespace#00cbcb—
entity.name.tag, keyword.doctype.xml#775aff—
entity.other.attribute-name#D77C23—
support.function#66D9EF
support.constant#66D9EF
support.type#66D9EF—
support.class, support.other, support.variable#66D9EF—
support.other.variable—
invalid#F8F8F0
invalid.deprecated#F8F8F0—
meta.structure.dictionary.json string.quoted.double.json#CFCFC2—
meta.diff, meta.diff.header#75715E—
markup.deleted#e8364f—
markup.inserted#A6E22E—
markup.changed#E6DB74—
variable.language.special, variable.parameter.function.language.special#b0af95—
comment.typehint#ff0080—
comment.typehint.ignore#ff00a0—
comment.typehint.type#ff00f0—
markup.quote#F92672—
markup.list#E6DB74—
markup.bold, markup.italic#775affbold
markup.italic#66D9EFitalic
markup.inline.raw#FD971F
markup.heading#A6E22E—
markup.heading.setext#A6E22E
theme-chromodynamics-delek by ambv - VS Code Theme