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#0E0E10
  • activityBar.foreground#C0C0CE
  • activityBarBadge.background#F28FAD
  • activityBarBadge.foreground#0E0E10
  • badge.background#F28FAD
  • badge.foreground#0E0E10
  • button.background#F28FAD
  • button.foreground#0E0E10
  • button.hoverBackground#C0C0CE
  • button.secondaryBackground#5E5A76
  • button.secondaryForeground#C0C0CE
  • button.secondaryHoverBackground#2E2E30
  • dropdown.background#0E0E10
  • dropdown.border#5E5A76
  • dropdown.foreground#C0C0CE
  • editor.background#000A0F
  • editor.foreground#C0C0CE
  • editor.lineHighlightBackground#1E1E20
  • editor.selectionBackground#2E2E30
  • editorCursor.foreground#F28FAD
  • editorGroup.emptyBackground#0E0E10
  • editorGroupHeader.tabsBackground#0E0E10
  • editorGroupHeader.tabsBorder#0E0E10
  • editorLineNumber.activeForeground#C0C0CE
  • editorLineNumber.foreground#5E5A76
  • editorWhitespace.foreground#5E5A76
  • input.background#0E0E10
  • input.border#5E5A76
  • input.foreground#C0C0CE
  • input.placeholderForeground#5E5A76
  • sideBar.background#0E0E10
  • sideBar.foreground#C0C0CE
  • sideBarSectionHeader.background#0E0E10
  • sideBarSectionHeader.foreground#C0C0CE
  • statusBar.background#1E1E20
  • statusBar.debuggingBackground#D78284
  • statusBar.debuggingForeground#C0C0CE
  • statusBar.foreground#C0C0CE
  • statusBar.noFolderBackground#0E0E10
  • tab.activeBackground#1E1E20
  • tab.activeForeground#C0C0CE
  • tab.border#0E0E10
  • tab.inactiveBackground#0E0E10
  • tab.inactiveForeground#5E5A76
  • titleBar.activeBackground#0E0E10
  • titleBar.activeForeground#C0C0CE
  • titleBar.inactiveBackground#0E0E10
  • titleBar.inactiveForeground#5E5A76

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#5E5A76italic
string, punctuation.definition.string#8FBF8F
string.special#F28FAD
constant, constant.builtin#F28FADbold
number#D8A080
boolean#F28FAD
function, entity.name.function#7FAFD7bold
keyword, keyword.control#F5C2E7bold
operator#C0C0CE
variable, variable.builtin#C0C0CEitalic
type, entity.name.type#A0A0D0italic
attribute, entity.name.attribute#F5C2E7
namespace#A090C0
punctuation#C0C0CE
symbol#F28FADitalic
markup.heading#F5C2E7bold
markup.bold#F5C2E7bold
markup.italic#F5C2E7italic
markup.link.url#7FAFD7underline
markup.link.text#F5C2E7
markup.quote#5E5A76italic
meta.diagnostic.error#D78284bold
meta.diagnostic.warning#D5B880bold
meta.diagnostic.info#7A9CCCbold
meta.diagnostic.hint#7BB5A8bold
diff.add#86BA75
diff.delete#D78284
diff.change#D5B880
NyxVamp by Zeetech - VS Code Theme