Skip to main content
Coding Theme

Color themes

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#0c0f17
  • activityBar.foreground#9aa5ce
  • activityBar.inactiveForeground#4b5469
  • activityBarBadge.background#7aa2f7
  • activityBarBadge.foreground#10131c
  • badge.background#7aa2f7
  • badge.foreground#10131c
  • button.background#7aa2f7
  • button.foreground#10131c
  • button.hoverBackground#89b4ff
  • dropdown.background#1a1f2e
  • dropdown.border#2a3147
  • editor.background#10131c
  • editor.findMatchBackground#3d59a155
  • editor.findMatchHighlightBackground#3d59a133
  • editor.foreground#d6deeb
  • editor.lineHighlightBackground#1a1f2e
  • editor.selectionBackground#2b3a67aa
  • editor.selectionHighlightBackground#2b3a6755
  • editorCursor.foreground#7aa2f7
  • editorGroup.border#1f2536
  • editorGroupHeader.tabsBackground#0c0f17
  • editorIndentGuide.activeBackground#3a4256
  • editorIndentGuide.background#1f2536
  • editorLineNumber.activeForeground#a3b1d6
  • editorLineNumber.foreground#4b5469
  • editorSuggestWidget.background#161a26
  • editorSuggestWidget.selectedBackground#1f2536
  • editorWhitespace.foreground#2a3147
  • editorWidget.background#161a26
  • focusBorder#2a3147
  • gitDecoration.addedResourceForeground#9ece6a
  • gitDecoration.deletedResourceForeground#f7768e
  • gitDecoration.modifiedResourceForeground#e0af68
  • gitDecoration.untrackedResourceForeground#7dcfff
  • input.background#1a1f2e
  • input.border#2a3147
  • input.foreground#d6deeb
  • inputOption.activeBorder#7aa2f7
  • list.activeSelectionBackground#1f2536
  • list.activeSelectionForeground#d6deeb
  • list.hoverBackground#161a26
  • list.inactiveSelectionBackground#161a26
  • panel.background#0c0f17
  • panel.border#1f2536
  • panelTitle.activeForeground#d6deeb
  • panelTitle.inactiveForeground#4b5469
  • peekViewEditor.background#10131c
  • peekViewResult.background#0c0f17
  • scrollbarSlider.activeBackground#3a4256
  • scrollbarSlider.background#2a314766
  • scrollbarSlider.hoverBackground#2a3147aa
  • sideBar.background#0c0f17
  • sideBar.foreground#9aa5ce
  • sideBarSectionHeader.background#10131c
  • sideBarTitle.foreground#d6deeb
  • statusBar.background#0c0f17
  • statusBar.debuggingBackground#bb9af7
  • statusBar.debuggingForeground#10131c
  • statusBar.foreground#9aa5ce
  • statusBar.noFolderBackground#0c0f17
  • tab.activeBackground#10131c
  • tab.activeBorderTop#7aa2f7
  • tab.activeForeground#d6deeb
  • tab.border#0c0f17
  • tab.inactiveBackground#0c0f17
  • tab.inactiveForeground#4b5469
  • terminal.ansiBlue#7aa2f7
  • terminal.ansiCyan#7dcfff
  • terminal.ansiGreen#9ece6a
  • terminal.ansiMagenta#bb9af7
  • terminal.ansiRed#f7768e
  • terminal.ansiYellow#e0af68
  • terminal.background#10131c
  • terminal.foreground#d6deeb
  • titleBar.activeBackground#0c0f17
  • titleBar.activeForeground#d6deeb
  • titleBar.inactiveBackground#0c0f17
  • titleBar.inactiveForeground#4b5469
  • widget.shadow#00000066

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#5a6488italic
string, string.quoted#9ece6a
constant.numeric, constant.language, constant.character#ff9e64
keyword, storage.type, storage.modifier#bb9af7italic
entity.name.function, support.function#7aa2f7
entity.name.class, entity.name.type, support.class#7dcfffbold
variable, variable.parameter#d6deeb
variable.other.property, variable.other.object.property#a3b1d6
entity.other.attribute-name, entity.name.tag#f7768e
punctuation, meta.brace#7c89b3
markup.bold#e0af68bold
markup.italic#bb9af7italic
markup.heading#7aa2f7bold
Galaxy Themes HD by hmdalvin - VS Code Theme