Skip to main content
Coding Theme

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#131518
  • activityBarBadge.background#FF9A00
  • activityBarBadge.foreground#191B1F
  • editor.background#191B1F
  • editor.foreground#DCDCDC
  • editor.lineHighlightBackground#2c313a33
  • editor.lineHighlightBorder#3E4451
  • editor.selectionBackground#3E4451AA
  • editorBracketMatch.background#4FC1FF33
  • editorBracketMatch.border#4FC1FF
  • editorCursor.foreground#FF9A00
  • editorIndentGuide.activeBackground1#FF9A00
  • editorIndentGuide.background1#3b4048
  • editorLineNumber.activeForeground#FF9A00
  • editorLineNumber.foreground#48535E
  • sideBar.background#16181C
  • sideBarTitle.foreground#DCDCDC
  • statusBar.background#131518
  • statusBar.border#FF9A0033
  • statusBar.foreground#FF9A00
  • statusBarItem.remoteBackground#2E8B57
  • terminal.ansiBlue#4FC1FF
  • terminal.ansiBrightBlue#71D5FF
  • terminal.ansiBrightCyan#A1E9F0
  • terminal.ansiBrightGreen#a2ff5e
  • terminal.ansiBrightMagenta#D1AAFF
  • terminal.ansiBrightRed#FF4B4B
  • terminal.ansiBrightYellow#FFB84D
  • terminal.ansiCyan#56B6C2
  • terminal.ansiGreen#8fe750
  • terminal.ansiMagenta#C792EA
  • terminal.ansiRed#B52E2E
  • terminal.ansiYellow#FF9A00
  • terminal.background#131518
  • terminal.foreground#DCDCDC
  • terminal.selectionBackground#FF9A0044
  • terminalCursor.background#131518
  • terminalCursor.foreground#FF9A00
  • textCodeBlock.background#191B1F
  • textPreformat.foreground#FF9A00

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#5C6370italic
punctuation, meta.delimiter#8897a3
keyword, storage.type, storage.modifier, keyword.control#FF9A00bold
variable, string constant.other.placeholder#DCDCDC
entity.name.function, support.function, meta.function-call#4FC1FF
string#8fe750
constant.numeric, constant.language, support.constant#E5C07B
entity.name.type, entity.name.class, support.type, support.class#56B6C2
entity.name.tag, meta.tag.sgml#E06C75
entity.other.attribute-name#D19A66
support.type.property-name, meta.object-literal.key#FF9A00
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#FF9A00bold
markup.fenced_code.block.markdown, markup.inline.raw.string.markdown, variable.language.fenced.markdown#8fe750
string.other.link.title.markdown, markup.underline.link.markdown, markup.underline.link.image.markdown#4FC1FF
markup.bold, markup.italic#DCDCDCbold
beginning.punctuation.definition.list.markdown, punctuation.definition.quote.begin.markdown, markup.quote#56B6C2
punctuation.definition.table.markdown, punctuation.separator.table.markdown, markup.table.markdown#56B6C2
markup.table.header.markdown, markup.table.header.markdown entity.name.section.markdown#FF9A00bold
markup.table.content.markdown#DCDCDC
Half-Life Dark Theme by Mateo Ryhr - VS Code Theme