Skip to main content
CodingTheme

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#1c1b19
  • activityBarBadge.background#1c1b19
  • activityBarBadge.foreground#fce8c3
  • button.background#2c78bf
  • button.hoverbackground#68a8e4
  • editor.background#1c1b19
  • editor.foreground#fce8c3
  • editor.lineHighlightBackground#2d2d2d
  • editor.selectionBackground#5B6A28
  • editorCursor.foreground#98bc37
  • editorLink.activeForeground#2c78bf
  • editorSuggestWidget.background#2D2D2D
  • editorSuggestWidget.border#2d2c29
  • editorSuggestWidget.foreground#fce8c3
  • editorSuggestWidget.selectedBackground#2d2c29
  • editorWhitespace.foreground#3B3A32
  • input.background#1c1b19
  • list.activeSelectionBackground#1c1b19
  • list.activeSelectionForeground#fce8c3
  • list.hoverBackground#2d2c29
  • list.inactiveSelectionBackground#1c1b19
  • peekView.border#75715E
  • peekViewEditor.background#272822
  • peekViewEditor.matchHighlightBackground#00080e
  • peekViewEditor.matchHighlightBorder#e02c6d
  • peekViewEditorGutter.background#00080e
  • peekViewResult.background#1e1f1c
  • peekViewResult.fileForeground#fce8c3
  • peekViewResult.lineForeground#75715E
  • peekViewResult.matchHighlightBackground#e02c6d
  • peekViewResult.selectionBackground#414339
  • peekViewResult.selectionForeground#fce8c3
  • peekViewTitle.background#1e1f1c
  • peekViewTitleDescription.foreground#918175
  • peekViewTitleLabel.foreground#fce8c3
  • scrollbarSlider.background#2D2D2D
  • sideBar.background#2D2D2D
  • sideBar.foreground#fce8c3
  • sideBarSectionHeader.background#1c1b19
  • sideBarSectionHeader.foreground#fce8c3
  • statusBar.background#2d2c29
  • statusBar.foreground#fce8c3
  • tab.activeForeground#fce8c3
  • tab.inactiveForeground#fce8c3
  • terminal.ansiBlack#1c1b19
  • terminal.ansiBlue#2c78bf
  • terminal.ansiBrightBlack#2d2c29
  • terminal.ansiBrightBlue#68a8e4
  • terminal.ansiBrightCyan#53fde9
  • terminal.ansiBrightGreen#98bc37
  • terminal.ansiBrightMagenta#ff5c8f
  • terminal.ansiBrightRed#f75341
  • terminal.ansiBrightWhite#fce8c3
  • terminal.ansiBrightYellow#fed06e
  • terminal.ansiCyan#0aaeb3
  • terminal.ansiGreen#519f50
  • terminal.ansiMagenta#e02c6d
  • terminal.ansiRed#ef2f27
  • terminal.ansiWhite#918175
  • terminal.ansiYellow#fbb829
  • terminal.background#1c1b19
  • terminal.foreground#fce8c3
  • terminalCursor.foreground#6A7C2A
  • titleBar.activeForeground#918175
  • titleBar.inactiveForeground#fce8c3

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#fce8c3
comment#75715E
string#fbb829
constant.numeric#0aaeb3
constant.language#0aaeb3
constant.character, constant.other#0aaeb3
variable#9ebac2
keyword#ef2f27
storage#ef2f27
storage.type#2c78bfitalic
entity.name.class#519f50underline
entity.other.inherited-class#519f50italic underline
entity.name.function#519f50
variable.parameter#2c78bfitalic
entity.name.tag#ef2f27
entity.other.attribute-name#519f50
support.function#2c78bf
support.constant#2c78bf
support.type, support.class#2c78bfitalic
support.other.variable
invalid#F8F8F0
invalid.deprecated#F8F8F0
entity.name.section.markdown#ef2f27
punctuation.definition.heading.markdown#ef2f27
punctuation.definition.quote.begin.markdown#fbb829
punctuation.definition.list.begin.markdown#2c78bf
beginning.punctuation.definition.list.markdown#ef2f27
markup.inline.raw.string.markdown#fbb829
markup.italic.markdown#68a8e4italic
markup.bold.markdown#519f50bold
meta.diff, meta.diff.header#2c78bfitalic
markup.deleted#ef2f27
markup.changed#f75341
markup.inserted#519f50
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#2c78bf

Shiki preview

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

Loading...

Srcery by gagbo - VS Code Theme