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#33FF33
- activityBar.background#000000
- activityBar.foreground#33FF33
- activityBar.inactiveForeground#1A9919
- activityBarBadge.background#33FF33
- activityBarBadge.foreground#000000
- badge.background#33FF33
- badge.foreground#000000
- breadcrumb.activeSelectionForeground#33FF33
- breadcrumb.background#000000
- breadcrumb.focusForeground#33FF33
- breadcrumb.foreground#1A9919
- breadcrumbPicker.background#001100
- button.background#33FF33
- button.foreground#000000
- button.hoverBackground#00CC00
- button.secondaryBackground#1A9919
- button.secondaryForeground#33FF33
- button.secondaryHoverBackground#00AA00
- debugConsole.errorForeground#FF0000
- debugConsole.infoForeground#33FF33
- debugConsole.sourceForeground#33FF33
- debugConsole.warningForeground#FFFF00
- debugIcon.breakpointDisabledForeground#666666
- debugIcon.breakpointForeground#FF0000
- debugIcon.breakpointUnverifiedForeground#FFFF00
- debugToolBar.background#001100
- debugToolBar.border#33FF33
- dropdown.background#001100
- dropdown.border#33FF33
- dropdown.foreground#33FF33
- dropdown.listBackground#000000
- editor.background#000000
- editor.findMatchBackground#FFFF00
- editor.findMatchBorder#33FF33
- editor.findMatchHighlightBackground#FFFF0080
- editor.findRangeHighlightBackground#33FF3320
- editor.foreground#33FF33
- editor.inactiveSelectionBackground#33FF3330
- editor.lineHighlightBackground#001A0040
- editor.lineHighlightBorder#00000000
- editor.rangeHighlightBackground#001A0040
- editor.selectionBackground#33FF3350
- editor.selectionHighlightBackground#33FF3330
- editor.wordHighlightBackground#1A991940
- editor.wordHighlightStrongBackground#33FF3350
- editorBracketMatch.background#33FF3340
- editorBracketMatch.border#33FF33
- editorCodeLens.foreground#1A9919
- editorCursor.foreground#33FF33
- editorError.foreground#FF0000
- editorGroup.border#33FF33
- editorGroupHeader.border#33FF33
- editorGroupHeader.noTabsBackground#001100
- editorGroupHeader.tabsBackground#000000
- editorGroupHeader.tabsBorder#33FF33
- editorGutter.addedBackground#33FF33
- editorGutter.background#000000
- editorGutter.commentRangeForeground#1A9919
- editorGutter.deletedBackground#FF0000
- editorGutter.modifiedBackground#FFFF00
- editorHoverWidget.background#001100
- editorHoverWidget.border#33FF33
- editorIndentGuide.activeBackground1#1A9919
- editorIndentGuide.background1#001A00
- editorInfo.foreground#33FF33
- editorLightBulb.foreground#FFFF00
- editorLightBulbAutoFix.foreground#33FF33
- editorLineNumber.activeForeground#33FF33
- editorLineNumber.dimmedForeground#0D6B0D
- editorLineNumber.foreground#1A9919
- editorOverviewRuler.addedForeground#33FF33
- editorOverviewRuler.border#33FF33
- editorOverviewRuler.deletedForeground#FF0000
- editorOverviewRuler.errorForeground#FF0000
- editorOverviewRuler.infoForeground#33FF33
- editorOverviewRuler.modifiedForeground#FFFF00
- editorOverviewRuler.warningForeground#FFFF00
- editorRuler.foreground#1A9919
- editorWarning.foreground#FFFF00
- editorWidget.background#001100
- editorWidget.border#33FF33
- editorWidget.resizeBorder#33FF33
- focusBorder#33FF33
- gitDecoration.addedResourceForeground#33FF33
- gitDecoration.conflictingResourceForeground#FFFF00
- gitDecoration.deletedResourceForeground#FF0000
- gitDecoration.ignoredResourceForeground#1A9919
- gitDecoration.modifiedResourceForeground#FFFF00
- gitDecoration.untrackedResourceForeground#33FF33
- input.background#001100
- input.border#33FF33
- input.foreground#33FF33
- input.placeholderForeground#1A9919
- inputOption.activeBackground#33FF3340
- inputOption.activeBorder#33FF33
- inputOption.activeForeground#33FF33
- inputValidation.errorBackground#220000
- inputValidation.errorBorder#FF0000
- inputValidation.infoBackground#001A00
- inputValidation.infoBorder#33FF33
- inputValidation.warningBackground#222200
- inputValidation.warningBorder#FFFF00
- list.activeSelectionBackground#33FF33
- list.activeSelectionForeground#000000
- list.dropBackground#33FF3340
- list.errorForeground#FF0000
- list.focusBackground#001A00
- list.focusForeground#33FF33
- list.highlightForeground#33FF33
- list.hoverBackground#001A00
- list.hoverForeground#33FF33
- list.inactiveSelectionBackground#1A9919
- list.inactiveSelectionForeground#33FF33
- list.warningForeground#FFFF00
- listFilterWidget.background#001100
- listFilterWidget.noMatchesOutline#FF0000
- listFilterWidget.outline#33FF33
- menu.background#001100
- menu.border#33FF33
- menu.foreground#33FF33
- menu.selectionBackground#33FF33
- menu.selectionForeground#000000
- menu.separatorBackground#33FF33
- menubar.selectionBackground#33FF33
- menubar.selectionForeground#000000
- merge.border#33FF33
- merge.currentContentBackground#33FF3320
- merge.currentHeaderBackground#33FF3340
- merge.incomingContentBackground#FFFF0020
- merge.incomingHeaderBackground#FFFF0040
- notificationCenter.border#33FF33
- notificationCenterHeader.background#001100
- notificationCenterHeader.foreground#33FF33
- notificationLink.foreground#33FF33
- notifications.background#001100
- notifications.border#33FF33
- notifications.foreground#33FF33
- notificationsErrorIcon.foreground#FF0000
- notificationsInfoIcon.foreground#33FF33
- notificationsWarningIcon.foreground#FFFF00
- notificationToast.border#33FF33
- panel.background#000000
- panel.border#33FF33
- panelTitle.activeBorder#33FF33
- panelTitle.activeForeground#33FF33
- panelTitle.inactiveForeground#1A9919
- pickerGroup.border#33FF33
- pickerGroup.foreground#33FF33
- progressBar.background#33FF33
- sash.hoverBorder#33FF33
- scrollbar.shadow#00000080
- scrollbarSlider.activeBackground#33FF33C0
- scrollbarSlider.background#33FF3360
- scrollbarSlider.hoverBackground#33FF3380
- selection.background#33FF3350
- settings.checkboxBackground#001100
- settings.checkboxBorder#33FF33
- settings.checkboxForeground#33FF33
- settings.dropdownBackground#001100
- settings.dropdownBorder#33FF33
- settings.dropdownForeground#33FF33
- settings.headerForeground#33FF33
- settings.modifiedItemIndicator#33FF33
- settings.numberInputBackground#001100
- settings.numberInputBorder#33FF33
- settings.numberInputForeground#33FF33
- settings.textInputBackground#001100
- settings.textInputBorder#33FF33
- settings.textInputForeground#33FF33
- sideBar.background#000000
- sideBar.border#004400
- sideBar.foreground#33FF33
- sideBarSectionHeader.background#001100
- sideBarSectionHeader.border#004400
- sideBarSectionHeader.foreground#33FF33
- sideBarTitle.foreground#33FF33
- statusBar.background#000000
- statusBar.border#004400
- statusBar.debuggingBackground#33FF33
- statusBar.debuggingForeground#000000
- statusBar.foreground#33FF33
- statusBar.noFolderBackground#000000
- statusBar.noFolderForeground#33FF33
- tab.activeBackground#000000
- tab.activeBorder#00000000
- tab.activeBorderTop#33FF33
- tab.activeForeground#33FF33
- tab.border#000000
- tab.hoverBackground#001A00
- tab.hoverForeground#33FF33
- tab.inactiveBackground#001100
- tab.inactiveForeground#1A9919
- tab.lastPinnedBorder#33FF33
- tab.unfocusedActiveBackground#000000
- tab.unfocusedActiveBorder#00000000
- tab.unfocusedActiveBorderTop#1A9919
- tab.unfocusedInactiveBackground#001100
- tab.unfocusedInactiveForeground#0D6B0D
- terminal.ansiBlack#000000
- terminal.ansiBlue#00AA00
- terminal.ansiBrightBlack#1A9919
- terminal.ansiBrightBlue#66FF66
- terminal.ansiBrightCyan#66FF66
- terminal.ansiBrightGreen#66FF66
- terminal.ansiBrightMagenta#66FF66
- terminal.ansiBrightRed#FF6666
- terminal.ansiBrightWhite#FFFFFF
- terminal.ansiBrightYellow#FFFF66
- terminal.ansiCyan#33FF33
- terminal.ansiGreen#33FF33
- terminal.ansiMagenta#33FF33
- terminal.ansiRed#FF0000
- terminal.ansiWhite#33FF33
- terminal.ansiYellow#FFFF00
- terminal.background#000000
- terminal.foreground#33FF33
- terminal.selectionBackground#33FF3350
- terminalCursor.foreground#33FF33
- textBlockQuote.background#001100
- textBlockQuote.border#33FF33
- textCodeBlock.background#000000
- textLink.activeForeground#00CC00
- textLink.foreground#33FF33
- textPreformat.foreground#33FF33
- textSeparator.foreground#33FF33
- titleBar.activeBackground#000000
- titleBar.activeForeground#33FF33
- titleBar.border#004400
- titleBar.inactiveBackground#001100
- titleBar.inactiveForeground#1A9919
- widget.shadow#00000080
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #1A9919 | italic |
| keyword, storage, storage.type | #33FF33 | bold |
| constant, constant.numeric, constant.language | #33FF33 | — |
| string, string.quoted | #33FF33 | — |
| variable, variable.parameter | #33FF33 | — |
| entity.name.function, support.function | #33FF33 | bold |
| entity.name.type, support.class, support.type | #33FF33 | bold |
| entity.name.tag | #33FF33 | bold |
| entity.other.attribute-name | #33FF33 | italic |
| markup.heading | #33FF33 | bold |
| markup.bold | #33FF33 | bold |
| markup.italic | #33FF33 | italic |
| invalid | #FF0000 | bold underline |
| storage.modifier, storage.type.function | #33FF33 | bold |
| constant.character.escape | #33FF33 | — |
| meta.function-call, support.function.console | #33FF33 | bold |
| support.type.property-name | #33FF33 | — |
| support.constant | #33FF33 | — |
| punctuation.definition.parameters, punctuation.section.group | #1A9919 | — |
| punctuation.separator, punctuation.terminator | #1A9919 | — |
| entity.name.tag.html | #33FF33 | bold |
| meta.tag | #33FF33 | — |
| support.type.property-name.css | #33FF33 | — |
| markup.underline | #33FF33 | underline |
| markup.list | #33FF33 | — |