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#181818
  • editor.background#1F1F1F
  • editor.foreground#FFFFFF
  • editor.inactiveSelectionBackground#3a3d4160
  • editor.selectionBackground#e799ff23
  • editor.selectionHighlightBackground#5ec4f36a
  • editor.wordHighlightBackground#eb5bd12d
  • editorBracketHighlight.foreground1#9960b6
  • editorBracketHighlight.foreground2#68b9de
  • editorBracketHighlight.foreground3#d10f93
  • editorBracketHighlight.foreground4#9e6ac6
  • editorBracketHighlight.foreground5#e175bb
  • editorBracketHighlight.foreground6#68b9de
  • editorBracketMatch.border#e22ca9a5
  • editorIndentGuide.activeBackground1#ffe64753
  • editorIndentGuide.background1#ff93e21d
  • editorLineNumber.activeForeground#9067d4
  • editorLineNumber.foreground#9067d471
  • input.placeholderForeground#A6A6A6
  • sideBarTitle.foreground#BBBBBB
  • statusBar.background#821680
  • statusBarItem.remoteBackground#821680
  • statusBarItem.remoteForeground#ffffff
  • titleBar.activeBackground#181818
  • titleBar.inactiveBackground#181818

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#528445italic
source#F3AAE5
storage.type#5EC4F3
constant.numeric.decimal, keyword.other.suffix.literal.built-in.floating-point, variable.other.enummember#d69f5c
string#F3AAE5
constant#5EC4F3
entity.name.function.definition, entity.name.function.member, entity.name.function.call#d4c15e
variable#B383D0
storage.modifier.reference#d4c15e
keyword.operator.logical, keyword.operator.comparison#9CDCFE
keyword.operator, keyword.control#EB5BD1
keyword.control.directive#EB5BD1
entity.name.function.preprocessor#5EC4F3
meta.preprocessor.macro#F3AAE5
punctuation.separator.namespace.access, punctuation.separator.dot-access, punctuation.separator.pointer-access, punctuation.terminator#F3AAE5
storage.modifier#5EC4F3
entity.name.scope-resolution#df36aa
entity.name.type#df36aaitalic
variable.parameter#9CDCFE
storage.type.modifier.access.control#5EC4F3
entity.name.tag#EB5BD1
entity.other.attribute-name#5EC4F3
punctuation.definition.tag#a17298
punctuation.separator.key-value#F3AAE5
text.html.derivative#d8d8d8
string.quoted.double.html#B383D0
entity.other.attribute-name.id, entity.other.attribute-name.class#EB5BD1
support.type.property-name#B383D0
meta.property-value#5EC4F3
constant.numeric#d4c15d
entity.name.function.js, entity.name.function.jsx, entity.name.function.tsx#d4c15e
CMYP by bunnerd - VS Code Theme