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.activeBackground#b59e7a65
  • activityBar.activeBorder#b59e7a
  • activityBar.background#031c1f
  • activityBar.border#0c141f
  • activityBar.foreground#d7dae0
  • activityBarBadge.background#b59e7a
  • activityBarBadge.foreground#000000
  • button.background#052c31
  • button.hoverBackground#b59e7a00
  • checkbox.border#b59e7a
  • debugExceptionWidget.border#b59e7a
  • debugToolBar.border#b59e7a
  • dropdown.background#2a343e
  • dropdown.border#b59e7a
  • dropdown.listBackground#042327
  • editor.background#062626
  • editor.findMatchHighlightBackground#63878a8e
  • editor.foreground#c9b499
  • editor.lineHighlightBackground#ffffff00
  • editor.lineHighlightBorder#ffffff00
  • editor.rangeHighlightBackground#0000ff
  • editor.selectionBackground#0000ff
  • editor.selectionForeground#e0dede
  • editor.selectionHighlightBackground#63878a8e
  • editorCursor.background#000000
  • editorCursor.foreground#86e08f
  • editorGroup.border#052c31
  • editorGroup.dropBackground#63878a1a
  • editorGroupHeader.tabsBackground#042327
  • editorGutter.background#031c1f
  • editorIndentGuide.activeBackground1#e3e4e229
  • editorLineNumber.activeForeground#b59e7a
  • editorLineNumber.foreground#b59e7a65
  • editorRuler.foreground#00000029
  • editorSuggestWidget.background#042327
  • editorSuggestWidget.foreground#cccccc
  • editorSuggestWidget.highlightForeground#bdb395
  • editorSuggestWidget.selectedBackground#b59e7a65
  • focusBorder#ffffff00
  • input.background#2a343e
  • input.border#b59e7a
  • list.activeSelectionBackground#b59e7a
  • list.dropBackground#63878a1a
  • list.focusBackground#b59e7aa4
  • list.highlightForeground#bdb395
  • list.hoverBackground#b59e7a65
  • list.inactiveSelectionBackground#63878a1a
  • menu.border#b59e7a8a
  • menu.foreground#cccccc
  • menu.selectionBackground#b59e7a65
  • panel.border#b59e7a4b
  • panelSection.dropBackground#63878af1
  • panelTitle.activeForeground#bdb395
  • panelTitle.inactiveForeground#cccccc
  • peekView.border#052c31
  • peekViewEditor.background#0c141f
  • peekViewEditor.matchHighlightBackground#63878a8e
  • peekViewResult.background#0c141f
  • peekViewResult.selectionBackground#b59e7a
  • quickInputList.focusBackground#b59e7aa4
  • scrollbarSlider.background#b59e7aa4
  • scrollbarSlider.hoverBackground#b59e7a
  • sideBar.background#031c1f
  • sideBar.dropBackground#63878af1
  • sideBar.foreground#cccccc
  • sideBarSectionHeader.background#093136
  • sideBarSectionHeader.foreground#bdb395
  • sideBarTitle.foreground#bbbbbb
  • statusBar.background#b59e7a
  • statusBar.border#b59e7a
  • statusBar.debuggingBorder#b59e7a
  • statusBar.foreground#000000
  • statusBar.noFolderBackground#b59e7a
  • tab.activeBackground#093136
  • tab.activeForeground#ffffff
  • tab.border#052c31
  • tab.hoverBackground#093136
  • tab.inactiveBackground#042327
  • tab.inactiveForeground#cccccc
  • tab.unfocusedActiveBackground#b59e7a65
  • tab.unfocusedActiveForeground#cccccc94
  • terminal.foreground#c9b499
  • titleBar.activeBackground#031c1f
  • titleBar.border#052c31
  • titleBar.inactiveBackground#0c141f
  • window.activeBorder#09363b

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
invalid.illegal#FF0000—
source, meta, variable, variable.other, variable.other.readwrite, variable.other.constant, variable.other.property, variable.other.object, variable.other.member, variable.other.global, variable.other.local, variable.other.enummember, variable.parameter, variable.language, variable.function, variable.language.this, variable.language.self, punctuation, punctuation.definition, punctuation.separator, punctuation.terminator, punctuation.accessor, punctuation.section, keyword.operator, support, support.function, support.variable, support.constant, support.type.property-name, support.other, entity.name.label, entity.name.namespace, entity.other.attribute-name, entity.other.inherited-class, meta.object-literal.key, entity.name.function.call, entity.name.function.member, entity.name.function.member.static, entity.name.function.operator, entity.name.function.operator.member, entity.name.function.preprocessor, meta.function-call, meta.function-call.generic, meta.method-call, meta.function.call entity.name.function, meta.function-call entity.name.function, meta.method-call entity.name.function, entity.name.tag#C9B499—
keyword.control, keyword.other, keyword.declaration, keyword.import, keyword.function, keyword.operator.word, keyword.operator.new, keyword.operator.expression, keyword.operator.wordlike, storage, storage.type, storage.modifier, storage.type.function, storage.type.class, storage.type.struct, storage.type.enum, storage.type.union, storage.type.namespace, storage.type.annotation#CCCCCC—
storage.type.built-in, storage.type.built-in.primitive, storage.type.primitive, storage.type.core.rust, support.type.built-in, support.type.primitive, support.type.builtin#C9B499—
constant.numeric, constant.language, constant.language.boolean, constant.language.null, constant.language.undefined, constant.language.nan, constant.language.infinity#0FDFAF—
string, string.quoted, string.template, string.interpolated, string.unquoted, string.regexp, punctuation.definition.string, constant.character.escape, constant.other.placeholder, meta.string, storage.type.string, storage.type.format#0FDFAF—
comment, comment.line, comment.block, comment.block.documentation, comment.documentation, punctuation.definition.comment, string.quoted.docstring, string.quoted.docstring.multi, string.quoted.docstring.single, string.quoted.docstring punctuation.definition.string, string.quoted.docstring punctuation.definition.string.begin, string.quoted.docstring punctuation.definition.string.end#31B72C—
entity.name.function, entity.name.function.definition, entity.name.function.definition.special.member, entity.name.method, entity.name.type, entity.name.class, entity.name.type.class, entity.name.type.class.templated, entity.name.type.struct, entity.name.type.enum, entity.name.type.interface, entity.name.type.union, entity.name.type.trait, entity.name.type.typedef, entity.name.type.typealias, entity.name.type.parameter#E67D74—
token.info-token#6796E6—
token.warn-token#CD9731—
token.error-token#F44747—
token.debug-token#B267E6—
masepi-jblow by masepi - VS Code Theme