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#232323
  • activityBar.border#652020
  • activityBarBadge.background#007acc
  • editor.background#181818
  • editor.foreground#eeffff
  • editor.lineHighlightBackground#652020
  • editorBracketMatch.background#4a4aff
  • editorBracketMatch.border#ffffff
  • editorGutter.background#161616
  • editorLineNumber.activeForeground#ffffff
  • editorLineNumber.foreground#606060
  • editorWhitespace.foreground#2b2b2b
  • panel.background#181818
  • panel.border#652020
  • panelTitle.border#1f1f1f
  • sideBar.background#1e1e1e
  • sideBar.border#652020
  • sideBar.foreground#ffffff
  • sideBarSectionHeader.background#2e2e2e
  • sideBarTitle.foreground#bbbbbb
  • statusBar.background#1e1e1e
  • statusBar.border#652020
  • tab.activeBackground#181818
  • tab.activeForeground#ffffff
  • tab.border#652020
  • tab.hoverBackground#222222
  • tab.inactiveBackground#2e2e2e
  • tab.lastPinnedBorder#ffff00
  • titleBar.activeBackground#1e1e1e
  • titleBar.activeForeground#ffffff
  • titleBar.border#652020
  • titleBar.inactiveBackground#2e2e2e
  • titleBar.inactiveForeground#ffffff
  • tree.indentGuidesStroke#ff9900

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
variable.other.constant#4FC1FF
variable#9AD9FA
variable#9AD9FA
storage#569CD6
storage.modifier#569CD6
keyword.operator.expression.cast, meta.type.cast.expr#4EC9B0
entity.name.function#DCDCAA
entity.name.type#4EC9B0
support.type#4EC9B0
keyword#C586C0
keyword.operator#ffffff
keyword.operator.new#C586C0
constant.numeric#B5CEA8
string#CE9178
string.regexp#D16969
constant.language.boolean#569CD6
constant.language.null#569CD6
comment#6A9955
support.class.builtin#4EC9B0
meta.object-literal.key#9CDCFE
entity.other.attribute-name.class.css, entity.name.tag.css#D7BA7D
entity.other.attribute-name.parent-selector-suffix.css#D7BA7D
support.type.property-name.css#FF9900
support.constant.property-value.css#8080FF
entity.name.tag.reference.scss#569CD6
support.type.property-name.json#FF9900bold
constant.language.json#569CD6
entity.name.tag#ff9900bold
support.class.component#4EC9B0bold
entity.other.attribute-name#00ff80
meta.attribute.classbold
punctuation.definition.tag#808080bold
ino theme by inoplanetyanya - VS Code Theme