Skip to main content
Coding Theme

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#fff
  • activityBar.foreground#000
  • activityBarBadge.background#0000000f
  • activityBarBadge.foreground#000000
  • badge.background#0000000f
  • button.background#000000
  • button.foreground#ffffffe8
  • commandCenter.background#fff
  • editor.background#ffffff
  • editor.foreground#000000
  • editor.selectionBackground#00000013
  • editorGutter.addedBackground#0007
  • editorGutter.modifiedBackground#0007
  • editorLineNumber.foreground#e8e8e8
  • list.activeSelectionBackground#00000028
  • list.activeSelectionForeground#000
  • list.activeSelectionIconForeground#000
  • scrollbarSlider.background#00000015
  • statusBar.background#f2f2f2
  • statusBar.border#00000012
  • statusBar.foreground#9e9e9e
  • titleBar.activeBackground#ffffff00

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
meta.import, keyword.control#9f9f9f
meta.import, variable.other.readwrite.alias#000000bold
meta.import, punctuation.definition.block.tsx, meta.block#878787
meta.import, string#878787
comment, punctuation.definition.comment#d0d0d0italic
variable.other.constant.tsx, entity.name.function.tsx, entity.name.tag.tsx, constant.numeric.decimal.tsx#000000bold
storage.type.tsx, meta.var.expr.tsx, meta.function.expression.tsx, punctuation.definition.string#9f9f9f
storage.type.function.tsx, meta.parameters.tsx, variable.other.object.tsx, variable.other.object.property.tsx, variable.other.property.tsx, string.quoted.double.tsx, variable.other.readwrite.tsx#000000
mono24 by Sam Apostel - VS Code Theme