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#F1EFEC
- activityBar.foreground#2E2C2B
- activityBar.inactiveForeground#A8A4A1
- activityBarBadge.background#84A59D
- activityBarBadge.foreground#FAF8F5
- breadcrumb.activeSelectionForeground#2E2C2B
- breadcrumb.background#FAF8F5
- breadcrumb.focusForeground#2E2C2B
- breadcrumb.foreground#A8A4A1
- breadcrumb.separatorForeground#BCB8B1
- button.background#A3B18A
- button.border#A3B18A
- button.foreground#FAF8F5
- debugToolBar.background#FAF8F5
- dropdown.background#FFFFFF
- dropdown.border#E1DDD7
- dropdown.foreground#2E2C2B
- editor.background#FAF8F5
- editor.findMatchBackground#DDBEA955
- editor.findMatchHighlightBackground#DDBEA933
- editor.findRangeHighlightBackground#DDBEA922
- editor.foreground#2E2C2B
- editor.lineHighlightBackground#F1EFEC
- editor.selectionBackground#E6E2DD
- editor.selectionForeground#2E2C2B
- editor.selectionHighlightBackground#ECE6DF
- editor.wordHighlightBackground#EEE8E2
- editor.wordHighlightStrongBackground#D9D3CD
- editorBracketHighlight.foreground1#84A59D
- editorBracketHighlight.foreground2#A3B18A
- editorBracketHighlight.foreground3#DDBEA9
- editorBracketHighlight.foreground4#F2CC8F
- editorBracketHighlight.foreground5#E07A5F
- editorBracketHighlight.foreground6#B5E48C
- editorBracketMatch.background#ECE6DF
- editorBracketMatch.border#84A59D
- editorCodeLens.foreground#A8A4A1
- editorCursor.foreground#A3B18A
- editorError.foreground#E07A5F
- editorGroup.border#E1DDD7
- editorGroup.dropBackground#DDBEA933
- editorGroup.dropIntoPromptBackground#FAF8F5
- editorGroup.dropIntoPromptForeground#2E2C2B
- editorGroupHeader.tabsBackground#FAF8F5
- editorGroupHeader.tabsBorder#E1DDD7
- editorGutter.background#FAF8F5
- editorGutter.modifiedBackground#BCB8B1
- editorHoverWidget.background#FFFFFF
- editorHoverWidget.border#E1DDD7
- editorHoverWidget.foreground#2E2C2B
- editorHoverWidget.highlightForeground#A3B18A
- editorIndentGuide.background#EAE6E1
- editorInfo.foreground#8EC5FC
- editorInlayHint.background#ECE6DF
- editorInlayHint.foreground#938F8C
- editorLightBulb.foreground#F2CC8F
- editorLightBulbAutoFix.foreground#A3B18A
- editorLineNumber.activeForeground#2E2C2B
- editorLineNumber.foreground#A8A4A1
- editorLink.activeForeground#84A59D
- editorOverviewRuler.border#E1DDD7
- editorOverviewRuler.bracketMatchForeground#84A59D88
- editorOverviewRuler.errorForeground#E07A5F88
- editorOverviewRuler.findMatchForeground#DDBEA988
- editorOverviewRuler.infoForeground#8EC5FC88
- editorOverviewRuler.warningForeground#F2CC8F88
- editorOverviewRuler.wordHighlightForeground#ECE6DF88
- editorOverviewRuler.wordHighlightStrongForeground#D9D3CD88
- editorRuler.foreground#E1DDD7
- editorStickyScroll.background#FAF8F5
- editorStickyScrollHover.background#F1EFEC
- editorSuggestWidget.background#F8F5F1
- editorSuggestWidget.foreground#2E2C2B
- editorSuggestWidget.highlightForeground#A3B18A
- editorSuggestWidget.selectedBackground#ECE6DF
- editorSymbolHighlightBackground#DDBEA922
- editorUnicodeHighlight.background#E07A5F22
- editorUnicodeHighlight.border#E07A5F
- editorWarning.foreground#F2CC8F
- editorWhitespace.background#FAF8F5
- editorWhitespace.foreground#E2DFDA
- editorWidget.background#F8F5F1
- editorWidget.foreground#2E2C2B
- focusBorder#84A59D
- input.background#FFFFFF
- input.border#E1DDD7
- input.foreground#2E2C2B
- input.placeholderForeground#A8A4A1
- inputOption.activeBackground#ECE6DF
- inputOption.activeBorder#A3B18A
- inputOption.activeForeground#2E2C2B
- list.activeSelectionBackground#ECE6DF
- list.activeSelectionForeground#2E2C2B
- list.hoverBackground#EAE6E1
- list.hoverForeground#2E2C2B
- list.inactiveSelectionBackground#F1EFEC
- list.inactiveSelectionForeground#2E2C2B
- minimap.background#FAF8F5
- minimap.errorHighlight#E07A5F66
- minimap.findMatchHighlight#DDBEA944
- minimap.selectionHighlight#E6E2DD
- minimap.warningHighlight#F2CC8F66
- notification.background#F8F5F1
- notification.foreground#2E2C2B
- panel.background#FAF8F5
- panel.border#E1DDD7
- panelTitle.activeBorder#A3B18A
- panelTitle.activeForeground#84A59D
- panelTitle.hoverForeground#2E2C2B
- panelTitle.inactiveForeground#A8A4A1
- peekViewEditor.background#F8F5F1
- peekViewResult.background#F1EFEC
- peekViewTitle.background#F1EFEC
- scrollbarSlider.activeBackground#84A59D
- scrollbarSlider.background#BCB8B188
- scrollbarSlider.hoverBackground#A3B18AAA
- settings.headerForeground#DDBEA9
- settings.modifiedItemIndicator#A3B18A
- sideBar.background#F8F5F1
- sideBar.border#E1DDD7
- sideBar.foreground#2E2C2B
- sideBarSectionHeader.foreground#A3B18A
- sideBarTitle.foreground#2E2C2B
- statusBar.background#F1EFEC
- statusBar.debuggingBackground#E07A5F
- statusBar.debuggingForeground#FAF8F5
- statusBar.foreground#2E2C2B
- statusBar.noFolderBackground#F1EFEC
- tab.activeBackground#FAF8F5
- tab.activeForeground#2E2C2B
- tab.border#E1DDD7
- tab.hoverBackground#F1EFEC
- tab.inactiveBackground#F1EFEC
- tab.inactiveForeground#A8A4A1
- tab.unfocusedActiveForeground#84A59D
- tab.unfocusedHoverBackground#ECE6DF
- tab.unfocusedInactiveForeground#BCB8B1
- terminal.ansiBlack#BCB8B1
- terminal.ansiBlue#84A59D
- terminal.ansiBrightBlack#BCB8B1
- terminal.ansiBrightBlue#A0C4FF
- terminal.ansiBrightCyan#B6DFF7
- terminal.ansiBrightGreen#C1E1C1
- terminal.ansiBrightMagenta#E9CFC4
- terminal.ansiBrightRed#E29578
- terminal.ansiBrightWhite#000000
- terminal.ansiBrightYellow#FFE8A3
- terminal.ansiCyan#8EC5FC
- terminal.ansiGreen#B5E48C
- terminal.ansiMagenta#DDBEA9
- terminal.ansiRed#E07A5F
- terminal.ansiWhite#2E2C2B
- terminal.ansiYellow#F2CC8F
- terminal.background#FAF8F5
- terminal.foreground#2E2C2B
- terminalCursor.foreground#A3B18A
- titleBar.activeBackground#F1EFEC
- titleBar.activeForeground#2E2C2B
- titleBar.border#E1DDD7
- titleBar.inactiveBackground#F1EFEC
- titleBar.inactiveForeground#A8A4A1
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #A6A39E | italic |
| string, constant.other.symbol | #7C9A6D | — |
| constant.numeric | #A071A1 | bold |
| constant.language.boolean, constant.language | #568EA6 | bold |
| keyword, storage.type, storage.modifier | #A3654B | bold |
| keyword.operator | #C17878 | — |
| variable, identifier, variable.language | #3A3A3A | — |
| entity.name.function, support.function, meta.function-call | #5C8374 | — |
| variable.parameter | #C78C57 | — |
| entity.name.type, support.type, entity.name.class | #568EA6 | — |
| support.constant, constant.other | #D4A373 | — |
| punctuation, punctuation.definition.parameters | #9B958D | — |
| invalid, invalid.illegal | #FAF8F5 | — |
| markup.heading | #B08968 | bold |
| markup.list | #A06CD5 | — |
| markup.bold | #3A3A3A | bold |
| markup.italic, markup.quote | #84A59D | italic |
| meta.object-literal.key | #A06045 | — |
| entity.name.tag | #D1776A | — |
| support.class.component | #7F7F9A | — |
| support.type.property-name | #B08968 | — |
| meta.jsx.children | #6C9B80 | — |
| meta.tag.attributes, entity.other.attribute-name.jsx | #649DA7 | — |
| storage.type.function.arrow | #A3B18A | — |
| meta.function | #5C8374 | — |
| entity.name.module.js, entity.name.module.ts | #B08968 | — |
| support.variable | #AC92B4 | — |
| meta.import, meta.import.ts, meta.import.js | #6A91AC | — |
| keyword.control.flow | #D1776A | bold |
| meta.decorator, entity.name.function.decorator | #B08968 | — |
| meta.enum | #8FB88B | — |
| meta.type.annotation, meta.type | #A071A1 | — |
| markup.inline.raw | #A06045 | italic |
| markup.underline | #C792EA | underline |
| markup.strikethrough | #D1776A | strikethrough |
| constant.character.escape | #568EA6 | bold |
| support.type.property-name.json | #C48E73 | — |