Shadow Theme — VS Code Color & Icon Themes
Publisher: Raza RaheemThemes in package: 30
30 hand-crafted VS Code color themes — dark, light & OLED — plus 450+ file icons. Anime, minimal & pro styles with a built-in theme switcher.
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.background#1A1B26
- activityBar.border#292E42
- activityBar.foreground#C0CAF5
- activityBar.inactiveForeground#565F89
- activityBarBadge.background#7AA2F7
- activityBarBadge.foreground#16161E
- badge.background#7AA2F7
- badge.foreground#16161E
- breadcrumb.activeSelectionForeground#C0CAF5
- breadcrumb.focusForeground#C0CAF5
- breadcrumb.foreground#565F89
- button.background#7AA2F7
- button.foreground#16161E
- button.hoverBackground#89B4FA
- descriptionForeground#565F89
- diffEditor.insertedLineBackground#9ECE6A33
- diffEditor.insertedTextBackground#9ECE6A33
- diffEditor.modifiedTextBackground#283457
- diffEditor.removedLineBackground#F7768E33
- diffEditor.removedTextBackground#F7768E33
- dropdown.background#1F2335
- dropdown.border#292E42
- dropdown.foreground#C0CAF5
- editor.background#16161E
- editor.findMatchBackground#FF9E6466
- editor.findMatchBorder#E0AF68
- editor.findMatchHighlightBackground#FF9E6433
- editor.foreground#C0CAF5
- editor.hoverHighlightBackground#28345766
- editor.inactiveSelectionBackground#1F2335
- editor.lineHighlightBackground#1F2335
- editor.selectionBackground#283457
- editor.selectionHighlightBackground#28345766
- editor.wordHighlightBackground#28345780
- editor.wordHighlightStrongBackground#283457AA
- editorBracketHighlight.foreground1#7AA2F7
- editorBracketHighlight.foreground2#BB9AF7
- editorBracketHighlight.foreground3#9ECE6A
- editorBracketHighlight.foreground4#E0AF68
- editorBracketMatch.background#7AA2F733
- editorBracketMatch.border#7AA2F7
- editorCursor.foreground#7AA2F7
- editorError.foreground#F7768E
- editorGroup.border#292E42
- editorGroupHeader.tabsBackground#1A1B26
- editorGroupHeader.tabsBorder#292E42
- editorGutter.addedBackground#9ECE6A
- editorGutter.deletedBackground#F7768E
- editorGutter.modifiedBackground#E0AF68
- editorHint.foreground#9ECE6A
- editorIndentGuide.activeBackground1#565F89
- editorIndentGuide.background1#292E42
- editorInfo.foreground#7AA2F7
- editorLineNumber.activeForeground#C0CAF5
- editorLineNumber.foreground#565F89
- editorLink.activeForeground#7AA2F7
- editorWarning.foreground#E0AF68
- errorForeground#F7768E
- focusBorder#7AA2F7
- foreground#C0CAF5
- gitDecoration.addedResourceForeground#9ECE6A
- gitDecoration.deletedResourceForeground#F7768E
- gitDecoration.ignoredResourceForeground#565F89
- gitDecoration.modifiedResourceForeground#E0AF68
- gitDecoration.untrackedResourceForeground#565F89
- icon.foreground#C0CAF5
- input.background#1F2335
- input.border#292E42
- input.foreground#C0CAF5
- input.placeholderForeground#565F89
- list.activeSelectionBackground#283457
- list.activeSelectionForeground#C0CAF5
- list.deemphasizedForeground#6E738D
- list.focusOutline#7AA2F7
- list.hoverBackground#1F2335
- list.hoverForeground#C0CAF5
- list.inactiveSelectionBackground#1F2335
- list.inactiveSelectionForeground#C0CAF5
- minimap.findMatchHighlight#FF9E6466
- minimap.selectionHighlight#283457
- notificationCenterHeader.background#16161E
- notifications.background#1A1B26
- notifications.border#292E42
- notifications.foreground#C0CAF5
- panel.background#1A1B26
- panel.border#292E42
- panelTitle.activeForeground#C0CAF5
- panelTitle.inactiveForeground#565F89
- peekView.border#7AA2F7
- peekViewEditor.background#1A1B26
- peekViewResult.background#1A1B26
- peekViewTitle.background#16161E
- progressBar.background#7AA2F7
- scrollbarSlider.activeBackground#FFFFFF44
- scrollbarSlider.background#FFFFFF22
- scrollbarSlider.hoverBackground#FFFFFF33
- sideBar.background#1A1B26
- sideBar.border#292E42
- sideBar.foreground#C0CAF5
- sideBarSectionHeader.background#16161E
- sideBarSectionHeader.foreground#C0CAF5
- sideBarTitle.foreground#C0CAF5
- statusBar.background#1A1B26
- statusBar.border#292E42
- statusBar.debuggingBackground#7AA2F7
- statusBar.foreground#C0CAF5
- statusBar.noFolderBackground#1A1B26
- tab.activeBackground#16161E
- tab.activeBorder#7AA2F7
- tab.activeForeground#C0CAF5
- tab.border#292E42
- tab.inactiveBackground#1A1B26
- tab.inactiveForeground#565F89
- terminal.ansiBlack#16161E
- terminal.ansiBlue#7AA2F7
- terminal.ansiBrightBlack#565F89
- terminal.ansiBrightBlue#89B4FA
- terminal.ansiBrightCyan#99D4FF
- terminal.ansiBrightGreen#B9F27C
- terminal.ansiBrightMagenta#CBA6F7
- terminal.ansiBrightRed#FF7A93
- terminal.ansiBrightWhite#D5E0FF
- terminal.ansiBrightYellow#E9C07B
- terminal.ansiCyan#7DCFFF
- terminal.ansiGreen#9ECE6A
- terminal.ansiMagenta#BB9AF7
- terminal.ansiRed#F7768E
- terminal.ansiWhite#C0CAF5
- terminal.ansiYellow#E0AF68
- terminal.background#16161E
- terminal.foreground#C0CAF5
- titleBar.activeBackground#1A1B26
- titleBar.activeForeground#C0CAF5
- titleBar.border#292E42
- titleBar.inactiveBackground#1A1B26
- titleBar.inactiveForeground#565F89
- widget.shadow#00000040
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #565F89 | italic |
| string, string.quoted, string.template | #9ECE6A | — |
| constant.numeric | #FF9E64 | — |
| constant.language, constant.language.null | #9D7CD8 | — |
| keyword, keyword.control, storage.modifier, meta.decorator, punctuation.decorator | #BB9AF7 | — |
| keyword.operator | #6E738D | — |
| storage.type | #7DCFFF | — |
| constant.language.boolean | #9D7CD8 | — |
| string.regexp | #7AA2F7 | — |
| entity.name.function, support.function, meta.function-call | #7AA2F7 | — |
| entity.name.type, entity.name.class, support.type, support.class | #7DCFFF | — |
| variable, variable.other, variable.parameter | #E0AF68 | — |
| entity.name.tag, meta.tag | #BB9AF7 | — |
| entity.other.attribute-name | #E0AF68 | — |
| constant.character.escape | #7AA2F7 | — |
| invalid, invalid.illegal | #F7768E | — |
| markup.heading | #7AA2F7 | bold |
| markup.bold | #C0CAF5 | bold |
| markup.italic | #BB9AF7 | italic |
| markup.underline.link, string.other.link | #7AA2F7 | — |
| markup.inline.raw, markup.fenced_code | #FF9E64 | — |
| markup.fenced_code | — | — |
| markup.quote | #565F89 | italic |
| markup.list, punctuation.definition.list | #7DCFFF | — |
| markup.inserted | #9ECE6A | — |
| markup.deleted | #F7768E | — |
| punctuation, meta.brace | #6E738D | — |