Skip to main content
CodingTheme

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.foreground#99d0f7
  • debugToolBar.background#BBB9B4
  • editor.background#FFFFFF
  • editor.foreground#236ebf
  • editor.lineHighlightBackground#eff2ef
  • editor.selectionBackground#cee1f0
  • editorCursor.foreground#4fb4d8
  • editorIndentGuide.activeBackground#2f86d2
  • editorIndentGuide.background#eff2ef
  • editorLineNumber.foreground#2f86d2
  • editorWhitespace.foreground#C4C5CD
  • gitDecoration.modifiedResourceForeground#2f86d2
  • gitDecoration.untrackedResourceForeground#189b2c
  • list.activeSelectionBackground#2f86d2
  • peekView.border#08134A
  • peekViewEditor.background#e3e3e3
  • peekViewEditor.matchHighlightBackground#D0CEC8
  • peekViewEditorGutter.background#e3e3e3
  • peekViewResult.background#e3e3e3
  • peekViewResult.lineForeground#2f86d2
  • sideBar.background#F3F3F3
  • sideBar.border#e3e3e3
  • statusBar.background#2f86d2
  • statusBar.debuggingBackground#b15a91
  • tab.inactiveBackground#CCCCCC

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#002339
meta.paragraph.markdown, string.other.link.description.title.markdown#110000
entity.name.section.markdown, punctuation.definition.heading.markdown#034c7c
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown, markup.quote.markdown#00AC8F
markup.quote.markdown#003494
markup.bold.markdown, punctuation.definition.bold.markdown#4e76b5bold
markup.italic.markdown, punctuation.definition.italic.markdown#C792EA
markup.inline.raw.string.markdown, markup.fenced_code.block.markdown#0460b1
punctuation.definition.metadata.markdown#00AC8F
markup.underline.link.image.markdown, markup.underline.link.markdown#924205
comment#357b42
string#a44185
constant.numeric#174781
constant#174781
language.method#174781
constant.character, constant.other#174781
variable#2f86d2
variable.language.this#000000
keyword#7b30d0
storage#da5221
storage.type#0991b6
entity.name.class#1172c7
entity.other.inherited-class#b02767
entity.name.function#b1108e
variable.parameter#b1108e
entity.name.tag#0444ac
text.html.basic#0071ce
entity.name.type#0444ac
entity.other.attribute-name#df8618
support.function#08134A
support.constant#174781
support.type, support.class#dc3eb7
support.other.variable#224555
invalid#207bb8 italic bold underline
invalid.deprecated#207bb8 bold italic underline
source.json support#6dbdfa
source.json string, source.json punctuation.definition.string#00820f
markup.list#207bb8
markup.heading punctuation.definition.heading, entity.name.section#4FB4D8
text.html.markdown meta.paragraph meta.link.inline, text.html.markdown meta.paragraph meta.link.inline punctuation.definition.string.begin.markdown, text.html.markdown meta.paragraph meta.link.inline punctuation.definition.string.end.markdown#87429A
markup.quote#87429A
markup.bold#08134Abold
markup.italic, punctuation.definition.italic#174781
meta.link#87429A

Shiki preview

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

Loading...

Old Winter is Coming Light Theme by Alexis Rico - VS Code Theme