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.

  • activityBarBadge.background#007acc
  • editor.background#0b0b0b
  • editor.foreground#ababab
  • editor.inactiveSelectionBackground#3a3d41
  • editor.selectionHighlightBackground#add6ff26
  • editorIndentGuide.activeBackground#707070
  • editorIndentGuide.background#404040
  • editorLineNumber.foreground#818181
  • input.placeholderForeground#a6a6a6
  • list.activeSelectionIconForeground#ffffff
  • list.dropBackground#383b3d
  • menu.background#303031
  • menu.foreground#cccccc
  • ports.iconRunningProcessForeground#369432
  • sideBarSectionHeader.background#00000000
  • sideBarSectionHeader.border#cccccc33
  • sideBarTitle.foreground#bbbbbb
  • statusBarItem.remoteBackground#16825d
  • statusBarItem.remoteForeground#ffffff
  • tab.lastPinnedBorder#cccccc33
  • terminal.inactiveSelectionBackground#3a3d41

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
markup.boldbold
markup.italicitalic
markup.underlineunderline
markup.headingbold
variable#ababab
comment#505050italic
storage.type, storage.modifier, keyword, meta.function.definition, meta.function-call keyword.operator.expression, meta.import keyword.control, keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as, keyword.control.directive#868686italic
constant.other.option, keyword.operator, keyword.other.unit, storage.type.function.arrow, punctuation, meta.brace, meta.separator.markdown#6d6d6dnone
keyword.control#d7d7d7bold
entity.name.function, support.function, meta.function-call.generic#b9a994
support.type, entity.name.type, storage.type.haskell#478387italic
constant.numeric#2baad2
string, punctuation.definition.string#39bdbc
constant.language#5ca6cc
support.constant.property-value, constant.other.color#5ca6ccunderline
variable.other.property, variable.other.object.property, support.type.property-name#9e9e9eitalic
variable.other.object#ababab
entity.name.tag#955756bold
support.class.component, markup.heading#9e6755bold
entity.other.attribute-name#917271italic
4d46's dark theme by 4d46 - VS Code Theme