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#F0F0F0
  • activityBar.border#F0F0F0
  • activityBar.foreground#007ACC
  • breadcrumb.background#f5f5f5
  • editor.background#f5f5f5
  • editor.findMatchBackground#FFBC5D
  • editor.findMatchHighlightBackground#FFD86381
  • editor.foreground#333333
  • editor.lineHighlightBackground#F0F0F0
  • editor.selectionBackground#BFDBFE
  • editor.selectionHighlightBackground#CFCFCF81
  • editorCursor.foreground#007ACC
  • editorGroupHeader.border#f5f5f5
  • editorGroupHeader.tabsBackground#F0F0F0
  • editorGroupHeader.tabsBorder#f5f5f5
  • editorLineNumber.activeForeground#000
  • editorLineNumber.foreground#9DA39A
  • editorOverviewRuler.border#F0F0F0
  • errorForeground#AA3731
  • focusBorder#ff000000
  • gitDecoration.modifiedResourceForeground#4B83CD
  • list.activeSelectionBackground#DDDDDD
  • list.activeSelectionForeground#000000
  • list.focusHighlightForeground#007ACC
  • list.inactiveSelectionBackground#E6E6E6
  • panel.background#F0F0F0
  • panel.border#DDDDDD
  • quickInputList.focusBackground#E8E8E8
  • scrollbar.shadow#ff000000
  • sideBar.background#F0F0F0
  • sideBar.border#F0F0F0
  • sideBarSectionHeader.background#DDDDDD
  • sideBarSectionHeader.border#DDDDDD
  • sideBarSectionHeader.foreground#333333
  • statusBar.background#DDDDDD
  • statusBar.debuggingBackground#FFBC5D
  • statusBar.debuggingForeground#000
  • statusBar.foreground#474747
  • statusBar.noFolderBackground#7A3E9D
  • statusBar.noFolderForeground#fff
  • statusBarItem.remoteBackground#DDDDDD
  • statusBarItem.remoteForeground#333333
  • tab.border#ECECEC
  • tab.inactiveBackground#F0F0F0
  • titleBar.activeBackground#F0F0F0
  • titleBar.inactiveBackground#F0F0F0
  • widget.shadow#DDDDDD

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment, string.quoted.docstring#AAAAAA
comment.block.preprocessor#AAAAAA
comment.documentation, comment.block.documentation#AAAAAA
invalid.illegal#AA3731
keyword.operator#777777
keyword, storage#4B83CD
storage.type#4B83CD
constant.other.caps#333333
constant.language, support.constant#AB6526
entity.name.exception#AA3731
entity.name.sectionbold
constant.numeric, constant.character, constant#AB6526
string#448C27
constant.character.escape#777777
string.regexp#4B83CD
constant.other.symbol#AB6526
punctuation#777777
meta.tag.sgml.doctype, meta.tag.sgml.doctype string, meta.tag.sgml.doctype entity.name.tag, meta.tag.sgml punctuation.definition.tag.html#AAAAAA
entity.name.tag#4B83CD
punctuation.definition.entity#777777
meta.selector, meta.selector entity, meta.selector entity punctuation, entity.name.tag.css#4B83CD
support.type.property-name.json#333333
meta.property-name, support.constant.property-value#AB6526
keyword.other.importantbold
markup.changed#000000
markup.deleted#000000
markup.italicitalic
markup.error#AA3731
markup.inserted#000000
meta.link, markup.underline.link#4B83CD
string.other.link.title.markdown, string.other.link.description.markdown#333333
markup.output, markup.raw#777777
markup.prompt#777777
markup.heading#4B83CD
markup.boldbold
markup.traceback#AA3731
markup.underlineunderline
markup.quote#7A3E9D
markup.inline.raw#AB6526
meta.diff.range, meta.diff.index, meta.separator#434343
meta.diff.header.from-file#434343
meta.diff.header.to-file#434343
Magalie Theme by Leva Ginzburg - VS Code Theme