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#4a5141
  • activityBar.border#ffffff15
  • activityBar.foreground#4f7d58
  • activityBar.inactiveForeground#f5f7f260
  • activityBarBadge.background#4f7d58
  • activityBarBadge.foreground#4a5141
  • button.background#4f7d58
  • button.foreground#4a5141
  • button.hoverBackground#4f7d58dd
  • editor.background#4a5141
  • editor.foreground#f5f7f2
  • editor.inactiveSelectionBackground#fffaf03580
  • editor.lineHighlightBackground#1f2c2a40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#fffaf035
  • editorCursor.foreground#4f7d58
  • editorGroupHeader.tabsBackground#4a5141dd
  • editorLineNumber.activeForeground#4f7d58
  • editorLineNumber.foreground#fffaf080
  • focusBorder#4f7d58
  • foreground#f5f7f2
  • input.background#1f2c2a
  • input.border#ffffff15
  • input.foreground#f5f7f2
  • input.placeholderForeground#f5f7f260
  • list.activeSelectionBackground#4f7d5830
  • list.activeSelectionForeground#f5f7f2
  • list.highlightForeground#4f7d58
  • list.hoverBackground#1f2c2a40
  • list.hoverForeground#f5f7f2
  • list.inactiveSelectionBackground#4f7d5815
  • list.inactiveSelectionForeground#f5f7f2
  • selection.background#fffaf035
  • sideBar.background#1f2c2a
  • sideBar.border#ffffff15
  • sideBar.foreground#f5f7f2
  • sideBarSectionHeader.background#4a514180
  • sideBarSectionHeader.foreground#f5f7f2
  • sideBarTitle.foreground#4f7d58
  • statusBar.background#4a5141
  • statusBar.border#ffffff15
  • statusBar.foreground#f5f7f2
  • statusBar.noFolderBackground#4a5141
  • tab.activeBackground#4a5141
  • tab.activeBorderTop#4f7d58
  • tab.activeForeground#f5f7f2
  • tab.border#ffffff15
  • tab.inactiveBackground#1f2c2a60
  • tab.inactiveForeground#f5f7f280
  • terminal.ansiBlack#4a5141
  • terminal.ansiBlue#fffaf0
  • terminal.ansiCyan#d9ad3b
  • terminal.ansiGreen#4f7d58
  • terminal.ansiMagenta#5f9a92
  • terminal.ansiRed#5f9a92
  • terminal.ansiWhite#f5f7f2
  • terminal.ansiYellow#d9ad3b
  • terminal.background#4a5141
  • terminal.foreground#f5f7f2
  • titleBar.activeBackground#4a5141
  • titleBar.activeForeground#f5f7f2
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#4a5141
  • titleBar.inactiveForeground#f5f7f260
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#fffaf0italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#fffaf0bold
storage.type, storage.modifier#fffaf0italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#4f7d58
string, punctuation.definition.string, string.template, meta.template.expression#d9ad3b
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#5f9a92
variable, variable.other.readwrite, variable.other.object#f5f7f2
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#f5f7f2
variable.parameter, meta.parameter#f5f7f2dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#f5f7f280
keyword.operator#f5f7f2
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#d9ad3bbold
entity.other.inherited-class#4f7d58
entity.name.tag, punctuation.definition.tag#fffaf0
entity.other.attribute-name#4f7d58
meta.diff, meta.diff.header#fffaf0
markup.deleted#5f9a92
markup.inserted#4f7d58
markup.changed#d9ad3b
markup.heading, markup.heading.setext, punctuation.definition.heading#4f7d58bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#d9ad3b
string.other.link.title, string.other.link.description#4f7d58
markup.underline.link#fffaf0underline
punctuation.definition.list#fffaf0
markup.quote, punctuation.definition.quote#fffaf0italic