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#A6523D
  • activityBar.background#261414
  • activityBar.foreground#C85A17
  • activityBarBadge.background#A6523D
  • activityBarBadge.foreground#E8E2D0
  • badge.background#A6523D
  • badge.foreground#E8E2D0
  • button.background#311212
  • button.foreground#E8E2D0
  • button.hoverBackground#3B1A0A
  • dropdown.background#261414
  • dropdown.border#311212
  • dropdown.foreground#E8E2D0
  • editor.background#1A0F0F
  • editor.findMatchBackground#A6523D44
  • editor.findMatchHighlightBackground#A6523D22
  • editor.foreground#E8E2D0
  • editor.lineHighlightBackground#31121240
  • editor.lineHighlightBorder#31121280
  • editor.selectionBackground#8C3A0A55
  • editor.selectionHighlightBackground#8C3A0A33
  • editorBracketMatch.background#A6523D33
  • editorBracketMatch.border#A6523D
  • editorCursor.foreground#C85A17
  • editorGroupHeader.tabsBackground#1A0F0F
  • editorIndentGuide.activeBackground#3B1A0A88
  • editorIndentGuide.background#3B1A0A44
  • editorLineNumber.activeForeground#C85A17
  • editorLineNumber.foreground#5B4E48
  • editorWhitespace.foreground#3B1A0A
  • focusBorder#A6523D
  • gitDecoration.conflictingResourceForeground#C85A17
  • gitDecoration.deletedResourceForeground#A6523D
  • gitDecoration.modifiedResourceForeground#C85A17
  • gitDecoration.untrackedResourceForeground#8C3A0A
  • input.background#261414
  • input.border#311212
  • input.foreground#E8E2D0
  • input.placeholderForeground#5B4E48
  • inputOption.activeBorder#A6523D
  • list.activeSelectionBackground#311212
  • list.activeSelectionForeground#E8E2D0
  • list.focusBackground#311212
  • list.highlightForeground#C85A17
  • list.hoverBackground#31121266
  • minimap.background#1A0F0F
  • minimapSlider.activeBackground#A6523D66
  • minimapSlider.background#A6523D22
  • minimapSlider.hoverBackground#A6523D44
  • panel.background#1A0F0F
  • panel.border#311212
  • panelTitle.activeBorder#A6523D
  • panelTitle.activeForeground#C85A17
  • panelTitle.inactiveForeground#B89C84
  • scrollbar.shadow#00000044
  • scrollbarSlider.activeBackground#A6523D88
  • scrollbarSlider.background#3B1A0A44
  • scrollbarSlider.hoverBackground#3B1A0A88
  • sideBar.background#261414
  • sideBar.foreground#B89C84
  • sideBarSectionHeader.background#261414
  • sideBarSectionHeader.foreground#C85A17
  • sideBarTitle.foreground#C85A17
  • statusBar.background#311212
  • statusBar.debuggingBackground#A6523D
  • statusBar.foreground#E8E2D0
  • statusBar.noFolderBackground#261414
  • statusBarItem.hoverBackground#3B1A0A
  • tab.activeBackground#311212
  • tab.activeBorder#A6523D
  • tab.activeForeground#E8E2D0
  • tab.border#1A0F0F
  • tab.inactiveBackground#261414
  • tab.inactiveForeground#B89C84
  • terminal.ansiBlue#5A6A8E
  • terminal.ansiBrightBlue#6B7EBF
  • terminal.ansiBrightCyan#D9975C
  • terminal.ansiBrightGreen#A65F3D
  • terminal.ansiBrightMagenta#B86E4F
  • terminal.ansiBrightRed#B86E4F
  • terminal.ansiBrightYellow#D9975C
  • terminal.ansiCyan#C85A17
  • terminal.ansiGreen#8C3A0A
  • terminal.ansiMagenta#A6523D
  • terminal.ansiRed#A6523D
  • terminal.ansiYellow#C85A17
  • terminal.background#1A0F0F
  • terminal.foreground#E8E2D0
  • titleBar.activeBackground#261414
  • titleBar.activeForeground#E8E2D0
  • titleBar.inactiveBackground#1A0F0F
  • titleBar.inactiveForeground#B89C84

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#5B4E48italic
string, string.quoted, string.template#D97732
keyword, storage.type, storage.modifier#A6523Dbold
keyword.operator, punctuation.accessor#B89C84
variable, variable.other#E8E2D0
variable.parameter#C85A17italic
entity.name.function, support.function#C85A17
meta.function-call#B89C84
entity.name.class, entity.name.type.class, support.class#A6523Dbold
entity.name.type, support.type#B89C84
entity.name.type.interface#C85A17italic
constant.numeric#A6523D
constant, constant.language, constant.character#C85A17
constant.language.boolean#A6523Dbold
variable.other.property, support.variable.property#B89C84
meta.object-literal.key#C85A17
entity.name.tag, punctuation.definition.tag#A6523D
entity.other.attribute-name#C85A17italic
punctuation, meta.brace#B89C84
string.regexp#A6523D
constant.character.escape#C85A17
meta.decorator, punctuation.decorator#C85A17
invalid, invalid.illegal#8C3A0Astrikethrough
markup.heading, entity.name.section#A6523Dbold
markup.bold#C85A17bold
markup.italic#B89C84italic
markup.underline.link#C85A17
markup.inline.raw, markup.fenced_code#8C3A0A
support.type.property-name.json#C85A17
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css#A6523D
support.type.property-name.css#B89C84
support.constant.property-value.css#C85A17