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.activeBorder#E25DB9
  • activityBar.background#0D0008
  • activityBar.border#1E0414
  • activityBar.foreground#DD73AF
  • activityBar.inactiveForeground#976E89
  • activityBarBadge.background#E25DB9
  • activityBarBadge.foreground#190310
  • badge.background#E25DB9
  • badge.foreground#190310
  • breadcrumb.activeSelectionForeground#E084C9
  • breadcrumb.background#0D0008
  • breadcrumb.focusForeground#FAEBFA
  • breadcrumb.foreground#B487A6
  • button.background#E25DB9
  • button.foreground#190310
  • button.hoverBackground#DF7CC3
  • button.secondaryBackground#491133
  • button.secondaryForeground#F6DEF6
  • button.secondaryHoverBackground#5F1742
  • checkbox.background#190310
  • checkbox.border#491133
  • checkbox.foreground#E084C9
  • diffEditor.border#330A20
  • diffEditor.diagonalFill#491133
  • diffEditor.insertedLineBackground#6FDDB114
  • diffEditor.insertedTextBackground#6FDDB11F
  • diffEditor.insertedTextBorder#6FDDB159
  • diffEditor.removedLineBackground#DB6E7B14
  • diffEditor.removedTextBackground#DB6E7B26
  • diffEditor.removedTextBorder#DB6E7B59
  • diffEditor.unchangedRegionBackground#12010B
  • diffEditor.unchangedRegionForeground#B487A6
  • diffEditorGutter.insertedLineBackground#6FDDB11A
  • diffEditorGutter.removedLineBackground#DB6E7B1A
  • diffEditorOverview.insertedForeground#6FDDB1CC
  • diffEditorOverview.removedForeground#DB6E7BCC
  • dropdown.background#190310
  • dropdown.border#491133
  • dropdown.foreground#FAEBFA
  • dropdown.listBackground#12010B
  • editor.background#0D0008
  • editor.findMatchBackground#A52B74
  • editor.findMatchBorder#E25DB9
  • editor.findMatchHighlightBackground#E25DB94D
  • editor.findMatchHighlightBorder#E25DB980
  • editor.findRangeHighlightBackground#E25DB91A
  • editor.foreground#FAEBFA
  • editor.hoverHighlightBackground#E25DB926
  • editor.inactiveSelectionBackground#330A20
  • editor.lineHighlightBackground#330A20
  • editor.rangeHighlightBackground#E25DB91A
  • editor.selectionBackground#49112D
  • editor.selectionHighlightBackground#E25DB933
  • editor.selectionHighlightBorder#E25DB966
  • editor.wordHighlightBackground#E25DB933
  • editor.wordHighlightStrongBackground#E25DB94D
  • editorBracketHighlight.foreground1#E25DB9
  • editorBracketHighlight.foreground2#E8B2D2
  • editorBracketHighlight.foreground3#B98FD9
  • editorBracketHighlight.foreground4#7F92D3
  • editorBracketHighlight.foreground5#7ADBE3
  • editorBracketHighlight.foreground6#A6FBD5
  • editorBracketHighlight.unexpectedBracket.foreground#DB6E7B
  • editorBracketMatch.background#E25DB933
  • editorBracketMatch.border#E25DB9
  • editorCursor.foreground#E25DB9
  • editorError.background#DB6E7B14
  • editorError.foreground#DB6E7B
  • editorGroup.border#330A20
  • editorGroup.emptyBackground#0D0008
  • editorGroupHeader.noTabsBackground#0D0008
  • editorGroupHeader.tabsBackground#0D0008
  • editorGroupHeader.tabsBorder#1E0414
  • editorGutter.addedBackground#6FDDB1
  • editorGutter.background#0D0008
  • editorGutter.commentRangeForeground#976E89
  • editorGutter.deletedBackground#DB6E7B
  • editorGutter.modifiedBackground#B98FD9
  • editorHint.foreground#976E89
  • editorHoverWidget.background#190310
  • editorHoverWidget.border#491133
  • editorHoverWidget.foreground#FAEBFA
  • editorIndentGuide.activeBackground#701C4E
  • editorIndentGuide.activeBackground1#701C4E
  • editorIndentGuide.background#330A20
  • editorIndentGuide.background1#330A20
  • editorInfo.background#7ADBE314
  • editorInfo.foreground#7ADBE3
  • editorLineNumber.activeForeground#E7ABD8
  • editorLineNumber.foreground#A17593
  • editorMarkerNavigation.background#190310
  • editorMarkerNavigationError.background#DB6E7B
  • editorMarkerNavigationError.headerBackground#DB6E7B1A
  • editorMarkerNavigationInfo.background#7ADBE3
  • editorMarkerNavigationInfo.headerBackground#7ADBE31A
  • editorMarkerNavigationWarning.background#EBB984
  • editorMarkerNavigationWarning.headerBackground#EBB9841A
  • editorOverviewRuler.addedForeground#6FDDB1CC
  • editorOverviewRuler.border#330A20
  • editorOverviewRuler.commonContentForeground#EBB984CC
  • editorOverviewRuler.currentContentForeground#B98FD9CC
  • editorOverviewRuler.deletedForeground#DB6E7BCC
  • editorOverviewRuler.errorForeground#DB6E7BCC
  • editorOverviewRuler.findMatchForeground#E25DB9CC
  • editorOverviewRuler.incomingContentForeground#6FDDB1CC
  • editorOverviewRuler.infoForeground#7ADBE3CC
  • editorOverviewRuler.modifiedForeground#B98FD9CC
  • editorOverviewRuler.selectionHighlightForeground#E5A1DC99
  • editorOverviewRuler.warningForeground#EBB984CC
  • editorOverviewRuler.wordHighlightForeground#E084C999
  • editorRuler.foreground#330A20
  • editorSuggestWidget.background#190310
  • editorSuggestWidget.border#491133
  • editorSuggestWidget.focusHighlightForeground#E7ABDA
  • editorSuggestWidget.foreground#FAEBFA
  • editorSuggestWidget.highlightForeground#E084C9
  • editorSuggestWidget.selectedBackground#701C4E
  • editorSuggestWidget.selectedForeground#FFFFFF
  • editorWarning.background#EBB98414
  • editorWarning.foreground#EBB984
  • editorWhitespace.foreground#491133
  • editorWidget.background#190310
  • editorWidget.border#491133
  • editorWidget.foreground#FAEBFA
  • focusBorder#E25DB9
  • gitDecoration.addedResourceForeground#6FDDB1
  • gitDecoration.conflictingResourceForeground#EBB984
  • gitDecoration.deletedResourceForeground#DB6E7B
  • gitDecoration.ignoredResourceForeground#976E89
  • gitDecoration.modifiedResourceForeground#B98FD9
  • gitDecoration.stageDeletedResourceForeground#DE908A
  • gitDecoration.stageModifiedResourceForeground#CEAFE4
  • gitDecoration.submoduleResourceForeground#E39ECB
  • gitDecoration.untrackedResourceForeground#A6FBD5
  • input.background#190310
  • input.border#491133
  • input.foreground#FAEBFA
  • input.placeholderForeground#B487A6
  • inputOption.activeBackground#E25DB933
  • inputOption.activeBorder#E25DB9
  • inputOption.activeForeground#FFFFFF
  • inputValidation.errorBackground#481124
  • inputValidation.errorBorder#DB6E7B
  • inputValidation.infoBackground#193C44
  • inputValidation.infoBorder#7ADBE3
  • inputValidation.warningBackground#3F2814
  • inputValidation.warningBorder#EBB984
  • list.activeSelectionBackground#701C4E
  • list.activeSelectionForeground#FFFFFF
  • list.errorForeground#DB6E7B
  • list.focusBackground#5F1742
  • list.focusForeground#FAEBFA
  • list.focusOutline#E25DB9
  • list.highlightForeground#E084C9
  • list.hoverBackground#2E0920
  • list.hoverForeground#F6DEF6
  • list.inactiveSelectionBackground#491133
  • list.inactiveSelectionForeground#F6DEF6
  • list.warningForeground#EBB984
  • menu.background#190310
  • menu.border#491133
  • menu.foreground#FAEBFA
  • menu.selectionBackground#701C4E
  • menu.selectionForeground#FFFFFF
  • menu.separatorBackground#491133
  • menubar.selectionBackground#491133
  • menubar.selectionForeground#FAEBFA
  • merge.commonContentBackground#EBB98426
  • merge.commonHeaderBackground#EBB9844D
  • merge.currentContentBackground#B98FD926
  • merge.currentHeaderBackground#B98FD94D
  • merge.incomingContentBackground#6FDDB126
  • merge.incomingHeaderBackground#6FDDB14D
  • mergeEditor.change.background#6FDDB114
  • mergeEditor.change.word.background#6FDDB11F
  • mergeEditor.conflict.handledFocused.border#6FDDB1
  • mergeEditor.conflict.handledUnfocused.border#6FDDB159
  • mergeEditor.conflict.unhandledFocused.border#EBB984
  • mergeEditor.conflict.unhandledUnfocused.border#EBB98480
  • minimap.background#00000000
  • minimap.errorHighlight#DB6E7B
  • minimap.findMatchHighlight#E25DB9
  • minimap.selectionHighlight#E5A1DC
  • minimap.warningHighlight#EBB984
  • minimapGutter.addedBackground#6FDDB1
  • minimapGutter.deletedBackground#DB6E7B
  • minimapGutter.modifiedBackground#B98FD9
  • minimapSlider.activeBackground#E25DB96E
  • minimapSlider.background#E25DB933
  • minimapSlider.hoverBackground#E25DB94D
  • notificationCenterHeader.background#1E0414
  • notificationCenterHeader.foreground#EFC8E1
  • notificationLink.foreground#E084C9
  • notifications.background#190310
  • notifications.border#491133
  • notifications.foreground#FAEBFA
  • notificationsErrorIcon.foreground#DB6E7B
  • notificationsInfoIcon.foreground#7ADBE3
  • notificationsWarningIcon.foreground#EBB984
  • panel.background#0D0008
  • panel.border#330A20
  • panelTitle.activeBorder#E25DB9
  • panelTitle.activeForeground#E39ECB
  • panelTitle.inactiveForeground#976E89
  • peekView.border#E25DB9
  • peekViewEditor.background#12010B
  • peekViewEditor.matchHighlightBackground#E25DB94D
  • peekViewResult.background#190310
  • peekViewResult.fileForeground#FAEBFA
  • peekViewResult.lineForeground#B487A6
  • peekViewResult.matchHighlightBackground#E25DB94D
  • peekViewResult.selectionBackground#701C4E
  • peekViewResult.selectionForeground#FFFFFF
  • peekViewTitle.background#190310
  • peekViewTitleDescription.foreground#B487A6
  • peekViewTitleLabel.foreground#FAEBFA
  • pickerGroup.border#491133
  • pickerGroup.foreground#E084C9
  • problemsErrorIcon.foreground#DB6E7B
  • problemsInfoIcon.foreground#7ADBE3
  • problemsWarningIcon.foreground#EBB984
  • quickInput.background#190310
  • quickInput.foreground#FAEBFA
  • quickInputList.focusBackground#701C4E
  • quickInputList.focusForeground#FFFFFF
  • scrollbarSlider.activeBackground#E25DB98C
  • scrollbarSlider.background#E25DB933
  • scrollbarSlider.hoverBackground#E25DB959
  • sideBar.background#0D0008
  • sideBar.border#1E0414
  • sideBar.foreground#EFC8E1
  • sideBarSectionHeader.background#12010B
  • sideBarSectionHeader.border#1E0414
  • sideBarSectionHeader.foreground#EFC8E1
  • sideBarTitle.foreground#E39ECB
  • statusBar.background#1E0414
  • statusBar.border#330A20
  • statusBar.debuggingBackground#701C4E
  • statusBar.debuggingBorder#E25DB9
  • statusBar.debuggingForeground#FAEBFA
  • statusBar.foreground#E190C8
  • statusBar.noFolderBackground#491133
  • statusBar.noFolderForeground#EFC8E1
  • statusBarItem.hoverBackground#E25DB926
  • statusBarItem.remoteBackground#E25DB9
  • statusBarItem.remoteForeground#190310
  • tab.activeBackground#12010B
  • tab.activeBorder#00000000
  • tab.activeBorderTop#E25DB9
  • tab.activeForeground#E39ECB
  • tab.border#190310
  • tab.hoverBackground#190310
  • tab.inactiveBackground#0D0008
  • tab.inactiveForeground#976E89
  • tab.unfocusedActiveBackground#100109
  • terminal.ansiBlack#1E0414
  • terminal.ansiBlue#8C7ACB
  • terminal.ansiBrightBlack#976E89
  • terminal.ansiBrightBlue#9E90D4
  • terminal.ansiBrightCyan#ADEEF2
  • terminal.ansiBrightGreen#98FBC6
  • terminal.ansiBrightMagenta#E293CC
  • terminal.ansiBrightRed#DE908A
  • terminal.ansiBrightWhite#FFFFFF
  • terminal.ansiBrightYellow#F3D5AB
  • terminal.ansiCyan#7ADBE3
  • terminal.ansiGreen#6FDDB1
  • terminal.ansiMagenta#E25DB9
  • terminal.ansiRed#DB6E7B
  • terminal.ansiWhite#F6DEF6
  • terminal.ansiYellow#ECBC85
  • terminal.background#0D0008
  • terminal.border#330A20
  • terminal.foreground#FAEBFA
  • terminal.selectionBackground#701C4E80
  • terminalCursor.background#0D0008
  • terminalCursor.foreground#E25DB9
  • textLink.activeForeground#E7ABDA
  • textLink.foreground#E084C9
  • titleBar.activeBackground#0D0008
  • titleBar.activeForeground#DF8BBF
  • titleBar.border#1E0414
  • titleBar.inactiveBackground#0D0008
  • titleBar.inactiveForeground#976E89
  • tree.indentGuidesStroke#491133
  • widget.border#330A20

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#B487A6italic
keyword, keyword.control, keyword.other#E25DB9
keyword.operator, storage.type.function.arrow#E293CC
keyword.operator.expression, keyword.operator.new, keyword.operator.delete, keyword.operator.word, keyword.operator.logical.python#E25DB9
storage, storage.type, storage.modifier#DF7CC3
string, punctuation.definition.string#E5A1DC
constant.character.escape, constant.character.entity, constant.character.format.placeholder#7ADBE3
string.regexp#A6FBD5
constant.numeric, keyword.other.unit#DE78BA
constant.language, constant.other, support.constant#DE78BA
variable.other.constant, variable.other.enummember#DE78BA
variable, variable.other, support.variable, entity.name.variable#F6DEF6
variable.other.property, variable.other.object.property, support.variable.property, entity.name.variable.property, entity.name.variable.field, meta.attribute.python, meta.object-literal.key#E39ECB
variable.parameter, entity.name.variable.parameter, meta.parameter, meta.function.parameter#F0CCE7italic
variable.language#DF7CC3italic
entity.name.function, support.function, meta.function-call.generic, variable.function#DE7EBB
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, storage.type.class, meta.type.annotation#E6ABCE
entity.other.inherited-class, entity.name.type.parameter#E6ABCEitalic
entity.name.function.decorator, entity.name.decorator, meta.decorator, punctuation.decorator, meta.attribute.rust, entity.name.function.macro, entity.name.macro, support.function.macro, entity.name.function.preprocessor, meta.preprocessor#B98FD9
entity.name.label, constant.other.label#E6ABCE
invalid, invalid.illegal#DB6E7B
invalid.deprecated#E6ABCEstrikethrough
punctuation, delimiter, meta.brace#EFC8E1
constant.character.class.regexp, constant.other.character-class.regexp, constant.other.character-class.set.regexp#7ADBE3
keyword.control.anchor.regexp#E25DB9
entity.name.tag#E25DB9
entity.other.attribute-name#DE7EBB
support.class.component, entity.name.tag.custom, meta.tag.custom entity.name.tag#E6ABCE
entity.name.tag.css, entity.name.tag.scss, entity.name.tag.less#DF7CC3
entity.other.attribute-name.class#DE7EBB
entity.other.attribute-name.id#E25DB9
entity.other.attribute-name.pseudo-class, entity.other.attribute-name.pseudo-element, entity.other.attribute-name.parent-selector#E293CC
entity.other.keyframe-offset#E25DB9
support.type.property-name, meta.at-rule.media.header#E6ABCE
support.constant.property-value, support.constant.font-name, support.constant.media, constant.other.color#DE78BA
variable.other.custom-property, variable.css, variable.scss, variable.less, variable.argument.css#E293CC
markup.heading, entity.name.section#E25DB9bold
heading.2 entity.name.section#DF7CC3bold
heading.3 entity.name.section#E293CCbold
heading.4 entity.name.section#E39ECBbold
heading.5 entity.name.section#E6ABCEbold
heading.6 entity.name.section#EFC8E1bold
markup.bold#DE7EBBbold
markup.italic#E6ABCEitalic
markup.strikethrough#B487A6strikethrough
markup.inline.raw, markup.raw, markup.fenced_code#E5A1DC
fenced_code.block.language#E6ABCE
markup.quote#B487A6italic
punctuation.definition.list, beginning.punctuation.definition.list#E25DB9
markup.underline.link, string.other.link, markup.underline#E084C9underline
markup.table#EFC8E1
meta.separator#E293CC
support.type.property-name.json, support.type.property-name.toml, entity.name.tag.yaml, entity.name.tag.toml#E6ABCE
entity.other.document.begin, entity.other.document.end, punctuation.definition.anchor, punctuation.definition.alias#EFC8E1
string.interpolated, punctuation.definition.variable.shell#E5A1DC