Skip to main content
Coding Theme

Color themes

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#fff
  • activityBar.foreground#212121
  • activityBarBadge.background#FDF0E2
  • activityBarBadge.foreground#212121
  • editor.background#fff
  • editor.foreground#212121
  • editor.inactiveSelectionBackground#FDF0E2
  • editor.selectionBackground#FDF0E2
  • editor.selectionHighlightBackground#FDF0E2
  • editorIndentGuide.background#e6e6e6
  • editorLineNumber.activeForeground#808080
  • editorLineNumber.foreground#aaaaaa
  • list.activeSelectionBackground#FDF0E2
  • list.activeSelectionForeground#aa5318
  • list.focusOutline#FDF0E2
  • sideBar.background#fff
  • sideBar.border#e6e6e6
  • sideBarSectionHeader.background#FDF0E2
  • statusBar.background#fff
  • statusBar.debuggingBackground#F37726
  • statusBar.foreground#212121

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#408080italic
variable, string constant.other.placeholder, punctuation, constant.character, meta.function-call entity.name.function, meta.method-call entity.name.function#212121
invalid, invalid.illegal#c7254e
keyword, storage.type, storage.modifier, keyword.control, keyword.other, keyword.operator.logical#008000bold
constant.other.color, meta.tag, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution, keyword.other.unit, keyword.operator#a2f
entity.name.function, variable.function, support.function, keyword.other.special-method, punctuation.separator.inheritance.php#0000FF
meta.block variable.other#0c4b33
constant.numeric, constant.language, support.constant, constant.escape#BC7A00
string, constant.other.symbol, constant.other.key, markup.heading, punctuation.definition.string.begin, punctuation.definition.string.end, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#BA2121
entity.name.type.class, support.class, entity.other.inherited-class#0000FF
support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types#0000FF
variable.language#008000
string.regexp#BB6688bold
constant.character.escape#008000
constant.language.python#008000bold
entity.other.inherited-class.python, meta.function-call.arguments.python#212121
meta.member.access#05a
support.function.builtin.python, support.type#008000
punctuation.definition.decorator.python, meta.function.decorator.python support.type, meta.function.decorator.python entity.name.function#AA22FF
keyword.operator.new, keyword.operator.expression.of, keyword.operator.expression.in, keyword.operator.expression.typeof#008000
punctuation.section.embedded, meta.function-call.js support.function#212121
support.class.component.js#BC7A00
storage.type.function.arrow.js#a2f
entity.name.tag#008000bold
punctuation.definition.tag, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html#0C4B33
meta.tag#7D9029
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name#0C4B33
entity.other.attribute-name.class#0000ff
source.css keyword.other.unit#BC7A00
punctuation.support.type.property-name.begin.json, punctuation.support.type.property-name.end.json, support.type.property-name.json#008000
entity.tag.tagbraces.django#BC7A00
string.unquoted.tag-string.django#19177C
keyword.operator.django#008000
string.quoted.double.html
keyword.blade, support.function.construct.begin.blade, support.function.construct.end.blade#BC7A00

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Django Theme - Coding Theme