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#F8FAFC
  • activityBar.foreground#4F46E5
  • activityBarBadge.background#1D4ED8
  • activityBarBadge.foreground#FFFFFF
  • editor.background#F8FAFC
  • editor.foreground#1E293B
  • editor.selectionBackground#A5B4FC66
  • editor.selectionHighlightBackground#A5B4FC33
  • editorCursor.foreground#4F46E5
  • editorGutter.addedBackground#10B981
  • editorGutter.background#F8FAFC
  • editorGutter.deletedBackground#EF4444
  • editorGutter.modifiedBackground#F59E0B
  • editorLineNumber.activeForeground#4F46E5
  • editorLineNumber.foreground#64748B
  • sideBar.background#F8FAFC
  • sideBar.foreground#4F46E5
  • sideBarTitle.foreground#4F46E5
  • statusBar.background#F8FAFC
  • statusBar.foreground#4F46E5
  • tab.activeBackground#E2E8F0
  • tab.activeForeground#1E293B
  • tab.inactiveBackground#F8FAFC

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#64748Bitalic
variable, string constant.other.placeholder#1E293B
constant.other.color#111827
invalid, invalid.illegal#DC2626
keyword, storage.type, storage.modifier#4F46E5
keyword.control, punctuation, 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#0EA5E9
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#D946EF
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#2563EB
meta.block variable.other#D946EF
support.other.variable, string.other.link#D946EF
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#F59E0B
string, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#10B981
entity.name, support.type, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types#D97706
support.type#0284C7
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#0284C7
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#DC2626
variable.language#DC2626italic
entity.name.method.js#2563EBitalic
meta.class-method.js entity.name.function.js, variable.function.constructor#2563EB
entity.other.attribute-name#4F46E5
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#D97706italic
entity.other.attribute-name.class#D97706
source.sass keyword.control#2563EB
markup.inserted#10B981
markup.deleted#DC2626
markup.changed#4F46E5
string.regexp#0EA5E9
constant.character.escape#0EA5E9
*url*, *link*, *uri*#2563EBunderline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#2563EBitalic
source.js constant.other.object.key.js string.unquoted.label.js#DC2626italic
source.json meta.structure.dictionary.json support.type.property-name.json#4F46E5
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#D97706
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#F59E0B
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#DC2626
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#D946EF
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#2563EB
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#D946EF
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#4F46E5
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#10B981
text.html.markdown, punctuation.definition.list_item.markdown#1E293B
text.html.markdown markup.inline.raw.markdown#4F46E5
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#64748B
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#10B981
markup.italic#D946EFitalic
markup.bold, markup.bold string#D946EFbold
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string#D946EFbold italic
markup.underline#F59E0Bunderline
markup.quote punctuation.definition.blockquote.markdown#64748B
markup.quote#10B981italic
string.other.link.title.markdown#2563EB
string.other.link.description.title.markdown#4F46E5
constant.other.reference.link.markdown#D97706
markup.raw.block#4F46E5
markup.raw.block.fenced.markdown#00000020
punctuation.definition.fenced.markdown#00000020
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#1E293B
variable.language.fenced.markdown#64748B
meta.separator#64748Bbold
markup.table#1E293B