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#EDCE60
  • activityBar.foreground#020201
  • activityBar.inactiveForeground#48484A
  • activityBarBadge.background#FEFE01
  • activityBarBadge.foreground#020201
  • editor.background#F4E8DE
  • editor.findMatchBackground#EDCE6050
  • editor.findMatchHighlightBackground#FEFE0130
  • editor.foreground#020201
  • editor.lineHighlightBackground#FEFE0120
  • editor.selectionBackground#EDCE6040
  • editor.selectionHighlightBackground#FEFE0130
  • editorBracketMatch.background#FEFE0140
  • editorBracketMatch.border#EDCE60
  • editorIndentGuide.activeBackground#48484A60
  • editorIndentGuide.background#48484A30
  • editorLineNumber.activeForeground#020201
  • editorLineNumber.foreground#48484A
  • sideBar.background#F4E8DE
  • sideBar.foreground#020201
  • sideBarSectionHeader.background#EDCE6030
  • sideBarSectionHeader.foreground#020201
  • sideBarTitle.foreground#020201
  • statusBar.background#EDCE60
  • statusBar.debuggingBackground#FEFE01
  • statusBar.foreground#020201
  • statusBar.noFolderBackground#EDCE60
  • tab.activeBackground#F4E8DE
  • tab.activeBorderTop#FEFE01
  • tab.activeForeground#020201
  • tab.hoverBackground#EDCE6020
  • tab.inactiveBackground#F4E8DECC
  • tab.inactiveForeground#48484A
  • titleBar.activeBackground#EDCE60
  • titleBar.activeForeground#020201
  • titleBar.inactiveBackground#EDCE60CC
  • titleBar.inactiveForeground#48484A

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
keyword, storage.type, storage.modifier, keyword.control, keyword.operator.new#B8860B
entity.name.type, entity.name.class, entity.name.struct, entity.name.enum, entity.name.interface, support.type, support.class#8B7500
entity.name.function, support.function, meta.function-call#CB3C50
variable, variable.other, variable.parameter, variable.language#3A3806
string, string.template, string.quoted#6F6C0C
comment, punctuation.definition.comment#48484Aitalic
meta.decorator, variable.annotation#DAA520
entity.name.tag, punctuation.definition.tag#B8860B
entity.other.attribute-name#8B7500
markup.heading, entity.name.section#B8860B
markup.underline.link, string.other.link#6F6C0Cunderline
entity.name.tag.yaml, support.type.property-name.json#8B7500
keyword.other.special-method.dockerfile#B8860B
variable.other.normal.shell, variable.other.special.shell#DAA520
support.type.property-name.css, support.type.property-name.scss#8B7500
support.constant.property-value.css#6F6C0C
entity.name.tag.xml, entity.name.tag.html#B8860B
entity.other.attribute-name.xml, entity.other.attribute-name.html#8B7500
Bocchi The Rock Theme by Nijika-jia - VS Code Theme