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#FF6AD5
- activityBar.background#14063A
- activityBar.border#00000000
- activityBar.foreground#F6EFFF
- activityBar.inactiveForeground#B9A9D9
- activityBarBadge.background#7CFFCB
- activityBarBadge.foreground#0B031E
- badge.background#FF6AD5
- badge.foreground#0B031E
- button.background#7CFFCB
- button.foreground#14063A
- button.hoverBackground#B497FF
- dropdown.background#0F0633
- dropdown.border#2E1657
- dropdown.foreground#E8DFF9
- editor.background#080220
- editor.findMatchBackground#FFE57755
- editor.findMatchBorder#FFE57790
- editor.findMatchHighlightBackground#FFE57733
- editor.foreground#F6EFFF
- editor.hoverHighlightBackground#2E165780
- editor.inactiveSelectionBackground#FF6AD52B
- editor.lineHighlightBackground#2E165770
- editor.selectionBackground#FF6AD555
- editor.selectionHighlightBackground#7CFFCB26
- editor.wordHighlightBackground#7CFFCB2E
- editor.wordHighlightStrongBackground#B497FF36
- editorBracketMatch.background#B497FF33
- editorBracketMatch.border#B497FF90
- editorCursor.foreground#7CFFCB
- editorIndentGuide.activeBackground1#FF6AD560
- editorIndentGuide.background1#2E165750
- editorLineNumber.activeForeground#D1C7EE
- editorLineNumber.foreground#3D2871
- editorRuler.foreground#2E1657
- editorWhitespace.foreground#2E1657
- input.background#0F0633
- input.border#2E1657
- input.foreground#F6EFFF
- list.activeSelectionBackground#1B0947
- list.activeSelectionForeground#F6EFFF
- list.dropBackground#FF6AD533
- list.errorForeground#FF8CA8
- list.focusBackground#1B0947
- list.hoverBackground#1B0947B0
- list.inactiveSelectionBackground#12052E
- list.warningForeground#FFE577
- minimap.background#080220
- panel.background#080220
- panel.border#2E1657
- panelTitle.activeBorder#FF6AD5
- panelTitle.activeForeground#F6EFFF
- panelTitle.inactiveForeground#B9A9D9
- sideBar.background#0C0324
- sideBar.border#2E1657
- sideBar.dropBackground#FF6AD533
- sideBar.foreground#E8DFF9
- sideBarSectionHeader.background#14063A
- sideBarTitle.foreground#F6EFFF
- statusBar.background#080220
- statusBar.border#2E1657
- statusBar.debuggingBackground#FFE577
- statusBar.debuggingForeground#14063A
- statusBar.foreground#E8DFF9
- statusBar.noFolderBackground#14063A
- tab.activeBackground#14063A
- tab.activeBorderTop#FF6AD5
- tab.activeForeground#F6EFFF
- tab.border#00000000
- tab.hoverBackground#1B0947
- tab.hoverForeground#F6EFFF
- tab.inactiveBackground#080220
- tab.inactiveForeground#B9A9D9
- tab.unfocusedActiveBorderTop#FF6AD533
- terminal.ansiBlack#12052E
- terminal.ansiBlue#B497FF
- terminal.ansiBrightBlack#3D2871
- terminal.ansiBrightBlue#CFBEFF
- terminal.ansiBrightCyan#BFF0FF
- terminal.ansiBrightGreen#A8FFE0
- terminal.ansiBrightMagenta#FF97E5
- terminal.ansiBrightRed#FFACC3
- terminal.ansiBrightWhite#FFFFFF
- terminal.ansiBrightYellow#FFF1AA
- terminal.ansiCyan#96D3FF
- terminal.ansiGreen#7CFFCB
- terminal.ansiMagenta#FF6AD5
- terminal.ansiRed#FF8CA8
- terminal.ansiWhite#F6EFFF
- terminal.ansiYellow#FFE577
- terminal.background#080220
- terminal.foreground#F6EFFF
- terminalCursor.foreground#7CFFCB
- titleBar.activeBackground#14063A
- titleBar.activeForeground#F6EFFF
- titleBar.border#00000000
- titleBar.inactiveBackground#0C0324
- titleBar.inactiveForeground#B9A9D9
- window.activeBorder#FF6AD5
- window.inactiveBorder#2E1657
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #9D8CB8 | italic |
| keyword, storage.type, storage.modifier | #FF6AD5 | bold |
| keyword.control | #B497FF | — |
| entity.name.function, meta.function-call | #7CFFCB | — |
| support.function | #96D3FF | — |
| entity.name.class, support.class, entity.name.type | #B497FF | — |
| variable, variable.other | #F6EFFF | — |
| variable.parameter | #CBBBED | — |
| constant, constant.language | #FFE577 | — |
| constant.numeric | #B497FF | — |
| string, string.quoted, string.template | #A8FFE0 | — |
| constant.character.escape, punctuation.definition.string | #FF6AD5 | — |
| support.constant, support.variable | #FFE577 | — |
| meta.decorator, entity.name.section | #FF97E5 | — |
| entity.other.attribute-name | #7CFFCB | — |
| entity.name.tag, entity.name.tag.html, meta.tag | #FF6AD5 | bold |
| markup.heading, markup.heading.setext | #FFE577 | — |
| markup.bold | #F6EFFF | bold |
| markup.italic | #FF97E5 | italic |
| markup.inline.raw, markup.fenced_code | #F6EFFF | — |
| markup.list | #FFE577 | — |
| markup.quote | #CBBBED | — |
| constant.character.entity | #96D3FF | — |
| punctuation.section.embedded | #FF8CA8 | — |
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#0078D4
- activityBar.background#F9F9F9
- activityBar.border#E7E7E7
- activityBar.foreground#1E1E1E
- activityBar.inactiveForeground#767676
- activityBarBadge.background#0078D4
- activityBarBadge.foreground#FFFFFF
- badge.background#0078D4
- badge.foreground#FFFFFF
- breadcrumb.activeSelectionForeground#0078D4
- breadcrumb.background#FFFFFF
- breadcrumb.focusForeground#1E1E1E
- breadcrumb.foreground#767676
- breadcrumbPicker.background#EEEEEE
- button.background#0078D4
- button.foreground#FFFFFF
- button.hoverBackground#106EBE
- checkbox.background#F3F3F3
- checkbox.border#E7E7E7
- checkbox.foreground#3E3E3E
- debugIcon.breakpointForeground#E81123
- debugToolBar.background#F9F9F9
- diffEditor.insertedLineBackground#107C101A
- diffEditor.insertedTextBackground#107C1021
- diffEditor.removedLineBackground#E811231A
- diffEditor.removedTextBackground#E8112321
- dropdown.background#F3F3F3
- dropdown.border#E7E7E7
- dropdown.foreground#1E1E1E
- editor.background#FFFFFF
- editor.findMatchBackground#00000000
- editor.findMatchBorder#CA5010
- editor.findMatchHighlightBackground#F3F3F380
- editor.findMatchHighlightBorder#CA501087
- editor.focusedStackFrameHighlightBackground#107C101A
- editor.foldBackground#F9F9F980
- editor.foreground#1E1E1E
- editor.hoverHighlightBackground#F3F3F380
- editor.inactiveSelectionBackground#0078D499
- editor.lineHighlightBackground#F3F3F3
- editor.selectionBackground#0078D433
- editor.selectionHighlightBackground#0078D499
- editor.selectionHighlightBorder#0078D454
- editor.stackFrameHighlightBackground#CA50101A
- editor.wordHighlightBackground#0078D41A
- editor.wordHighlightStrongBackground#0078D42B
- editorBracketHighlight.foreground1#0078D4
- editorBracketHighlight.foreground2#CA5010
- editorBracketHighlight.foreground3#E81123
- editorBracketHighlight.foreground4#00BCF2
- editorBracketHighlight.foreground5#107C10
- editorBracketHighlight.foreground6#106EBE
- editorBracketMatch.background#F3F3F3
- editorBracketMatch.border#CA501087
- editorBracketPairGuide.activeBackground1#0078D454
- editorBracketPairGuide.activeBackground2#CA501054
- editorBracketPairGuide.activeBackground3#E8112354
- editorBracketPairGuide.activeBackground4#00BCF254
- editorBracketPairGuide.activeBackground5#107C1054
- editorBracketPairGuide.activeBackground6#106EBE54
- editorCursor.foreground#0078D4
- editorError.foreground#E81123
- editorGroup.dropBackground#0078D421
- editorGroupHeader.tabsBackground#F3F3F3
- editorGroupHeader.tabsBorder#E7E7E7
- editorGutter.addedBackground#107C10AB
- editorGutter.commentRangeForeground#767676
- editorGutter.deletedBackground#E81123AB
- editorGutter.modifiedBackground#CA5010AB
- editorHoverWidget.background#EEEEEE
- editorHoverWidget.border#E7E7E7
- editorIndentGuide.activeBackground1#767676B3
- editorIndentGuide.background1#F3F3F3
- editorInfo.foreground#00BCF2
- editorLineNumber.activeForeground#3E3E3E
- editorLineNumber.foreground#767676
- editorLink.activeForeground#0066B4
- editorOverviewRuler.addedForeground#107C1066
- editorOverviewRuler.deletedForeground#E8112366
- editorOverviewRuler.errorForeground#E81123AB
- editorOverviewRuler.findMatchForeground#CA501087
- editorOverviewRuler.infoForeground#00BCF287
- editorOverviewRuler.modifiedForeground#CA501066
- editorOverviewRuler.warningForeground#CA5010AB
- editorStickyScroll.background#FFFFFFF2
- editorStickyScrollHover.background#F9F9F9
- editorUnnecessaryCode.opacity#1E1E1E40
- editorWarning.foreground#CA5010
- editorWidget.background#EEEEEE
- editorWidget.border#E7E7E7
- editorWidget.resizeBorder#0078D4
- focusBorder#0078D4B3
- gitDecoration.addedResourceForeground#107C10
- gitDecoration.conflictingResourceForeground#E81123CC
- gitDecoration.deletedResourceForeground#E81123
- gitDecoration.ignoredResourceForeground#767676
- gitDecoration.modifiedResourceForeground#CA5010
- gitDecoration.renamedResourceForeground#00BCF2
- gitDecoration.submoduleResourceForeground#CA5010CC
- gitDecoration.untrackedResourceForeground#107C10CC
- input.background#F3F3F3
- input.border#E7E7E7
- input.foreground#1E1E1E
- input.placeholderForeground#767676
- inputOption.activeBorder#0078D4AB
- inputValidation.errorBackground#E811231A
- inputValidation.errorBorder#E81123
- inputValidation.infoBackground#00BCF21A
- inputValidation.infoBorder#00BCF2
- inputValidation.warningBackground#CA50101A
- inputValidation.warningBorder#CA5010
- list.activeSelectionBackground#F3F3F3
- list.activeSelectionForeground#1E1E1E
- list.dropBackground#0078D421
- list.errorForeground#E81123
- list.focusBackground#F9F9F9
- list.highlightForeground#0078D4
- list.hoverBackground#F3F3F3
- list.inactiveSelectionBackground#F9F9F9
- list.warningForeground#CA5010
- listFilterWidget.background#F3F3F3
- listFilterWidget.noMatchesOutline#E81123AB
- listFilterWidget.outline#0078D4AB
- menu.background#EEEEEE
- menu.foreground#1E1E1E
- menu.selectionBackground#F3F3F3
- menu.selectionBorder#E7E7E7
- menu.selectionForeground#1E1E1E
- menu.separatorBackground#E7E7E7
- minimap.errorHighlight#E8112399
- minimap.findMatchHighlight#CA501099
- minimap.selectionHighlight#0078D454
- minimap.selectionOccurrenceHighlight#0078D433
- minimap.warningHighlight#CA501099
- notificationCenterHeader.foreground#1E1E1E
- notifications.background#EEEEEE
- notifications.border#E7E7E7
- panel.background#FEFEFE
- panel.border#E7E7E7
- panel.dropBorder#0078D4
- panelTitle.activeBorder#0078D4
- panelTitle.activeForeground#1E1E1E
- panelTitle.inactiveForeground#3E3E3E
- peekView.border#E7E7E7
- peekViewEditor.background#EEEEEE
- peekViewEditor.matchHighlightBackground#CA501021
- peekViewEditor.matchHighlightBorder#CA501087
- peekViewResult.background#F3F3F3
- peekViewResult.matchHighlightBackground#EEEEEE
- peekViewTitle.background#F3F3F3
- peekViewTitleDescription.foreground#767676
- peekViewTitleLabel.foreground#1E1E1E
- pickerGroup.border#E7E7E7
- pickerGroup.foreground#0078D4
- problemsErrorIcon.foreground#E81123
- problemsInfoIcon.foreground#00BCF2
- problemsWarningIcon.foreground#CA5010
- progressBar.background#0078D4
- quickInput.background#FFFFFFF2
- quickInput.foreground#1E1E1E
- quickInputTitle.background#EEEEEE
- sash.hoverBorder#0078D4
- scrollbar.shadow#FFFFFF99
- scrollbarSlider.activeBackground#EEEEEEFF
- scrollbarSlider.background#EEEEEE
- scrollbarSlider.hoverBackground#EEEEEEFF
- selection.background#0078D433
- sideBar.background#F9F9F9
- sideBar.border#E7E7E7
- sideBar.dropBackground#0078D421
- sideBar.foreground#1E1E1E
- sideBarSectionHeader.background#F3F3F3
- sideBarTitle.foreground#3E3E3E
- statusBar.background#F9F9F9
- statusBar.border#E7E7E7
- statusBar.debuggingBackground#CA5010
- statusBar.debuggingForeground#FFFFFF
- statusBar.foreground#1E1E1E
- statusBar.noFolderBackground#F3F3F3
- statusBar.noFolderForeground#3E3E3E
- statusBarItem.errorBackground#E81123
- statusBarItem.errorForeground#FFFFFF
- statusBarItem.hoverBackground#F3F3F3
- statusBarItem.prominentBackground#F3F3F3
- statusBarItem.prominentHoverBackground#EEEEEE
- statusBarItem.remoteBackground#00BCF2
- statusBarItem.remoteForeground#FFFFFF
- statusBarItem.warningBackground#CA5010
- statusBarItem.warningForeground#FFFFFF
- tab.activeBackground#FFFFFF
- tab.activeBorderTop#0078D4
- tab.activeForeground#1E1E1E
- tab.activeModifiedBorder#CA5010
- tab.border#F3F3F3
- tab.hoverBackground#EEEEEE
- tab.hoverBorder#EEEEEE
- tab.hoverForeground#1E1E1E
- tab.inactiveBackground#F3F3F3
- tab.inactiveForeground#767676
- tab.lastPinnedBorder#E7E7E7
- tab.unfocusedActiveBorderTop#CA501087
- tab.unfocusedHoverBackground#EEEEEE
- terminal.ansiBlack#FFFFFF
- terminal.ansiBlue#00BCF2
- terminal.ansiBrightBlack#767676
- terminal.ansiBrightBlue#00BCF2CC
- terminal.ansiBrightCyan#106EBE
- terminal.ansiBrightGreen#107C10CC
- terminal.ansiBrightMagenta#E81123CC
- terminal.ansiBrightRed#E81123CC
- terminal.ansiBrightWhite#1E1E1E
- terminal.ansiBrightYellow#CA5010CC
- terminal.ansiCyan#0078D4
- terminal.ansiGreen#107C10
- terminal.ansiMagenta#E81123
- terminal.ansiRed#E81123
- terminal.ansiWhite#3E3E3E
- terminal.ansiYellow#CA5010
- terminal.background#FFFFFF
- terminal.foreground#1E1E1E
- terminalCursor.foreground#0078D4
- testing.iconErrored#E81123CC
- testing.iconFailed#E81123
- testing.iconPassed#107C10
- testing.iconQueued#CA5010
- testing.iconSkipped#767676
- testing.peekBorder#E7E7E7
- textBlockQuote.background#F9F9F9
- textBlockQuote.border#E7E7E7
- textCodeBlock.background#F3F3F3
- textLink.activeForeground#0078D4
- textLink.foreground#0066B4
- textPreformat.foreground#3E3E3E
- textSeparator.foreground#E7E7E7
- titleBar.activeBackground#F9F9F9
- titleBar.activeForeground#1E1E1E
- titleBar.border#E7E7E7
- titleBar.inactiveBackground#F9F9F9
- titleBar.inactiveForeground#767676
- widget.shadow#FFFFFF99
- window.activeBorder#0078D4
- window.inactiveBorder#E7E7E7
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #008000 | italic |
| keyword | #0000FF | bold |
| entity.name.function | #795E26 | — |
| variable, meta.definition.variable | #001080 | — |
| string | #A31515 | — |
| constant.numeric | #098658 | — |
| constant.language, constant.character | #0000FF | — |
| storage.type, storage.modifier | #0000FF | — |
| entity.name.type, support.type, support.class | #267F99 | — |
| punctuation, meta.brace | #000000 | — |
| invalid, invalid.illegal | #CD3131 | underline |
| markup.bold, markup.bold.markdown | #1E1E1E | bold |
| markup.italic, markup.italic.markdown | #1E1E1E | italic |
| markup.inline.raw, markup.raw.inline, markup.inline.code | #1E1E1E | — |
| markup.heading, entity.name.section, punctuation.definition.heading.markdown | #0078D4 | bold |
| heading.1.markdown, markup.heading.setext.1.markdown | #0000FF | bold |
| heading.2.markdown, markup.heading.setext.2.markdown | #267F99 | bold |
| heading.3.markdown | #AF00DB | bold |
| heading.4.markdown | #795E26 | bold |
| heading.5.markdown | #098658 | bold |
| heading.6.markdown | #767676 | bold |
| entity.name.tag.html, entity.name.tag.xml | #F7B883 | bold |
| entity.name.tag.structure.any.html, entity.name.tag.block.any.html | #FFD166 | bold |
| entity.name.tag.inline.any.html | #EADCB2 | — |
| entity.name.tag.script.html, entity.name.tag.style.html | #FF3CAC | bold |
| entity.other.attribute-name.html, entity.other.attribute-name.xml | #EADCB2 | italic |
| entity.other.attribute-name.class.html, entity.other.attribute-name.class.css | #C8B0FF | italic bold |
| entity.other.attribute-name.id.html, entity.other.attribute-name.id.css | #4CFFCA | italic bold |
| entity.other.attribute-name.style.html | #FF8BDA | italic |
| entity.other.attribute-name.event.html | #D8C8FF | italic |
| string.quoted.double.html, string.quoted.single.html | #00F5A0 | — |
| meta.attribute-with-value.html string | #98FF66 | — |
| punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html | #A6AAB4 | — |
| punctuation.definition.tag.html, punctuation.separator.key-value.html | #8E93A6 | — |
| punctuation.definition.string.begin.html, punctuation.definition.string.end.html | #9AA0B4 | — |
| comment.block.html, punctuation.definition.comment.html | #8E93A6 | italic |
| constant.character.entity.html, constant.character.entity.named.html | #F2C97D | bold |
| punctuation.definition.entity.html | #FFD166 | — |
| meta.tag.sgml.doctype.html, entity.name.tag.doctype.html | #FF3CAC | bold |
| keyword.doctype.xml | #FF3CAC | bold |
| source.css.embedded.html | #E0CCFF | — |
| meta.embedded.block.css | #D7C7FF | — |
| source.js.embedded.html, source.javascript.embedded.html | #F7B883 | — |
| meta.embedded.block.javascript | #EADCB2 | — |
| entity.name.tag.form.html, entity.name.tag.input.html, entity.name.tag.button.html | #79E49A | bold |
| entity.other.attribute-name.form.html | #98FF66 | italic |
| entity.name.tag.table.html, entity.name.tag.tr.html, entity.name.tag.td.html, entity.name.tag.th.html | #4CFFCA | bold |
| entity.name.tag.img.html, entity.name.tag.video.html, entity.name.tag.audio.html | #FFD166 | bold |
| entity.name.tag.a.html | #4CFFCA | bold |
| entity.other.attribute-name.href.html | #00F5A0 | italic bold |
| entity.name.tag.header.html, entity.name.tag.main.html, entity.name.tag.footer.html, entity.name.tag.nav.html, entity.name.tag.aside.html, entity.name.tag.section.html, entity.name.tag.article.html, entity.name.tag.figure.html, entity.name.tag.figcaption.html | #C8B0FF | bold |
| text.html.basic | #F7F8FA | — |
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#9AA5B1
- activityBar.background#2C2E30
- activityBar.border#46494C
- activityBar.foreground#E8EAED
- activityBar.inactiveForeground#9AA0A6
- activityBarBadge.background#9AA5B1
- activityBarBadge.foreground#202124
- badge.background#9AA5B1
- badge.foreground#202124
- breadcrumb.activeSelectionForeground#9AA5B1
- breadcrumb.background#242628
- breadcrumb.focusForeground#E8EAED
- breadcrumb.foreground#9AA0A6
- breadcrumbPicker.background#3C4043
- button.background#9AA5B1
- button.foreground#202124
- button.hoverBackground#ADB8C4
- checkbox.background#34373A
- checkbox.border#46494C
- checkbox.foreground#BDC1C6
- debugIcon.breakpointForeground#F28B82
- debugToolBar.background#2C2E30
- diffEditor.insertedLineBackground#81C9951A
- diffEditor.insertedTextBackground#81C99521
- diffEditor.removedLineBackground#F28B821A
- diffEditor.removedTextBackground#F28B8221
- dropdown.background#34373A
- dropdown.border#46494C
- dropdown.foreground#E8EAED
- editor.background#242628
- editor.findMatchBackground#00000000
- editor.findMatchBorder#FDD663
- editor.findMatchHighlightBackground#34373A80
- editor.findMatchHighlightBorder#FDD66387
- editor.focusedStackFrameHighlightBackground#81C9951A
- editor.foldBackground#2C2E3080
- editor.foreground#E8EAED
- editor.hoverHighlightBackground#34373A80
- editor.inactiveSelectionBackground#9AA5B199
- editor.lineHighlightBackground#34373A
- editor.selectionBackground#9AA5B13B
- editor.selectionHighlightBackground#9AA5B199
- editor.selectionHighlightBorder#9AA5B154
- editor.stackFrameHighlightBackground#FDD6631A
- editor.wordHighlightBackground#9AA5B11A
- editor.wordHighlightStrongBackground#9AA5B12B
- editorBracketHighlight.foreground1#9AA5B1
- editorBracketHighlight.foreground2#FDD663
- editorBracketHighlight.foreground3#F28B82
- editorBracketHighlight.foreground4#8AB4F8
- editorBracketHighlight.foreground5#81C995
- editorBracketHighlight.foreground6#ADB8C4
- editorBracketMatch.background#34373A
- editorBracketMatch.border#FDD66387
- editorBracketPairGuide.activeBackground1#9AA5B154
- editorBracketPairGuide.activeBackground2#FDD66354
- editorBracketPairGuide.activeBackground3#F28B8254
- editorBracketPairGuide.activeBackground4#8AB4F854
- editorBracketPairGuide.activeBackground5#81C99554
- editorBracketPairGuide.activeBackground6#ADB8C454
- editorCursor.foreground#9AA5B1
- editorError.foreground#F28B82
- editorGroup.dropBackground#9AA5B121
- editorGroupHeader.tabsBackground#34373A
- editorGroupHeader.tabsBorder#46494C
- editorGutter.addedBackground#81C995AB
- editorGutter.commentRangeForeground#9AA0A6
- editorGutter.deletedBackground#F28B82AB
- editorGutter.modifiedBackground#FDD663AB
- editorHoverWidget.background#3C4043
- editorHoverWidget.border#46494C
- editorIndentGuide.activeBackground1#9AA0A6B3
- editorIndentGuide.background1#34373A
- editorInfo.foreground#8AB4F8
- editorLineNumber.activeForeground#BDC1C6
- editorLineNumber.foreground#9AA0A6
- editorLink.activeForeground#8AB4F8
- editorOverviewRuler.addedForeground#81C99566
- editorOverviewRuler.deletedForeground#F28B8266
- editorOverviewRuler.errorForeground#F28B82AB
- editorOverviewRuler.findMatchForeground#FDD66387
- editorOverviewRuler.infoForeground#8AB4F887
- editorOverviewRuler.modifiedForeground#FDD66366
- editorOverviewRuler.warningForeground#FDD663AB
- editorStickyScroll.background#242628F2
- editorStickyScrollHover.background#2C2E30
- editorUnnecessaryCode.opacity#E8EAED40
- editorWarning.foreground#FDD663
- editorWidget.background#3C4043
- editorWidget.border#46494C
- editorWidget.resizeBorder#9AA5B1
- focusBorder#9AA5B1B3
- gitDecoration.addedResourceForeground#81C995
- gitDecoration.conflictingResourceForeground#F28B82CC
- gitDecoration.deletedResourceForeground#F28B82
- gitDecoration.ignoredResourceForeground#9AA0A6
- gitDecoration.modifiedResourceForeground#FDD663
- gitDecoration.renamedResourceForeground#8AB4F8
- gitDecoration.submoduleResourceForeground#FDD663CC
- gitDecoration.untrackedResourceForeground#81C995CC
- input.background#34373A
- input.border#46494C
- input.foreground#E8EAED
- input.placeholderForeground#9AA0A6
- inputOption.activeBorder#9AA5B1AB
- inputValidation.errorBackground#F28B821A
- inputValidation.errorBorder#F28B82
- inputValidation.infoBackground#8AB4F81A
- inputValidation.infoBorder#8AB4F8
- inputValidation.warningBackground#FDD6631A
- inputValidation.warningBorder#FDD663
- list.activeSelectionBackground#34373A
- list.activeSelectionForeground#E8EAED
- list.dropBackground#9AA5B121
- list.errorForeground#F28B82
- list.focusBackground#2C2E30
- list.highlightForeground#9AA5B1
- list.hoverBackground#34373A
- list.inactiveSelectionBackground#2C2E30
- list.warningForeground#FDD663
- listFilterWidget.background#34373A
- listFilterWidget.noMatchesOutline#F28B82AB
- listFilterWidget.outline#9AA5B1AB
- menu.background#3C4043
- menu.foreground#E8EAED
- menu.selectionBackground#34373A
- menu.selectionBorder#46494C
- menu.selectionForeground#E8EAED
- menu.separatorBackground#46494C
- minimap.errorHighlight#F28B8299
- minimap.findMatchHighlight#FDD66399
- minimap.selectionHighlight#9AA5B154
- minimap.selectionOccurrenceHighlight#9AA5B133
- minimap.warningHighlight#FDD66399
- notificationCenterHeader.foreground#E8EAED
- notifications.background#3C4043
- notifications.border#46494C
- panel.background#242628
- panel.border#46494C
- panel.dropBorder#9AA5B1
- panelTitle.activeBorder#9AA5B1
- panelTitle.activeForeground#E8EAED
- panelTitle.inactiveForeground#BDC1C6
- peekView.border#46494C
- peekViewEditor.background#3C4043
- peekViewEditor.matchHighlightBackground#FDD66321
- peekViewEditor.matchHighlightBorder#FDD66387
- peekViewResult.background#34373A
- peekViewResult.matchHighlightBackground#3C4043
- peekViewTitle.background#34373A
- peekViewTitleDescription.foreground#9AA0A6
- peekViewTitleLabel.foreground#E8EAED
- pickerGroup.border#46494C
- pickerGroup.foreground#9AA5B1
- problemsErrorIcon.foreground#F28B82
- problemsInfoIcon.foreground#8AB4F8
- problemsWarningIcon.foreground#FDD663
- progressBar.background#9AA5B1
- quickInput.background#242628F2
- quickInput.foreground#E8EAED
- quickInputTitle.background#3C4043
- sash.hoverBorder#9AA5B1
- scrollbar.shadow#00000099
- scrollbarSlider.activeBackground#3C4043FF
- scrollbarSlider.background#3C4043
- scrollbarSlider.hoverBackground#3C4043FF
- selection.background#9AA5B13B
- sideBar.background#2C2E30
- sideBar.border#46494C
- sideBar.dropBackground#9AA5B121
- sideBar.foreground#E8EAED
- sideBarSectionHeader.background#34373A
- sideBarTitle.foreground#BDC1C6
- statusBar.background#2C2E30
- statusBar.border#46494C
- statusBar.debuggingBackground#FDD663
- statusBar.debuggingForeground#202124
- statusBar.foreground#E8EAED
- statusBar.noFolderBackground#34373A
- statusBar.noFolderForeground#BDC1C6
- statusBarItem.errorBackground#F28B82
- statusBarItem.errorForeground#202124
- statusBarItem.hoverBackground#34373A
- statusBarItem.prominentBackground#34373A
- statusBarItem.prominentHoverBackground#3C4043
- statusBarItem.remoteBackground#8AB4F8
- statusBarItem.remoteForeground#202124
- statusBarItem.warningBackground#FDD663
- statusBarItem.warningForeground#202124
- tab.activeBackground#242628
- tab.activeBorderTop#9AA5B1
- tab.activeForeground#E8EAED
- tab.activeModifiedBorder#FDD663
- tab.border#34373A
- tab.hoverBackground#3C4043
- tab.hoverBorder#3C4043
- tab.hoverForeground#E8EAED
- tab.inactiveBackground#34373A
- tab.inactiveForeground#9AA0A6
- tab.lastPinnedBorder#46494C
- tab.unfocusedActiveBorderTop#FDD66387
- tab.unfocusedHoverBackground#3C4043
- terminal.ansiBlack#242628
- terminal.ansiBlue#8AB4F8
- terminal.ansiBrightBlack#9AA0A6
- terminal.ansiBrightBlue#8AB4F8CC
- terminal.ansiBrightCyan#ADB8C4
- terminal.ansiBrightGreen#81C995CC
- terminal.ansiBrightMagenta#F28B82CC
- terminal.ansiBrightRed#F28B82CC
- terminal.ansiBrightWhite#E8EAED
- terminal.ansiBrightYellow#FDD663CC
- terminal.ansiCyan#9AA5B1
- terminal.ansiGreen#81C995
- terminal.ansiMagenta#F28B82
- terminal.ansiRed#F28B82
- terminal.ansiWhite#BDC1C6
- terminal.ansiYellow#FDD663
- terminal.background#242628
- terminal.foreground#E8EAED
- terminalCursor.foreground#9AA5B1
- testing.iconErrored#F28B82CC
- testing.iconFailed#F28B82
- testing.iconPassed#81C995
- testing.iconQueued#FDD663
- testing.iconSkipped#9AA0A6
- testing.peekBorder#46494C
- textBlockQuote.background#2C2E30
- textBlockQuote.border#46494C
- textCodeBlock.background#34373A
- textLink.activeForeground#9AA5B1
- textLink.foreground#8AB4F8
- textPreformat.foreground#BDC1C6
- textSeparator.foreground#46494C
- titleBar.activeBackground#2C2E30
- titleBar.activeForeground#E8EAED
- titleBar.border#46494C
- titleBar.inactiveBackground#2C2E30
- titleBar.inactiveForeground#9AA0A6
- widget.shadow#00000099
- window.activeBorder#9AA5B1
- window.inactiveBorder#46494C
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #5F6368 | italic |
| keyword | #AECBFA | bold |
| entity.name.function | #A8C7FA | — |
| variable, meta.definition.variable | #E8EAED | — |
| string | #78D9A8 | — |
| constant.numeric | #FDD663 | — |
| constant.language, constant.character | #AECBFA | — |
| storage.type, storage.modifier | #C58AF9 | — |
| entity.name.type, support.type, support.class | #8AB4F8 | — |
| punctuation, meta.brace | #BDC1C6 | — |
| invalid, invalid.illegal | #F28B82 | underline |
| markup.bold, markup.bold.markdown | #E8EAED | bold |
| markup.italic, markup.italic.markdown | #E8EAED | italic |
| markup.inline.raw, markup.raw.inline, markup.inline.code | #E8EAED | — |
| markup.heading, entity.name.section, punctuation.definition.heading.markdown | #9AA5B1 | bold |
| heading.1.markdown, markup.heading.setext.1.markdown | #AECBFA | bold |
| heading.2.markdown, markup.heading.setext.2.markdown | #8AB4F8 | bold |
| heading.3.markdown | #78D9A8 | bold |
| heading.4.markdown | #FDD663 | bold |
| heading.5.markdown | #F5A8AB | bold |
| heading.6.markdown | #9AA0A6 | bold |
| entity.name.tag.html, entity.name.tag.xml | #F7B883 | bold |
| entity.name.tag.structure.any.html, entity.name.tag.block.any.html | #FFD166 | bold |
| entity.name.tag.inline.any.html | #EADCB2 | — |
| entity.name.tag.script.html, entity.name.tag.style.html | #FF3CAC | bold |
| entity.other.attribute-name.html, entity.other.attribute-name.xml | #EADCB2 | italic |
| entity.other.attribute-name.class.html, entity.other.attribute-name.class.css | #C8B0FF | italic bold |
| entity.other.attribute-name.id.html, entity.other.attribute-name.id.css | #4CFFCA | italic bold |
| entity.other.attribute-name.style.html | #FF8BDA | italic |
| entity.other.attribute-name.event.html | #D8C8FF | italic |
| string.quoted.double.html, string.quoted.single.html | #00F5A0 | — |
| meta.attribute-with-value.html string | #98FF66 | — |
| punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html | #A6AAB4 | — |
| punctuation.definition.tag.html, punctuation.separator.key-value.html | #8E93A6 | — |
| punctuation.definition.string.begin.html, punctuation.definition.string.end.html | #9AA0B4 | — |
| comment.block.html, punctuation.definition.comment.html | #8E93A6 | italic |
| constant.character.entity.html, constant.character.entity.named.html | #F2C97D | bold |
| punctuation.definition.entity.html | #FFD166 | — |
| meta.tag.sgml.doctype.html, entity.name.tag.doctype.html | #FF3CAC | bold |
| keyword.doctype.xml | #FF3CAC | bold |
| source.css.embedded.html | #E0CCFF | — |
| meta.embedded.block.css | #D7C7FF | — |
| source.js.embedded.html, source.javascript.embedded.html | #F7B883 | — |
| meta.embedded.block.javascript | #EADCB2 | — |
| entity.name.tag.form.html, entity.name.tag.input.html, entity.name.tag.button.html | #79E49A | bold |
| entity.other.attribute-name.form.html | #98FF66 | italic |
| entity.name.tag.table.html, entity.name.tag.tr.html, entity.name.tag.td.html, entity.name.tag.th.html | #4CFFCA | bold |
| entity.name.tag.img.html, entity.name.tag.video.html, entity.name.tag.audio.html | #FFD166 | bold |
| entity.name.tag.a.html | #4CFFCA | bold |
| entity.other.attribute-name.href.html | #00F5A0 | italic bold |
| entity.name.tag.header.html, entity.name.tag.main.html, entity.name.tag.footer.html, entity.name.tag.nav.html, entity.name.tag.aside.html, entity.name.tag.section.html, entity.name.tag.article.html, entity.name.tag.figure.html, entity.name.tag.figcaption.html | #C8B0FF | bold |
| text.html.basic | #F7F8FA | — |
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#00FF7F
- activityBar.background#00110A
- activityBar.border#00000000
- activityBar.foreground#B8FFCE
- activityBar.inactiveForeground#88AA99
- activityBarBadge.background#00FF7F
- activityBarBadge.foreground#00110A
- badge.background#00FF7F
- badge.foreground#00110A
- breadcrumb.activeSelectionForeground#00FF7F
- breadcrumb.background#00110A
- breadcrumb.focusForeground#CCFFDD
- breadcrumb.foreground#88AA99
- breadcrumbPicker.background#0A3322
- button.background#00FF7F
- button.foreground#00110A
- button.hoverBackground#33FF99
- checkbox.background#001A10
- checkbox.border#001A10
- checkbox.foreground#B8FFCE
- debugIcon.breakpointForeground#AA8888
- debugToolBar.background#00110A
- diffEditor.insertedLineBackground#00FF7F1A
- diffEditor.insertedTextBackground#00FF7F21
- diffEditor.removedLineBackground#AA88881A
- diffEditor.removedTextBackground#AA888821
- dropdown.background#00110A
- dropdown.border#001A10
- dropdown.foreground#CCFFDD
- editor.background#000000
- editor.findMatchBackground#88AA9960
- editor.findMatchBorder#88AA99
- editor.findMatchHighlightBackground#88AA9930
- editor.findMatchHighlightBorder#88AA9987
- editor.focusedStackFrameHighlightBackground#00FF7F1A
- editor.foldBackground#00110A80
- editor.foreground#CCFFDD
- editor.hoverHighlightBackground#001A1080
- editor.inactiveSelectionBackground#00FF7F18
- editor.lineHighlightBackground#001A1050
- editor.selectionBackground#00FF7F35
- editor.selectionHighlightBackground#00FF7F20
- editor.selectionHighlightBorder#00FF7F54
- editor.stackFrameHighlightBackground#88AA991A
- editor.wordHighlightBackground#33FF9928
- editor.wordHighlightStrongBackground#33FF9938
- editorBracketHighlight.foreground1#00FF7F
- editorBracketHighlight.foreground2#88AA99
- editorBracketHighlight.foreground3#AA8888
- editorBracketHighlight.foreground4#00FF7F
- editorBracketHighlight.foreground5#00FF7F
- editorBracketHighlight.foreground6#33FF99
- editorBracketMatch.background#00FF7F30
- editorBracketMatch.border#00FF7F90
- editorBracketPairGuide.activeBackground1#00FF7F54
- editorBracketPairGuide.activeBackground2#88AA9954
- editorBracketPairGuide.activeBackground3#AA888854
- editorBracketPairGuide.activeBackground4#00FF7F54
- editorBracketPairGuide.activeBackground5#00FF7F54
- editorBracketPairGuide.activeBackground6#33FF9954
- editorCursor.foreground#00FF7F
- editorError.foreground#AA8888
- editorGroup.dropBackground#00FF7F21
- editorGroupHeader.border#001A10
- editorGroupHeader.tabsBackground#00110A
- editorGroupHeader.tabsBorder#001A10
- editorGutter.addedBackground#00FF7FAB
- editorGutter.commentRangeForeground#88AA99
- editorGutter.deletedBackground#AA8888AB
- editorGutter.modifiedBackground#88AA99AB
- editorHoverWidget.background#0A3322
- editorHoverWidget.border#001A10
- editorIndentGuide.activeBackground1#00FF7F60
- editorIndentGuide.background1#001A1040
- editorInfo.foreground#00FF7F
- editorLineNumber.activeForeground#88AA99
- editorLineNumber.foreground#0A332260
- editorLink.activeForeground#33FF99
- editorOverviewRuler.addedForeground#00FF7F66
- editorOverviewRuler.deletedForeground#AA888866
- editorOverviewRuler.errorForeground#AA8888AB
- editorOverviewRuler.findMatchForeground#88AA9987
- editorOverviewRuler.infoForeground#00FF7F87
- editorOverviewRuler.modifiedForeground#88AA9966
- editorOverviewRuler.warningForeground#88AA99AB
- editorRuler.foreground#001A10
- editorStickyScroll.background#000000F2
- editorStickyScrollHover.background#00110A
- editorUnnecessaryCode.opacity#CCFFDD40
- editorWarning.foreground#88AA99
- editorWhitespace.foreground#001A1050
- editorWidget.background#0A3322
- editorWidget.border#001A10
- editorWidget.resizeBorder#00FF7F
- focusBorder#00FF7F99
- gitDecoration.addedResourceForeground#00FF7F
- gitDecoration.conflictingResourceForeground#AA8888CC
- gitDecoration.deletedResourceForeground#AA8888
- gitDecoration.ignoredResourceForeground#88AA99
- gitDecoration.modifiedResourceForeground#33FF99
- gitDecoration.renamedResourceForeground#00FF7F
- gitDecoration.submoduleResourceForeground#88AA99CC
- gitDecoration.untrackedResourceForeground#B8FFCE
- input.background#00110A
- input.border#001A10
- input.foreground#CCFFDD
- input.placeholderForeground#88AA99
- inputOption.activeBorder#00FF7FAB
- inputValidation.errorBackground#AA88881A
- inputValidation.errorBorder#AA8888
- inputValidation.infoBackground#00FF7F1A
- inputValidation.infoBorder#00FF7F
- inputValidation.warningBackground#88AA991A
- inputValidation.warningBorder#88AA99
- list.activeSelectionBackground#001A10
- list.activeSelectionForeground#CCFFDD
- list.dropBackground#00FF7F21
- list.errorForeground#AA8888
- list.focusBackground#0A3322
- list.highlightForeground#00FF7F
- list.hoverBackground#001A1080
- list.inactiveSelectionBackground#0A332250
- list.warningForeground#88AA99
- listFilterWidget.background#001A10
- listFilterWidget.noMatchesOutline#AA8888AB
- listFilterWidget.outline#00FF7FAB
- menu.background#0A3322
- menu.foreground#CCFFDD
- menu.selectionBackground#001A10
- menu.selectionBorder#001A10
- menu.selectionForeground#CCFFDD
- menu.separatorBackground#001A10
- minimap.background#000000
- minimap.errorHighlight#AA888899
- minimap.findMatchHighlight#88AA9970
- minimap.selectionHighlight#00FF7F60
- minimap.selectionOccurrenceHighlight#00FF7F33
- minimap.warningHighlight#88AA9999
- notificationCenterHeader.foreground#CCFFDD
- notifications.background#0A3322
- notifications.border#001A10
- panel.background#00110A
- panel.border#001A10
- panel.dropBorder#00FF7F
- panelTitle.activeBorder#00FF7F
- panelTitle.activeForeground#CCFFDD
- panelTitle.inactiveForeground#88AA99
- peekView.border#001A10
- peekViewEditor.background#0A3322
- peekViewEditor.matchHighlightBackground#88AA9921
- peekViewEditor.matchHighlightBorder#88AA9987
- peekViewResult.background#001A10
- peekViewResult.matchHighlightBackground#0A3322
- peekViewTitle.background#001A10
- peekViewTitleDescription.foreground#88AA99
- peekViewTitleLabel.foreground#CCFFDD
- pickerGroup.border#001A10
- pickerGroup.foreground#00FF7F
- problemsErrorIcon.foreground#AA8888
- problemsInfoIcon.foreground#00FF7F
- problemsWarningIcon.foreground#88AA99
- progressBar.background#00FF7F
- quickInput.background#000000F8
- quickInput.foreground#CCFFDD
- quickInputTitle.background#0A3322
- sash.hoverBorder#00FF7F
- scrollbar.shadow#00000099
- scrollbarSlider.activeBackground#88AA9970
- scrollbarSlider.background#88AA9930
- scrollbarSlider.hoverBackground#88AA9950
- selection.background#00FF7F33
- sideBar.background#00110A
- sideBar.border#001A1080
- sideBar.dropBackground#00FF7F21
- sideBar.foreground#B8FFCE
- sideBarSectionHeader.background#00000000
- sideBarSectionHeader.foreground#00FF7F
- sideBarTitle.foreground#CCFFDD
- statusBar.background#00110A
- statusBar.border#001A10
- statusBar.debuggingBackground#00FF7F
- statusBar.debuggingForeground#00110A
- statusBar.foreground#B8FFCE
- statusBar.noFolderBackground#001A10
- statusBar.noFolderForeground#B8FFCE
- statusBarItem.errorBackground#AA8888
- statusBarItem.errorForeground#00110A
- statusBarItem.hoverBackground#001A10
- statusBarItem.prominentBackground#001A10
- statusBarItem.prominentHoverBackground#0A3322
- statusBarItem.remoteBackground#00FF7F
- statusBarItem.remoteForeground#00110A
- statusBarItem.warningBackground#88AA99
- statusBarItem.warningForeground#00110A
- tab.activeBackground#000000
- tab.activeBorder#00000000
- tab.activeBorderTop#00FF7F
- tab.activeForeground#CCFFDD
- tab.activeModifiedBorder#88AA99
- tab.border#00000000
- tab.hoverBackground#0A3322
- tab.hoverBorder#0A3322
- tab.hoverForeground#CCFFDD
- tab.inactiveBackground#00110A
- tab.inactiveForeground#88AA99
- tab.lastPinnedBorder#001A10
- tab.unfocusedActiveBorderTop#88AA9987
- tab.unfocusedHoverBackground#0A3322
- terminal.ansiBlack#000000
- terminal.ansiBlue#00FF7F
- terminal.ansiBrightBlack#88AA99
- terminal.ansiBrightBlue#00FF7FCC
- terminal.ansiBrightCyan#33FF99
- terminal.ansiBrightGreen#00FF7FCC
- terminal.ansiBrightMagenta#AA8888CC
- terminal.ansiBrightRed#AA8888CC
- terminal.ansiBrightWhite#CCFFDD
- terminal.ansiBrightYellow#88AA99CC
- terminal.ansiCyan#00FF7F
- terminal.ansiGreen#00FF7F
- terminal.ansiMagenta#AA8888
- terminal.ansiRed#AA8888
- terminal.ansiWhite#B8FFCE
- terminal.ansiYellow#88AA99
- terminal.background#00110A
- terminal.foreground#B8FFCE
- terminalCursor.foreground#00FF7F
- testing.iconErrored#AA8888CC
- testing.iconFailed#AA8888
- testing.iconPassed#00FF7F
- testing.iconQueued#88AA99
- testing.iconSkipped#88AA99
- testing.peekBorder#001A10
- textBlockQuote.background#00110A
- textBlockQuote.border#001A10
- textCodeBlock.background#001A10
- textLink.activeForeground#00FF7F
- textLink.foreground#33FF99
- textPreformat.foreground#B8FFCE
- textSeparator.foreground#001A10
- titleBar.activeBackground#00110A
- titleBar.activeForeground#B8FFCE
- titleBar.border#00000000
- titleBar.inactiveBackground#00110A
- titleBar.inactiveForeground#88AA99
- widget.shadow#00000099
- window.activeBorder#00FF7F
- window.inactiveBorder#001A10
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #88AA99 | italic |
| keyword | #00FF7F | bold |
| entity.name.function | #33FF99 | — |
| variable, meta.definition.variable | #CCFFDD | — |
| string | #00FF7F | — |
| constant.numeric | #33FF99 | — |
| constant.language, constant.character | #B8FFCE | — |
| storage.type, storage.modifier | #00FF7F | — |
| entity.name.type, support.type, support.class | #33FF99 | — |
| punctuation, meta.brace | #CCFFDD | — |
| invalid, invalid.illegal | #AA8888 | underline |
| markup.bold, markup.bold.markdown | #CCFFDD | bold |
| markup.italic, markup.italic.markdown | #CCFFDD | italic |
| markup.inline.raw, markup.raw.inline, markup.inline.code | #CCFFDD | — |
| markup.heading, entity.name.section, punctuation.definition.heading.markdown | #00FF7F | bold |
| heading.1.markdown, markup.heading.setext.1.markdown | #00FF7F | bold |
| heading.2.markdown, markup.heading.setext.2.markdown | #33FF99 | bold |
| heading.3.markdown | #CCFFDD | bold |
| heading.4.markdown | #B8FFCE | bold |
| heading.5.markdown | #88AA99 | bold |
| heading.6.markdown | #88AA99 | bold |
| entity.name.tag.html, entity.name.tag.xml | #F7B883 | bold |
| entity.name.tag.structure.any.html, entity.name.tag.block.any.html | #FFD166 | bold |
| entity.name.tag.inline.any.html | #EADCB2 | — |
| entity.name.tag.script.html, entity.name.tag.style.html | #FF3CAC | bold |
| entity.other.attribute-name.html, entity.other.attribute-name.xml | #EADCB2 | italic |
| entity.other.attribute-name.class.html, entity.other.attribute-name.class.css | #C8B0FF | italic bold |
| entity.other.attribute-name.id.html, entity.other.attribute-name.id.css | #4CFFCA | italic bold |
| entity.other.attribute-name.style.html | #FF8BDA | italic |
| entity.other.attribute-name.event.html | #D8C8FF | italic |
| string.quoted.double.html, string.quoted.single.html | #00F5A0 | — |
| meta.attribute-with-value.html string | #98FF66 | — |
| punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html | #A6AAB4 | — |
| punctuation.definition.tag.html, punctuation.separator.key-value.html | #8E93A6 | — |
| punctuation.definition.string.begin.html, punctuation.definition.string.end.html | #9AA0B4 | — |
| comment.block.html, punctuation.definition.comment.html | #8E93A6 | italic |
| constant.character.entity.html, constant.character.entity.named.html | #F2C97D | bold |
| punctuation.definition.entity.html | #FFD166 | — |
| meta.tag.sgml.doctype.html, entity.name.tag.doctype.html | #FF3CAC | bold |
| keyword.doctype.xml | #FF3CAC | bold |
| source.css.embedded.html | #E0CCFF | — |
| meta.embedded.block.css | #D7C7FF | — |
| source.js.embedded.html, source.javascript.embedded.html | #F7B883 | — |
| meta.embedded.block.javascript | #EADCB2 | — |
| entity.name.tag.form.html, entity.name.tag.input.html, entity.name.tag.button.html | #79E49A | bold |
| entity.other.attribute-name.form.html | #98FF66 | italic |
| entity.name.tag.table.html, entity.name.tag.tr.html, entity.name.tag.td.html, entity.name.tag.th.html | #4CFFCA | bold |
| entity.name.tag.img.html, entity.name.tag.video.html, entity.name.tag.audio.html | #FFD166 | bold |
| entity.name.tag.a.html | #4CFFCA | bold |
| entity.other.attribute-name.href.html | #00F5A0 | italic bold |
| entity.name.tag.header.html, entity.name.tag.main.html, entity.name.tag.footer.html, entity.name.tag.nav.html, entity.name.tag.aside.html, entity.name.tag.section.html, entity.name.tag.article.html, entity.name.tag.figure.html, entity.name.tag.figcaption.html | #C8B0FF | bold |
| text.html.basic | #F7F8FA | — |