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#171d24
  • activityBarBadge.background#2fa34f
  • editor.background#171d24
  • editor.foreground#e7e7e7
  • editor.lineHighlightBackground#fff1
  • editor.lineHighlightBorder#0000
  • editor.selectionBackground#ffffff18
  • editor.wordHighlightBackground#f1f58c1a
  • editorBracketMatch.border#f1f58c
  • editorGroupHeader.noTabsBackground#171d24
  • editorGroupHeader.tabsBackground#171d24
  • editorHoverWidget.background#171d24
  • editorHoverWidget.border#fff1
  • editorLineNumber.activeForeground#ff0000
  • editorLineNumber.foreground#ffffff36
  • editorSuggestWidget.background#171d24
  • editorSuggestWidget.border#fff1
  • editorSuggestWidget.highlightForeground#f1f58c
  • editorSuggestWidget.selectedBackground#fff1
  • list.hoverBackground#fff1
  • sideBar.background#171d24
  • sideBarTitle.foreground#bbbbbb
  • statusBar.background#171d24
  • tab.activeBackground#171d24
  • tab.activeBorder#2fa34f
  • tab.activeForeground#fff
  • tab.border#0000
  • tab.inactiveBackground#171d24
  • tab.inactiveForeground#fff9
  • titleBar.activeBackground#171d24
  • titleBar.inactiveBackground#171d24
  • widget.shadow#0002

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
source, variable#cacaca
punctuation.definition.block, punctuation.terminator, meta.brace, punctuation.definition, punctuation.separator, punctuation.destructuring, punctuation.accessor, keyword.operator#65657c
comment, punctuation.definition.comment#4f4f5fitalic
constant.numeric#ff8080
keyword.control, storage.type, keyword.operator.new, storage.modifier, keyword.operator.expression#8a7dc7italic
variable.parameter, meta.parameters entity.name.function, support.constant#ff67cf
keyword.operator.arithmetic, keyword.operator.assignment, storage.type.function.arrow, keyword.operator.comparison, keyword.operator.logical, keyword.operator.ternary#d8a1ff
string, punctuation.definition.string#8cf5a9
entity.name.function, entity.name.tag, support.function#ffb34f
support.type, entity.other.attribute-name#cee450italic
entity.name.type, entity.other.inherited-class, support.class, entity.other.attribute-name.id#40e2da
variable.language, entity.other.attribute-name.class#fd4c55italic
constant.language#e23cdaitalic
variable.other.property, meta.object-literal.key, support.variable.property#8599FF
Parkour! by Hosein Khansari - VS Code Theme