Sprinkle Pack
Publisher: Kagan MamakThemes in package: 15
A VS Code extension containing multiple custom color themes, allowing users to choose their preferred 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.background#334233
- activityBar.foreground#FF4444
- activityBarBadge.background#66BB66
- activityBarBadge.foreground#2A352A
- breadcrumb.activeSelectionForeground#FFFFFF
- breadcrumb.background#2A352A
- breadcrumb.foreground#BFBFBF
- breadcrumb.separatorForeground#AAAAAA
- button.background#FF4444
- button.foreground#FFFFFF
- button.hoverBackground#66BB66
- debugToolBar.background#2A352A
- dropdown.background#2A352A
- dropdown.border#339933
- dropdown.foreground#F0F0F0
- editor.background#162016
- editor.findMatchBackground#E60000AA
- editor.findMatchHighlightBackground#FF555544
- editor.findRangeHighlightBackground#2E3E2E33
- editor.foreground#F0F0F0
- editor.lineHighlightBackground#253025
- editor.selectionBackground#D6000025
- editor.selectionForeground#F0F0F0
- editor.selectionHighlightBackground#2E3E2E55
- editor.wordHighlightBackground#DD333333
- editor.wordHighlightStrongBackground#FF444455
- editorBracketHighlight.foreground1#FF4444
- editorBracketHighlight.foreground2#339933
- editorBracketHighlight.foreground3#FF3333
- editorBracketHighlight.foreground4#66BB66
- editorBracketHighlight.foreground5#AA2222
- editorBracketHighlight.foreground6#229922
- editorBracketMatch.background#2A382A
- editorBracketMatch.border#FF4444
- editorCursor.foreground#D60000
- editorError.foreground#FF5A5A
- editorGroup.border#339933
- editorGroup.dropBackground#33993333
- editorGroup.dropIntoPromptBackground#253025
- editorGroup.dropIntoPromptForeground#F0F0F0
- editorGroupHeader.tabsBackground#1E251E
- editorGutter.background#1E251E
- editorHoverWidget.background#2A352A
- editorHoverWidget.border#339933
- editorHoverWidget.foreground#F0F0F0
- editorHoverWidget.highlightForeground#66BB66
- editorIndentGuide.background#66BB6622
- editorInfo.foreground#00CC99
- editorInlayHint.background#334233
- editorInlayHint.foreground#AAAAAA
- editorLightBulb.foreground#FFAA33
- editorLightBulbAutoFix.foreground#66BB66
- editorLineNumber.activeForeground#FFFFFF
- editorLineNumber.foreground#66BB66
- editorLink.activeForeground#66BB66
- editorOverviewRuler.border#2A352A
- editorOverviewRuler.bracketMatchForeground#FF4444AA
- editorOverviewRuler.errorForeground#FF5A5A88
- editorOverviewRuler.findMatchForeground#E60000AA
- editorOverviewRuler.infoForeground#00CC9988
- editorOverviewRuler.warningForeground#FFAA3388
- editorOverviewRuler.wordHighlightForeground#DD333355
- editorOverviewRuler.wordHighlightStrongForeground#FF444455
- editorRuler.foreground#339933
- editorStickyScroll.background#1E251E
- editorStickyScrollHover.background#253025
- editorSuggestWidget.background#2A352A
- editorSuggestWidget.foreground#F0F0F0
- editorSuggestWidget.highlightForeground#FF4444
- editorSuggestWidget.selectedBackground#334233
- editorSymbolHighlightBackground#66BB6644
- editorUnicodeHighlight.background#2A352A88
- editorUnicodeHighlight.border#FF4444
- editorWarning.foreground#FFAA33
- editorWhitespace.foreground#66BB6644
- editorWidget.background#2A352A
- editorWidget.foreground#F0F0F0
- focusBorder#FF4444
- input.background#334233
- input.border#339933
- input.foreground#F0F0F0
- input.placeholderForeground#AAAAAA
- list.activeSelectionBackground#33993344
- list.activeSelectionForeground#FFFFFF
- list.hoverBackground#33993322
- list.hoverForeground#F0F0F0
- list.inactiveSelectionBackground#334233
- list.inactiveSelectionForeground#DDDDDD
- minimap.background#1E251E
- minimap.errorHighlight#FF5A5A44
- minimap.findMatchHighlight#FF444488
- minimap.selectionHighlight#66BB6688
- minimap.warningHighlight#FFAA3344
- notification.background#2A352A
- notification.buttonBackground#FF4444
- notification.buttonForeground#FFFFFF
- notification.foreground#F0F0F0
- panel.background#2A352A
- panel.border#339933
- panelTitle.activeBorder#339933
- panelTitle.activeForeground#FF4444
- panelTitle.inactiveForeground#66BB66
- peekViewEditor.background#2A352A
- peekViewResult.background#334233
- peekViewTitle.background#334233
- scrollbarSlider.activeBackground#FF4444
- scrollbarSlider.background#AAAAAA80
- scrollbarSlider.hoverBackground#339933AA
- settings.headerForeground#FF4444
- settings.modifiedItemIndicator#FFAA33
- sideBar.background#2A352A
- sideBar.border#339933
- sideBar.foreground#F0F0F0
- sideBarSectionHeader.foreground#339933
- sideBarTitle.foreground#FF4444
- statusBar.background#2A352A
- statusBar.debuggingBackground#FF4444
- statusBar.debuggingForeground#2A352A
- statusBar.foreground#F0F0F0
- statusBar.noFolderBackground#2A352A
- tab.activeBackground#2A352A
- tab.activeForeground#FF4444
- tab.border#339933
- tab.hoverBackground#2A352A
- tab.inactiveBackground#334233
- tab.inactiveForeground#66BB66
- tab.unfocusedActiveForeground#339933
- tab.unfocusedHoverBackground#334233
- tab.unfocusedInactiveForeground#AAAAAA
- terminal.background#2A352A
- terminal.foreground#F0F0F0
- terminalCursor.foreground#FF4444
- titleBar.activeBackground#2A352A
- titleBar.activeForeground#66BB66
- titleBar.border#339933
- titleBar.inactiveBackground#334233
- titleBar.inactiveForeground#BBBBBB
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| constant.language | #FF4444 | bold |
| support.variable | #FFAA33 | — |
| constant.other | #66BB66 | — |
| meta.import, meta.import.ts, meta.import.js | #FF4444 | — |
| entity.name.module.js, entity.name.module.ts | #66BB66 | — |
| meta.function | #FF4444 | — |
| meta.enum | #66BB66 | — |
| keyword.control.flow | #FF5A5A | bold |
| meta.decorator, meta.decorator punctuation, entity.name.function.decorator | #FF4444 | — |
| meta.return-type | #66BB66 | — |
| meta.arrow | #FF4444 | — |
| meta.embedded.block | #F0F0F0 | — |
| markup.inline.raw | #FFAA33 | italic |
| markup.inserted | #339933 | italic |
| markup.deleted | #FF5A5A | italic |
| markup.list | #FFAA33 | — |
| markup.underline | #FF4444 | underline |
| markup.strikethrough | #FF5A5A | strikethrough |
| constant.character.escape | #00CC99 | bold |
| meta.annotation | #FFAA33 | — |
| storage.type.function.arrow | #FF4444 | — |
| meta.type.annotation, meta.type | #66BB66 | — |
| keyword.other.unit | #FFAA33 | — |
| comment, punctuation.definition.comment | #66BB66 | italic |
| string, constant.other.symbol | #FF4444 | — |
| constant.numeric | #66BB66 | — |
| constant.language.boolean, constant.language | #339933 | bold |
| keyword, storage.type, storage.modifier | #FF4444 | — |
| keyword.operator | #66BB66 | — |
| variable, identifier, variable.language | #339933 | — |
| entity.name.function, support.function, meta.function-call | #FF4444 | bold |
| variable.parameter | #66BB66 | — |
| entity.name.type, support.type, entity.name.class | #339933 | — |
| punctuation | #F0F0F0 | — |
| invalid, invalid.illegal | #182418 | — |
| markup.heading | #FF4444 | bold |
| markup.bold | #66BB66 | bold |
| markup.italic, markup.quote | #339933 | italic |
| entity.name.tag, support.class.component | #FF4444 | — |
| support.constant, constant.other | #66BB66 | — |
| meta.object-literal.key | #339933 | — |
| support.type.property-name | #66BB66 | — |
| entity.other.attribute-name | #FF4444 | — |