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#2D2D3F
  • activityBar.foreground#F8F8F8
  • activityBar.inactiveForeground#9F9FA6
  • activityBarBadge.background#F47A97
  • diffEditor.insertedTextBackground#94C97920
  • diffEditor.removedTextBackground#EA7F6A20
  • editor.background#2D2D3F
  • editor.foreground#65A1A8
  • editor.hoverHighlightBackground#65A1A820
  • editor.lineHighlightBorder#65A1A820
  • editor.selectionBackground#65A1A840
  • editorCursor.background#F47A97
  • editorError.foreground#EA7F6A
  • editorGutter.addedBackground#94C979
  • editorGutter.deletedBackground#EA7F6A
  • editorGutter.modifiedBackground#FFC166
  • editorHint.foreground#92D6F4
  • editorInfo.foreground#94C979
  • editorLineNumber.activeForeground#F47A97
  • editorLineNumber.foreground#616166
  • editorLink.activeForeground#92D6F4
  • editorOverviewRuler.addedForeground#94C979AA
  • editorOverviewRuler.deletedForeground#EA7F6AAA
  • editorOverviewRuler.findMatchForeground#F47A97AA
  • editorOverviewRuler.modifiedForeground#FFC166AA
  • editorWarning.foreground#FFC166
  • foreground#F8F8F8
  • gitDecoration.addedResourceForeground#94C979
  • gitDecoration.conflictingResourceForeground#EA7F6A
  • gitDecoration.deletedResourceForeground#EA7F6A
  • gitDecoration.ignoredResourceForeground#9F9FA6
  • gitDecoration.modifiedResourceForeground#FFC166
  • gitDecoration.untrackedResourceForeground#94C979
  • input.background#65A1A810
  • input.border#2D2D3F
  • inputOption.activeBorder#F47A97
  • list.activeSelectionBackground#65A1A840
  • list.focusBackground#65A1A840
  • list.hoverBackground#65A1A810
  • list.inactiveSelectionBackground#65A1A820
  • sideBar.background#2D2D3F
  • statusBar.background#2D2D3F
  • statusBar.debuggingBackground#FFC166
  • statusBar.debuggingForeground#2D2D3F

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#9F9FA6italic
meta.separator#9F9FA6
constant#EA7F6A
support.constant#EA7F6A
entity.name.tag#EA7F6A
variable.language.this#EA7F6A
markup.heading#EA7F6A
entity.name.section.group-title#EA7F6A
punctuation.definition.template-expression#EA7F6A
support.type.object.module#EA7F6A
keyword.other.important#EA7F6A
keyword.operator#EA7F6A
string#94C979
markup.inline.raw.string#94C979
markup.bold#94C979
markup.italic#94C979italic
variable#F47A97
support.variable#F47A97
variable.parameteritalic
entity.other.attribute-name#F47A97italic
punctuation.definition.list#F47A97
keyword.other.definition#F47A97
meta.object-literal.key#F47A97
support.function#92D6F4
markup.underline.link#92D6F4
entity.name.function#92D6F4
keyword.control.at-rule#92D6F4
support.class#FFC166
entity.name.type#FFC166
entity.other.inherited-class#FFC166
support.type.primitive#FFC166

Shiki preview

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

Loading...

Forge Theme by Forge - VS Code Theme