XELA Themes
Publisher: cybrdelicThemes in package: 196
A meticulously curated collection of 180+ high-quality XELA color themes for VS Code. Cleaned, optimized, and contrast-verified for professional coding environments.
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#6C5EB5
- activityBar.background#352879
- activityBar.foreground#6C5EB5
- activityBar.inactiveForeground#554A96
- activityBarBadge.background#6C5EB5
- activityBarBadge.foreground#352879
- badge.background#6C5EB5
- badge.foreground#1A1344
- breadcrumb.activeSelectionForeground#6C5EB5
- breadcrumb.background#1A1344
- breadcrumb.focusForeground#6C5EB5
- breadcrumb.foreground#554A96
- breadcrumbPicker.background#261D5C
- button.background#6C5EB5
- button.foreground#1A1344
- button.hoverBackground#9C90FA
- button.secondaryBackground#3E3494
- button.secondaryForeground#6C5EB5
- button.secondaryHoverBackground#554A96
- debugConsole.errorForeground#E04048
- debugConsole.infoForeground#6C5EB5
- debugConsole.sourceForeground#6C5EB5
- debugConsole.warningForeground#F0E068
- debugIcon.breakpointDisabledForeground#554A96
- debugIcon.breakpointForeground#E04048
- debugIcon.breakpointUnverifiedForeground#F0E068
- debugToolBar.background#261D5C
- debugToolBar.border#6C5EB5
- dropdown.background#261D5C
- dropdown.border#6C5EB5
- dropdown.foreground#6C5EB5
- dropdown.listBackground#1A1344
- editor.background#1A1344
- editor.findMatchBackground#FFFF00
- editor.findMatchBorder#6C5EB5
- editor.findMatchHighlightBackground#FFFF0080
- editor.findRangeHighlightBackground#6C5EB520
- editor.foreground#6C5EB5
- editor.inactiveSelectionBackground#6C5EB530
- editor.lineHighlightBackground#261D5C40
- editor.lineHighlightBorder#00000000
- editor.rangeHighlightBackground#261D5C40
- editor.selectionBackground#6C5EB550
- editor.selectionHighlightBackground#6C5EB530
- editor.wordHighlightBackground#454 0C740
- editor.wordHighlightStrongBackground#6C5EB550
- editorBracketMatch.background#6C5EB540
- editorBracketMatch.border#6C5EB5
- editorCodeLens.foreground#554A96
- editorCursor.foreground#6C5EB5
- editorError.foreground#E04048
- editorGroup.border#3E3494
- editorGroupHeader.border#3E3494
- editorGroupHeader.noTabsBackground#261D5C
- editorGroupHeader.tabsBackground#352879
- editorGroupHeader.tabsBorder#3E3494
- editorGutter.addedBackground#50F748
- editorGutter.background#1A1344
- editorGutter.commentRangeForeground#3E3494
- editorGutter.deletedBackground#E04048
- editorGutter.modifiedBackground#F0E068
- editorHoverWidget.background#261D5C
- editorHoverWidget.border#6C5EB5
- editorIndentGuide.activeBackground1#3E3494
- editorIndentGuide.background1#261D5C
- editorInfo.foreground#6C5EB5
- editorLightBulb.foreground#F0E068
- editorLightBulbAutoFix.foreground#50F748
- editorLineNumber.activeForeground#6C5EB5
- editorLineNumber.dimmedForeground#352879
- editorLineNumber.foreground#3E3494
- editorOverviewRuler.addedForeground#50F748
- editorOverviewRuler.border#3E3494
- editorOverviewRuler.deletedForeground#E04048
- editorOverviewRuler.errorForeground#E04048
- editorOverviewRuler.infoForeground#6C5EB5
- editorOverviewRuler.modifiedForeground#F0E068
- editorOverviewRuler.warningForeground#F0E068
- editorRuler.foreground#3E3494
- editorWarning.foreground#F0E068
- editorWidget.background#261D5C
- editorWidget.border#6C5EB5
- editorWidget.resizeBorder#6C5EB5
- focusBorder#6C5EB5
- gitDecoration.addedResourceForeground#50F748
- gitDecoration.conflictingResourceForeground#F0E068
- gitDecoration.deletedResourceForeground#E04048
- gitDecoration.ignoredResourceForeground#554A96
- gitDecoration.modifiedResourceForeground#F0E068
- gitDecoration.untrackedResourceForeground#50F748
- input.background#261D5C
- input.border#6C5EB5
- input.foreground#6C5EB5
- input.placeholderForeground#554A96
- inputOption.activeBackground#6C5EB540
- inputOption.activeBorder#6C5EB5
- inputOption.activeForeground#6C5EB5
- inputValidation.errorBackground#2A1820
- inputValidation.errorBorder#E04048
- inputValidation.infoBackground#1A1344
- inputValidation.infoBorder#6C5EB5
- inputValidation.warningBackground#2A2820
- inputValidation.warningBorder#F0E068
- list.activeSelectionBackground#6C5EB5
- list.activeSelectionForeground#1A1344
- list.dropBackground#6C5EB540
- list.errorForeground#E04048
- list.focusBackground#352879
- list.focusForeground#6C5EB5
- list.highlightForeground#6C5EB5
- list.hoverBackground#261D5C
- list.hoverForeground#6C5EB5
- list.inactiveSelectionBackground#3E3494
- list.inactiveSelectionForeground#6C5EB5
- list.warningForeground#F0E068
- listFilterWidget.background#261D5C
- listFilterWidget.noMatchesOutline#E04048
- listFilterWidget.outline#6C5EB5
- menu.background#261D5C
- menu.border#6C5EB5
- menu.foreground#6C5EB5
- menu.selectionBackground#6C5EB5
- menu.selectionForeground#1A1344
- menu.separatorBackground#3E3494
- menubar.selectionBackground#6C5EB5
- menubar.selectionForeground#1A1344
- merge.border#3E3494
- merge.currentContentBackground#50F74820
- merge.currentHeaderBackground#50F74840
- merge.incomingContentBackground#6C5EB520
- merge.incomingHeaderBackground#6C5EB540
- notificationCenter.border#6C5EB5
- notificationCenterHeader.background#261D5C
- notificationCenterHeader.foreground#6C5EB5
- notificationLink.foreground#6C5EB5
- notifications.background#261D5C
- notifications.border#6C5EB5
- notifications.foreground#6C5EB5
- notificationsErrorIcon.foreground#E04048
- notificationsInfoIcon.foreground#6C5EB5
- notificationsWarningIcon.foreground#F0E068
- notificationToast.border#6C5EB5
- panel.background#1A1344
- panel.border#3E3494
- panelTitle.activeBorder#6C5EB5
- panelTitle.activeForeground#6C5EB5
- panelTitle.inactiveForeground#554A96
- pickerGroup.border#3E3494
- pickerGroup.foreground#6C5EB5
- progressBar.background#6C5EB5
- sash.hoverBorder#6C5EB5
- scrollbar.shadow#00000080
- scrollbarSlider.activeBackground#6C5EB5C0
- scrollbarSlider.background#6C5EB560
- scrollbarSlider.hoverBackground#6C5EB580
- selection.background#6C5EB550
- settings.checkboxBackground#261D5C
- settings.checkboxBorder#6C5EB5
- settings.checkboxForeground#6C5EB5
- settings.dropdownBackground#261D5C
- settings.dropdownBorder#6C5EB5
- settings.dropdownForeground#6C5EB5
- settings.headerForeground#6C5EB5
- settings.modifiedItemIndicator#6C5EB5
- settings.numberInputBackground#261D5C
- settings.numberInputBorder#6C5EB5
- settings.numberInputForeground#6C5EB5
- settings.textInputBackground#261D5C
- settings.textInputBorder#6C5EB5
- settings.textInputForeground#6C5EB5
- sideBar.background#261D5C
- sideBar.border#3E3494
- sideBar.foreground#6C5EB5
- sideBarSectionHeader.background#352879
- sideBarSectionHeader.border#3E3494
- sideBarSectionHeader.foreground#6C5EB5
- sideBarTitle.foreground#6C5EB5
- statusBar.background#352879
- statusBar.border#3E3494
- statusBar.debuggingBackground#6C5EB5
- statusBar.debuggingForeground#352879
- statusBar.foreground#6C5EB5
- statusBar.noFolderBackground#261D5C
- statusBar.noFolderForeground#6C5EB5
- tab.activeBackground#1A1344
- tab.activeBorder#00000000
- tab.activeBorderTop#6C5EB5
- tab.activeForeground#6C5EB5
- tab.border#352879
- tab.hoverBackground#261D5C
- tab.hoverForeground#6C5EB5
- tab.inactiveBackground#261D5C
- tab.inactiveForeground#554A96
- tab.lastPinnedBorder#6C5EB5
- tab.unfocusedActiveBackground#1A1344
- tab.unfocusedActiveBorder#00000000
- tab.unfocusedActiveBorderTop#554A96
- tab.unfocusedInactiveBackground#261D5C
- tab.unfocusedInactiveForeground#3E3494
- terminal.ansiBlack#000000
- terminal.ansiBlue#6C5EB5
- terminal.ansiBrightBlack#554A96
- terminal.ansiBrightBlue#9C90FA
- terminal.ansiBrightCyan#9CE0F8
- terminal.ansiBrightGreen#70FF68
- terminal.ansiBrightMagenta#E080E8
- terminal.ansiBrightRed#F06068
- terminal.ansiBrightWhite#FFFFFF
- terminal.ansiBrightYellow#FFF088
- terminal.ansiCyan#7CD0E8
- terminal.ansiGreen#50F748
- terminal.ansiMagenta#C060C8
- terminal.ansiRed#E04048
- terminal.ansiWhite#FFFFFF
- terminal.ansiYellow#F0E068
- terminal.background#1A1344
- terminal.foreground#6C5EB5
- terminal.selectionBackground#6C5EB550
- terminalCursor.foreground#6C5EB5
- textBlockQuote.background#261D5C
- textBlockQuote.border#6C5EB5
- textCodeBlock.background#1A1344
- textLink.activeForeground#9C90FA
- textLink.foreground#6C5EB5
- textPreformat.foreground#6C5EB5
- textSeparator.foreground#3E3494
- titleBar.activeBackground#352879
- titleBar.activeForeground#6C5EB5
- titleBar.border#3E3494
- titleBar.inactiveBackground#261D5C
- titleBar.inactiveForeground#554A96
- widget.shadow#00000080
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #554A96 | italic |
| keyword, storage, storage.type | #6C5EB5 | bold |
| constant, constant.numeric, constant.language | #C060C8 | — |
| string, string.quoted | #50F748 | — |
| variable, variable.parameter | #6C5EB5 | — |
| entity.name.function, support.function | #7CD0E8 | bold |
| entity.name.type, support.class, support.type | #F0E068 | bold |
| entity.name.tag | #6C5EB5 | bold |
| entity.other.attribute-name | #50F748 | italic |
| markup.heading | #6C5EB5 | bold |
| markup.bold | #6C5EB5 | bold |
| markup.italic | #7CD0E8 | italic |
| invalid | #E04048 | bold underline |
| storage.modifier, storage.type.function | #6C5EB5 | bold |
| constant.character.escape | #F0E068 | — |
| meta.function-call, support.function.console | #50F748 | bold |
| support.type.property-name | #7CD0E8 | — |
| support.constant | #C060C8 | — |
| punctuation.definition.parameters, punctuation.section.group | #6C5EB5 | — |
| punctuation.separator, punctuation.terminator | #3E3494 | — |
| entity.name.tag.html | #6C5EB5 | bold |
| meta.tag | #6C5EB5 | — |
| support.type.property-name.css | #7CD0E8 | — |
| markup.underline | #6C5EB5 | underline |
| markup.list | #6C5EB5 | — |