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#1f2527
  • activityBar.foreground#d7dae028
  • activityBarBadge.background#81969a
  • activityBarBadge.foreground#293134
  • badge.background#81969a70
  • badge.foreground#293134
  • button.background#333333
  • button.foreground#777777
  • dropdown.background#333333
  • dropdown.border#293134
  • dropdown.foreground#777777
  • dropdown.listBackground#616161
  • editor.background#222525
  • editor.findMatchBackground#fcb65070
  • editor.findMatchHighlightBackground#fbff0050
  • editor.lineHighlightBackground#293134
  • editor.lineHighlightBorder#293134
  • editor.selectionBackground#97ccf130
  • editor.selectionForeground#fafafa
  • editorBracketMatch.background#678cb170
  • editorBracketMatch.border#678cb170
  • editorCursor.background#fafafa
  • editorCursor.foreground#678cb1
  • editorError.foreground#e15a60
  • editorGroup.border#293134
  • editorGroupHeader.tabsBackground#282929
  • editorIndentGuide.activeBackground#61616130
  • editorIndentGuide.background#29313400
  • editorLineNumber.activeForeground#616161
  • editorLineNumber.foreground#61616130
  • editorOverviewRuler.addedForeground#293134
  • editorOverviewRuler.border#293134
  • editorOverviewRuler.bracketMatchForeground#293134
  • editorOverviewRuler.deletedForeground#293134
  • editorOverviewRuler.findMatchForeground#fbff00
  • editorOverviewRuler.modifiedForeground#293134
  • editorOverviewRuler.wordHighlightForeground#fbff00
  • editorRuler.foreground#61616130
  • editorWhitespace.foreground#61616130
  • focusBorder#29313400
  • foreground#5a5a5a
  • icon.foreground#444444
  • input.background#333333
  • input.foreground#777777
  • inputOption.activeBorder#1f2527
  • inputValidation.errorBackground#3a0707
  • inputValidation.errorBorder#3a0707
  • inputValidation.infoBorder#1f2527
  • list.activeSelectionBackground#81969a70
  • list.activeSelectionForeground#fafafa
  • panel.border#222525
  • panelTitle.activeForeground#777777
  • panelTitle.inactiveForeground#333333
  • progressBar.background#fcb650
  • scrollbar.shadow#00000000
  • scrollbarSlider.activeBackground#1f252770
  • scrollbarSlider.background#1f252770
  • scrollbarSlider.hoverBackground#1f252770
  • selection.background#ce2c6230
  • sideBar.background#222525
  • sideBar.border#222525
  • sideBar.dropBackground#293134
  • sideBar.foreground#616161
  • sideBarSectionHeader.background#1f2527
  • sideBarSectionHeader.foreground#293134
  • sideBarTitle.foreground#616161
  • statusBar.background#000000
  • statusBar.foreground#616161
  • tab.activeBackground#222525
  • tab.activeForeground#777777
  • tab.border#293134
  • tab.inactiveBackground#282929
  • tab.inactiveForeground#61616170
  • tab.unfocusedActiveForeground#ffffff70
  • tab.unfocusedInactiveForeground#282929
  • terminal.foreground#777777
  • terminal.selectionBackground#2f3030
  • titleBar.activeBackground#222525
  • widget.shadow#1f2527

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, comment punctuation#5D6971—
comment.block.preprocessor#5D6971
string, meta.property-value.string, support.constant.property-value.string#FCB650—
constant.numeric, meta.property-value.numeric, support.constant.property-value.numeric, meta.property-value.color, support.constant.property-value.color#FCB650—
constant.language#87BCD1—
constant.character, constant.other#678CB1—
keyword, meta.property-value.keyword, support.constant.property-value.keyword#97CCF1—
storage#678CB1—
storage.type#678CB1—
entity.name.class#FAFAFA—
entity.other.inherited-class#FAFAFA—
entity.name.function#E0E2E4—
variable.parameter#E0E2E4—
entity.name.tag#FAFAFA
entity.other.attribute-name#E0E2E4—
support.function#E0E2E4
support.constant#E0E2E4—
support.type, support.class#E0E2E4—
invalid#F8F8F0
invalid.deprecated#F8F8F0—
meta.structure.dictionary.json string.quoted.double.json#B0A17D—
meta.diff, meta.diff.header#75715E—
markup.deleted#A6E22E—
markup.inserted#F85931—
markup.changed#E6DB74—
entity.name.filename.find-in-files#E6DB74—
keyword.other#E0E2E4—
meta.property-value, support.constant.property-value#BFBCB6—
meta.structure.dictionary.json string.quoted.double.json#678CB1—
meta.structure.dictionary.value.json string.quoted.double.json#F0F0F0—
entity.name, entity.other.attribute-name, entity.other.attribute-name.html, support.type.property-name, entity.name.tag.table#9DA9B1normal
meta.property-value punctuation.separator.key-value#7D8991—
keyword.other.use, keyword.other.function.use, keyword.other.namespace, keyword.other.new, keyword.other.special-method, keyword.other.unit, keyword.other.use-as#FF8F2E—
variable.parameter.function.coffee#FFE32Eitalic
entity.name.section.md, entity.name.type.md#7D8991—
punctuation.definition.heading.md, entity.name.type.md#7D8991—
markup.raw.inline.md, variable.md#CFCCC6—
punctuation.definition.metadata.md, string.link.md#B8A07D—
markup.underline.link.md, markup.underline.link.image.md, meta.image.inline.mamdrkdown#FF8F2Eitalic
markup.raw.block.md#00A8C6—
markup.deleted.git_gutter#E61F44—
markup.inserted.git_gutter#A7DA1E—
markup.changed.git_gutter#F7B83D—
entity.other.attribute-name.class.css#CFCCC6—
punctuation, keyword.operator, delimiter.tag, punctuation.tag, tag.xml, tag.html#FAFAFA—
tag.xml, tag.html#7D8991—
variable#FAFAFA—
variable.language.makefile, variable.other.makefile#7D8991—
delimiter#678CB1—
meta.property-name.css#7D8991—
string#028146—
meta.embedded.assembly#028146—
keyword - keyword.operator#AAAAAA—
keyword.control#AAAAAA—
storage#AAAAAA—
storage.type#AAAAAA—
entity.name.function#AAAAAA—
support.function#AAAAAA—
variable#AAAAAA—
entity.name.variable#AAAAAA—
comment, comment punctuation#7C7C7C—
punctuation#777777—
constant.language#D87300—
keyword.other#AAAAAA—
token.info-token#6796E6—
token.warn-token#CD9731—
token.error-token#F44747—
token.debug-token#B267E6—
string#007733—
meta.embedded.assembly#007733—
keyword - keyword.operator#999999—
keyword.control#999999—
storage#999999—
storage.type#999999—
entity.name.function#AAAAAA—
support.function#AAAAAA—
variable#999999—
entity.name.variable#999999—
comment, comment punctuation#555555—
keyword.other.unit#EE7700—
constant.numeric, meta.property-value.numeric, support.constant.property-value.numeric, meta.property-value.color, support.constant.property-value.color#D87300—
meta.structure.dictionary.json string.quoted.double.json#EE0E0E—
meta.structure.dictionary.json string.quoted.double.json#C20B24—
meta.structure.dictionary.value.json string.quoted.double.json#999999—
punctuation#777777—
constant.language#EE7700—
keyword.other#AAAAAA—
!rococo by skra - VS Code Theme