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.activeBackground#FBEFF5
  • activityBar.activeBorder#C58DB5
  • activityBar.background#FBF4F9
  • activityBar.border#EADDE5
  • activityBar.foreground#7A6E82
  • activityBar.inactiveForeground#B8AAB8
  • activityBarBadge.background#B9CCED
  • activityBarBadge.foreground#2A2733
  • badge.background#B9CCED
  • badge.foreground#2A2733
  • breadcrumb.activeSelectionForeground#3A3340
  • breadcrumb.background#FBF4F9
  • breadcrumb.focusForeground#C58DB5
  • breadcrumb.foreground#8A7E92
  • button.background#C58DB5
  • button.foreground#FFFFFF
  • button.hoverBackground#B97DA8
  • button.secondaryBackground#EADDE5
  • button.secondaryForeground#3A3340
  • button.secondaryHoverBackground#E0CFDC
  • contrastBorder#EADDE5
  • debugExceptionWidget.background#FBEFF5
  • debugExceptionWidget.border#EADDE5
  • debugTokenExpression.boolean#91A9D8
  • debugTokenExpression.error#D2738F
  • debugTokenExpression.name#A8A6D8
  • debugTokenExpression.number#91A9D8
  • debugTokenExpression.string#CFAFAF
  • debugTokenExpression.value#C58DB5
  • debugToolBar.background#FBEFF5
  • diffEditor.insertedLineBackground#7FA98C20
  • diffEditor.insertedTextBackground#7FA98C30
  • diffEditor.removedLineBackground#D2738F20
  • diffEditor.removedTextBackground#D2738F30
  • dropdown.background#FFFFFF
  • dropdown.border#EADDE5
  • dropdown.foreground#3A3340
  • editor.background#F6E5F5
  • editor.findMatchBackground#E6D6A870
  • editor.findMatchHighlightBackground#E6D6A840
  • editor.foreground#3A3340
  • editor.inactiveSelectionBackground#EADDE540
  • editor.lineHighlightBackground#FBEFF570
  • editor.lineHighlightBorder#00000000
  • editor.linkedEditingBackground#EADDE540
  • editor.rangeHighlightBackground#EADDE530
  • editor.selectionBackground#E1CCEC80
  • editor.selectionHighlightBackground#EADDE540
  • editor.symbolHighlightBackground#EADDE540
  • editorBracketMatch.background#B9CCED30
  • editorBracketMatch.border#B9CCED
  • editorCursor.foreground#C58DB5
  • editorError.foreground#D2738F
  • editorGroup.border#EADDE5
  • editorGroupHeader.noTabsBackground#FBF4F9
  • editorGroupHeader.tabsBackground#FBF4F9
  • editorGutter.background#F6E5F5
  • editorHoverWidget.background#FBEFF5
  • editorHoverWidget.border#EADDE5
  • editorIndentGuide.activeBackground#D9C6DB
  • editorIndentGuide.background#EADDE5
  • editorLineNumber.activeForeground#C58DB5
  • editorLineNumber.foreground#B8AAB8
  • editorMarkerNavigation.background#FBEFF5
  • editorOverviewRuler.addedForeground#7FA98C
  • editorOverviewRuler.border#EADDE5
  • editorOverviewRuler.deletedForeground#D2738F
  • editorOverviewRuler.errorForeground#D2738F
  • editorOverviewRuler.infoForeground#91A9D8
  • editorOverviewRuler.modifiedForeground#C9A86B
  • editorOverviewRuler.warningForeground#C9A86B
  • editorRuler.foreground#EADDE5
  • editorSuggestWidget.background#FBEFF5
  • editorSuggestWidget.border#EADDE5
  • editorSuggestWidget.highlightForeground#C58DB5
  • editorSuggestWidget.selectedBackground#EADDE570
  • editorWarning.foreground#C9A86B
  • editorWhitespace.foreground#E0CFDC
  • editorWidget.background#FBEFF5
  • editorWidget.border#EADDE5
  • editorWidget.resizeBorder#B9CCED
  • focusBorder#B9CCED
  • foreground#3A3340
  • gitDecoration.addedResourceForeground#7FA98C
  • gitDecoration.conflictingResourceForeground#C58DB5
  • gitDecoration.deletedResourceForeground#D2738F
  • gitDecoration.ignoredResourceForeground#B8AAB8
  • gitDecoration.modifiedResourceForeground#C9A86B
  • gitDecoration.untrackedResourceForeground#A8A6D8
  • input.background#FFFFFF
  • input.border#EADDE5
  • input.foreground#3A3340
  • input.placeholderForeground#B8AAB8
  • inputOption.activeBorder#C58DB5
  • inputValidation.errorBackground#F3D6DE
  • inputValidation.errorBorder#D2738F
  • inputValidation.errorForeground#7A3548
  • inputValidation.infoBackground#B9CCED
  • inputValidation.infoBorder#91A9D8
  • inputValidation.infoForeground#2A2733
  • inputValidation.warningBackground#F2E3C7
  • inputValidation.warningBorder#C9A86B
  • inputValidation.warningForeground#6B5836
  • list.activeSelectionBackground#EADDE580
  • list.activeSelectionForeground#3A3340
  • list.dropBackground#EADDE560
  • list.errorForeground#D2738F
  • list.focusBackground#EADDE570
  • list.highlightForeground#C58DB5
  • list.hoverBackground#EADDE540
  • list.inactiveSelectionBackground#EADDE560
  • menu.background#FBF4F9
  • menu.foreground#3A3340
  • menu.selectionBackground#EADDE570
  • menu.selectionForeground#3A3340
  • menu.separatorBackground#EADDE5
  • notifications.background#FBF4F9
  • notifications.border#EADDE5
  • notifications.foreground#3A3340
  • panel.background#F6E7E6
  • panel.border#EADDE5
  • panelInput.border#EADDE5
  • panelTitle.activeForeground#3A3340
  • panelTitle.inactiveForeground#8A7E92
  • peekView.border#EADDE5
  • peekViewEditor.background#FBEFF5
  • peekViewEditor.matchHighlightBackground#E6D6A870
  • peekViewResult.background#FBEFF5
  • peekViewResult.selectionBackground#EADDE570
  • peekViewTitle.background#F6E5F5
  • progressBar.background#C58DB5
  • scrollbarSlider.activeBackground#C58DB5B0
  • scrollbarSlider.background#E0CFDC80
  • scrollbarSlider.hoverBackground#D9C6DBB0
  • selection.background#E1CCEC80
  • sideBar.background#FBEFF5
  • sideBar.border#EADDE5
  • sideBar.foreground#3A3340
  • sideBarSectionHeader.background#F6E5F5
  • sideBarSectionHeader.border#EADDE5
  • sideBarSectionHeader.foreground#7A6E82
  • sideBarTitle.foreground#7A6E82
  • statusBar.background#B9CCED
  • statusBar.border#EADDE5
  • statusBar.debuggingBackground#C58DB5
  • statusBar.foreground#2A2733
  • statusBar.noFolderBackground#B9CCED
  • statusBarItem.hoverBackground#00000012
  • statusBarItem.remoteBackground#A8A6D8
  • statusBarItem.remoteForeground#2A2733
  • tab.activeBackground#F6E5F5
  • tab.activeBorder#C58DB5
  • tab.activeForeground#3A3340
  • tab.border#EADDE5
  • tab.hoverBackground#FBEFF5
  • tab.inactiveBackground#FBF4F9
  • tab.inactiveForeground#8A7E92
  • tab.unfocusedActiveBorder#D9C6DB
  • tab.unfocusedActiveForeground#3A3340
  • tab.unfocusedInactiveForeground#8A7E92
  • terminal.ansiBlack#3A3340
  • terminal.ansiBlue#91A9D8
  • terminal.ansiBrightBlack#6A6072
  • terminal.ansiBrightBlue#A9BEE6
  • terminal.ansiBrightCyan#AED3DB
  • terminal.ansiBrightGreen#9CC4AB
  • terminal.ansiBrightMagenta#D9A6C7
  • terminal.ansiBrightRed#E08DA4
  • terminal.ansiBrightWhite#B8AAB8
  • terminal.ansiBrightYellow#DCC089
  • terminal.ansiCyan#8FB8C2
  • terminal.ansiGreen#7FA98C
  • terminal.ansiMagenta#C58DB5
  • terminal.ansiRed#D2738F
  • terminal.ansiWhite#8A7E92
  • terminal.ansiYellow#C9A86B
  • terminal.background#F6E5F5
  • terminal.foreground#3A3340
  • terminalCursor.foreground#C58DB5
  • titleBar.activeBackground#FBF4F9
  • titleBar.activeForeground#3A3340
  • titleBar.border#EADDE5
  • titleBar.inactiveBackground#FBF4F9
  • titleBar.inactiveForeground#8A7E92
  • walkThrough.embeddedEditorBackground#F6E5F5
  • welcomePage.background#FBF4F9

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#B8AAB8italic
string#CFAFAF
string.regexp#CFAFAF
constant.numeric#91A9D8
constant.language#91A9D8
constant.character.escape#C58DB5
keyword#C58DB5
keyword.control#C58DB5
keyword.operator#A8A6D8
storage#C58DB5
storage.type#C58DB5
entity.name.function#A8A6D8
support.function#A8A6D8
entity.name.type#91A9D8
entity.name.class#91A9D8
entity.name.namespace#91A9D8
entity.other.attribute-name#C58DB5
variable#3A3340
variable.parameter#7A6E82
support.type#91A9D8
support.class#91A9D8
support.constant#91A9D8
entity.name.tag#C58DB5
meta.tag#7A6E82
punctuation.definition.tag#B8AAB8
markup.bold#C58DB5bold
markup.italicitalic
markup.heading#91A9D8bold
markup.link#91A9D8
invalid#D2738F
meta.diff.header#B8AAB8
Blush Cloud Theme by lilin - VS Code Theme