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.activeBorder#6AA9D8
  • activityBar.background#151515
  • activityBar.foreground#F5F5F5
  • activityBarBadge.background#A3B977
  • activityBarBadge.foreground#FFFFFF
  • badge.background#A3B977
  • badge.foreground#0A0A0A
  • button.background#6AA9D8
  • button.foreground#0A0A0A
  • button.hoverBackground#89CFF5
  • dropdown.background#151515
  • dropdown.border#2C2C2C
  • dropdown.foreground#E0E0E0
  • editor.background#0A0A0A
  • editor.findMatchBackground#6AA9D8AA
  • editor.findMatchHighlightBackground#A3B97755
  • editor.foreground#E0E0E0
  • editor.lineHighlightBackground#2C2C2C
  • editor.lineHighlightBorder#6AA9D8
  • editor.selectionBackground#6AA9D880
  • editor.selectionHighlightBackground#A3B97733
  • editorBracketMatch.background#A3B97733
  • editorBracketMatch.border#A3B977
  • editorCursor.foreground#F5F5F5
  • editorGroupHeader.tabsBackground#151515
  • editorIndentGuide.activeBackground#6AA9D8
  • editorIndentGuide.background#2C2C2C
  • editorLineNumber.activeForeground#F5F5F5
  • editorLineNumber.foreground#555555
  • editorWhitespace.foreground#555555
  • focusBorder#6AA9D8
  • gitDecoration.conflictingResourceForeground#D58AD5
  • gitDecoration.deletedResourceForeground#D55F5F
  • gitDecoration.modifiedResourceForeground#6AA9D8
  • gitDecoration.untrackedResourceForeground#A3B977
  • input.background#151515
  • input.border#2C2C2C
  • input.foreground#E0E0E0
  • input.placeholderForeground#555555
  • inputOption.activeBorder#6AA9D8
  • list.activeSelectionBackground#2C2C2C
  • list.activeSelectionForeground#F5F5F5
  • list.focusBackground#2C2C2C
  • list.highlightForeground#6AA9D8
  • list.hoverBackground#2C2C2C80
  • minimap.background#0A0A0A
  • minimapSlider.activeBackground#6AA9D8
  • minimapSlider.background#2C2C2C80
  • minimapSlider.hoverBackground#555555
  • panel.background#0A0A0A
  • panel.border#2C2C2C
  • panelTitle.activeBorder#6AA9D8
  • panelTitle.activeForeground#F5F5F5
  • panelTitle.inactiveForeground#A3B977
  • scrollbar.shadow#000000
  • scrollbarSlider.activeBackground#6AA9D8
  • scrollbarSlider.background#2C2C2C80
  • scrollbarSlider.hoverBackground#555555
  • sideBar.background#151515
  • sideBar.foreground#E0E0E0
  • sideBarSectionHeader.background#0A0A0A
  • sideBarSectionHeader.foreground#A3B977
  • sideBarTitle.foreground#F5F5F5
  • statusBar.background#151515
  • statusBar.debuggingBackground#6AA9D8
  • statusBar.foreground#F5F5F5
  • statusBar.noFolderBackground#0A0A0A
  • statusBarItem.hoverBackground#2C2C2C80
  • tab.activeBackground#151515
  • tab.activeBorder#6AA9D8
  • tab.activeForeground#F5F5F5
  • tab.border#2C2C2C
  • tab.inactiveBackground#0A0A0A
  • tab.inactiveForeground#A3B977
  • terminal.ansiBlue#6AA9D8
  • terminal.ansiBrightBlue#89CFF5
  • terminal.ansiBrightCyan#A0E0C2
  • terminal.ansiBrightGreen#C5E07A
  • terminal.ansiBrightMagenta#E0A0E9
  • terminal.ansiBrightRed#E08080
  • terminal.ansiBrightYellow#E0C080
  • terminal.ansiCyan#88D8C0
  • terminal.ansiGreen#A3B977
  • terminal.ansiMagenta#D58AD5
  • terminal.ansiRed#D55F5F
  • terminal.ansiYellow#D5B45F
  • terminal.background#0A0A0A
  • terminal.foreground#E0E0E0
  • titleBar.activeBackground#151515
  • titleBar.activeForeground#F5F5F5
  • titleBar.inactiveBackground#0A0A0A
  • titleBar.inactiveForeground#A3B977

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#555555italic
string, string.quoted, string.template#A3B977
keyword, storage.type, storage.modifier#6AA9D8bold
keyword.operator, punctuation.accessor#6AA9D8
variable, variable.other#E0E0E0
variable.parameter#88D8C0italic
entity.name.function, support.function#89CFF5
meta.function-call#88D8C0
entity.name.class, entity.name.type.class, support.class#D58AD5bold
entity.name.type, support.type#88D8C0
entity.name.type.interface#E0A0E9italic
constant.numeric#D5B45F
constant, constant.language, constant.character#D55F5F
constant.language.boolean#D55F5Fbold
variable.other.property, support.variable.property#E0E0E0
meta.object-literal.key#6AA9D8
entity.name.tag, punctuation.definition.tag#D58AD5
entity.other.attribute-name#A3B977italic
punctuation, meta.brace#E0E0E0
string.regexp#D5B45F
constant.character.escape#D55F5F
meta.decorator, punctuation.decorator#E0A0E9
invalid, invalid.illegal#FF0000strikethrough
markup.heading, entity.name.section#6AA9D8bold
markup.bold#6AA9D8bold
markup.italic#88D8C0italic
markup.underline.link#A3B977
markup.inline.raw, markup.fenced_code#88D8C0
support.type.property-name.json#6AA9D8
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css#D58AD5
support.type.property-name.css#A3B977
support.constant.property-value.css#88D8C0