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#ffe9ed
  • activityBar.foreground#cc1336
  • activityBarBadge.background#ffe9ed
  • activityBarBadge.foreground#cc1336
  • breadcrumb.background#fff9fd
  • breadcrumb.foreground#666666
  • editor.background#ffffff
  • editor.foreground#000000
  • editorCursor.background#ffffff
  • editorCursor.foreground#ff2a50
  • editorGroupHeader.border#fff
  • editorGroupHeader.tabsBackground#ffe9ed
  • gitDecoration.addedResourceForeground#28a280
  • gitDecoration.conflictingResourceForeground#775ce7
  • gitDecoration.deletedResourceForeground#d62767
  • gitDecoration.ignoredResourceForeground#8e8e90
  • gitDecoration.modifiedResourceForeground#12504f
  • gitDecoration.stageDeletedResourceForeground#fe4e86
  • gitDecoration.stageModifiedResourceForeground#0fcac7
  • gitDecoration.submoduleResourceForeground#4e8eee
  • gitDecoration.untrackedResourceForeground#0f6b6a
  • menu.background#ffe9ed
  • menu.foreground#cc1336
  • panel.background#ffffff
  • selection.background#ffee88
  • sideBar.background#ffe9ed
  • sideBar.dropBackground#acebed
  • sideBar.foreground#cc1336
  • sideBarSectionHeader.background#ffe9ed
  • sideBarSectionHeader.foreground#cc1336
  • statusBar.background#ffe9ed
  • statusBar.debuggingBackground#09c598
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#cc1336
  • statusBar.noFolderBackground#ffe9ed
  • statusBar.noFolderForeground#333333
  • statusBarItem.activeBackground#ffffff
  • statusBarItem.errorBackground#880000
  • statusBarItem.errorForeground#ffffff
  • statusBarItem.hoverBackground#ffffff
  • statusBarItem.prominentBackground#ec1396
  • statusBarItem.prominentForeground#ffffff
  • statusBarItem.prominentHoverBackground#ec1396
  • tab.activeBackground#fff9fd
  • tab.activeForeground#000000
  • tab.border#ffe9ed
  • tab.inactiveBackground#ffe9ed
  • tab.inactiveForeground#c24f64
  • titleBar.activeBackground#ffe9ed
  • titleBar.activeForeground#cc1336
  • titleBar.inactiveBackground#ffe9ed
  • titleBar.inactiveForeground#cc1336

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#4b5662italic
comment.block.preprocessor#ff408b
comment.documentation, comment.block.documentation#444444
invalid.illegal#fa2573
keyword.operator#09c598
constant.language.boolean#3366ff
keyword, storage#6d1cb9
storage.type, support.type#cd1669
constant.language, support.constant, variable.language#22a6cd
variable, support.variable#6727bf
entity.name.function, support.function#09c598bold
entity.name.type, entity.other.inherited-class, support.class#8a3Eccbold
entity.name.exception#fa2573
entity.name.sectionbold
constant.numeric, constant.character, constant#407acd
string#cc1336
constant.character.escape#000000
string.regexp#407acd
constant.other.symbol#22a6cd
punctuation#333333
meta.tag.sgml.doctype, meta.tag.sgml.doctype string, meta.tag.sgml.doctype entity.name.tag, meta.tag.sgml punctuation.definition.tag.html#da3156
meta.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html#334455
entity.name.tag#22a6cd
meta.tag entity.other.attribute-name, entity.other.attribute-name.html#cc1336italic
constant.character.entity, punctuation.definition.entity#407acd
meta.selector, meta.selector entity, meta.selector entity punctuation, entity.name.tag.css#6A3Ecc
meta.property-name, support.type.property-name#cc1336
meta.property-value, meta.property-value constant.other, support.constant.property-value#000000
keyword.other.importantbold
markup.changed#67D9F0
markup.deleted#330000
markup.italicitalic
markup.error#cc4020
markup.inserted#62cc82
markup.output, markup.raw#6A3Ecc
markup.prompt#407acd
markup.heading#09c598bold
markup.boldbold
markup.traceback#660000
markup.underlineunderline
markup.quote#6A3EcD
markup.list#4B83CD
markup.bold, markup.italic#942C67
markup.inline.raw#854d1c
meta.paragraph.markdown#000000
meta.link, markup.underline.link.image.markdown, markup.underline.link.markdown#3366ff
markup.inline.raw.string.markdown, markup.fenced_code.block.markdown#444444
meta.diff.range, meta.diff.index, meta.separator#334455
meta.diff.header.from-file#334455
meta.diff.header.to-file#334455
fenced_code.block.language.attributes.markdown#000000italic