Cherry Blossom Theme
Publisher: daitsukuThemes in package: 15
A VSCode theme inspired by a color palette of a sakura / cherry blossom.
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#151515
- activityBar.border#1F1F1F
- activityBar.foreground#D996A2
- activityBar.inactiveForeground#8C5866
- activityBarBadge.background#D96A7E
- activityBarBadge.foreground#F2F0F2
- breadcrumb.activeSelectionForeground#F2F0F2
- breadcrumb.focusForeground#F2F0F2
- breadcrumb.foreground#BF8E97
- breadcrumbPicker.background#121212
- button.background#D96A7E
- button.foreground#F2F0F2
- button.hoverBackground#F24B88
- charts.blue#7DA6A6
- charts.foreground#F2F0F2
- charts.green#7DAD89
- charts.lines#8C5866
- charts.orange#BF8563
- charts.purple#B07DA6
- charts.red#D96A7E
- charts.yellow#BF8563
- debugIcon.breakpointForeground#D96A7E
- debugIcon.startForeground#7DAD89
- debugIcon.stopForeground#D96A7E
- debugToolBar.background#121212
- diffEditor.border#1F1F1F
- diffEditor.insertedTextBackground#7DAD8920
- diffEditor.removedTextBackground#D96A7E20
- editor.background#0D0D0D
- editor.foreground#F2F0F2
- editor.lineHighlightBackground#1F1F1F
- editor.lineHighlightBorder#1F1F1F00
- editor.selectionBackground#D96A7E50
- editor.selectionHighlightBackground#D96A7E30
- editor.wordHighlightBackground#7DA6A630
- editor.wordHighlightStrongBackground#7DA6A650
- editorGroupHeader.tabsBackground#151515
- editorGroupHeader.tabsBorder#1F1F1F
- editorGutter.background#0D0D0D
- editorLineNumber.activeForeground#D996A2
- editorLineNumber.foreground#8C5866
- editorOverviewRuler.currentContentForeground#7DAD89
- editorOverviewRuler.incomingContentForeground#7DA6A6
- editorSuggestWidget.background#121212
- editorSuggestWidget.border#1F1F1F
- editorSuggestWidget.highlightForeground#D996A2
- editorSuggestWidget.selectedBackground#402737
- editorWidget.background#121212
- editorWidget.border#1F1F1F
- extensionButton.prominentBackground#D96A7E
- extensionButton.prominentForeground#F2F0F2
- extensionButton.prominentHoverBackground#F24B88
- gitDecoration.conflictingResourceForeground#BF8563
- gitDecoration.deletedResourceForeground#D96A7E
- gitDecoration.ignoredResourceForeground#8C5866
- gitDecoration.modifiedResourceForeground#7DA6A6
- gitDecoration.untrackedResourceForeground#7DAD89
- input.background#151515
- input.border#8C5866
- input.foreground#F2F0F2
- input.placeholderForeground#BF8E97
- keybindingLabel.background#151515
- keybindingLabel.border#8C5866
- keybindingLabel.bottomBorder#8C5866
- keybindingLabel.foreground#F2F0F2
- list.activeSelectionBackground#402737
- list.activeSelectionForeground#F2F0F2
- list.focusBackground#402737
- list.focusForeground#F2F0F2
- list.highlightForeground#D996A2
- list.hoverBackground#1F1F1F
- list.inactiveSelectionBackground#1F1F1F
- list.inactiveSelectionForeground#F2F0F2
- merge.commonContentBackground#8C586620
- merge.commonHeaderBackground#8C586630
- merge.currentContentBackground#7DAD8920
- merge.currentHeaderBackground#7DAD8940
- merge.incomingContentBackground#7DA6A620
- merge.incomingHeaderBackground#7DA6A640
- notificationCenter.border#1F1F1F
- notificationCenterHeader.background#121212
- notificationCenterHeader.foreground#F2F0F2
- notificationLink.foreground#7DA6A6
- notifications.background#121212
- notifications.border#1F1F1F
- notifications.foreground#F2F0F2
- notificationToast.border#1F1F1F
- panel.background#0D0D0D
- panel.border#1F1F1F
- panelTitle.activeForeground#F2F0F2
- panelTitle.inactiveForeground#BF8E97
- peekView.border#D96A7E
- peekViewEditor.background#0D0D0D
- peekViewEditor.matchHighlightBackground#D96A7E40
- peekViewResult.background#151515
- peekViewResult.matchHighlightBackground#D96A7E40
- peekViewTitle.background#1F1F1F
- scrollbarSlider.activeBackground#D96A7E80
- scrollbarSlider.background#8C586640
- scrollbarSlider.hoverBackground#8C586680
- settings.checkboxBackground#121212
- settings.dropdownBackground#121212
- settings.headerForeground#D996A2
- settings.modifiedItemIndicator#7DA6A6
- settings.numberInputBackground#121212
- settings.textInputBackground#121212
- sideBar.background#121212
- sideBar.border#1F1F1F
- sideBar.foreground#F2F0F2
- statusBar.background#151515
- statusBar.border#1F1F1F
- statusBar.debuggingBackground#D96A7E
- statusBar.foreground#F2F0F2
- statusBar.noFolderBackground#151515
- tab.activeBackground#0D0D0D
- tab.activeBorder#D96A7E
- tab.activeForeground#F2F0F2
- tab.inactiveBackground#151515
- tab.inactiveForeground#BF8E97
- tab.unfocusedActiveBorder#D996A2
- terminal.ansiBlack#1F1F1F
- terminal.ansiBlue#7DA6A6
- terminal.ansiBrightBlack#735448
- terminal.ansiBrightBlue#8EBDC5
- terminal.ansiBrightCyan#8EBDC5
- terminal.ansiBrightGreen#8FD19E
- terminal.ansiBrightMagenta#C88CBD
- terminal.ansiBrightRed#F24B88
- terminal.ansiBrightWhite#F2F0F2
- terminal.ansiBrightYellow#F2A999
- terminal.ansiCyan#7DA6A6
- terminal.ansiGreen#7DAD89
- terminal.ansiMagenta#B07DA6
- terminal.ansiRed#D96A7E
- terminal.ansiWhite#F2F0F2
- terminal.ansiYellow#BF8563
- terminal.background#0D0D0D
- terminal.foreground#F2F0F2
- titleBar.activeBackground#151515
- titleBar.activeForeground#F2F0F2
- titleBar.border#1F1F1F
- titleBar.inactiveBackground#0D0D0D
- titleBar.inactiveForeground#BF8E97
- welcomePage.buttonBackground#151515
- welcomePage.buttonHoverBackground#1F1F1F
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #8C5866 | — |
| variable, string constant.other.placeholder | #F2F0F2 | — |
| constant.other.color | #BF8563 | — |
| invalid, invalid.illegal | #F24B88 | — |
| keyword, storage.type, storage.modifier | #D996A2 | — |
| keyword.operator | #7DA6A6 | — |
| string, constant.other.symbol | #7DAD89 | — |
| constant.numeric | #BF8563 | — |
| constant.language, support.constant, constant.character, constant.escape | #B07DA6 | — |
| entity.name.function, meta.function-call, support.function | #7DA6A6 | — |
| entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution | #D996A2 | — |
| meta.method.declaration, meta.method-call, meta.method | #7DA6A6 | — |
| variable.other.property, support.variable.property | #F2A999 | — |
| meta.object-literal.key | #F2A999 | — |
| entity.name.tag, meta.tag.sgml | #D996A2 | — |
| entity.other.attribute-name | #7DAD89 | — |
| markup.heading | #D996A2 | — |
| markup.bold | #7DA6A6 | bold |
| markup.italic | #7DAD89 | italic |
| punctuation.definition, punctuation.separator, punctuation.terminator | #BF8E97 | — |
| punctuation.definition.block, punctuation.definition.parameters, punctuation.section | #7DA6A6 | — |
| entity.name.type.interface, entity.name.type.struct | #B07DA6 | — |
| meta.decorator, tag.decorator.js entity.name.tag, tag.decorator.js punctuation.definition.tag | #B07DA6 | — |
| template.expression.begin, template.expression.end | #D96A7E | — |
| support.type.property-name.css | #F2A999 | — |
| support.constant.property-value.css | #7DAD89 | — |
| entity.other.attribute-name.html | #7DAD89 | — |
| support.type.property-name.json | #F2A999 | — |
| string.quoted.double.json | #7DAD89 | — |
| meta.tag.jsx, meta.tag.tsx | #F2F0F2 | — |
| entity.other.attribute-name.jsx, entity.other.attribute-name.tsx | #7DAD89 | — |
| meta.object-literal.key, variable.object.property | #F2A999 | — |
| meta.field.graphql | #7DA6A6 | — |
| meta.type.graphql | #B07DA6 | — |
| entity.name.tag.xml | #D996A2 | — |
| entity.other.attribute-name.xml | #7DAD89 | — |
| markup.inserted | #7DAD89 | — |
| markup.deleted | #D96A7E | — |
| markup.changed | #BF8563 | — |
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#141414
- activityBar.border#1F1F1F
- activityBar.foreground#B8D9D0
- activityBar.inactiveForeground#62736C
- activityBarBadge.background#A34242
- activityBarBadge.foreground#C6CAC9
- breadcrumb.activeSelectionForeground#C6CAC9
- breadcrumb.focusForeground#C6CAC9
- breadcrumb.foreground#8C8281
- breadcrumbPicker.background#141414
- button.background#A34242
- button.foreground#C6CAC9
- button.hoverBackground#C24A4A
- charts.blue#4A8399
- charts.foreground#C6CAC9
- charts.green#4F9E64
- charts.lines#8C8281
- charts.orange#A67348
- charts.purple#9A5085
- charts.red#A34242
- charts.yellow#D9C999
- debugIcon.breakpointForeground#A34242
- debugIcon.startForeground#5FBE78
- debugIcon.stopForeground#A34242
- debugToolBar.background#141414
- diffEditor.border#1F1F1F
- diffEditor.insertedTextBackground#4F9E6430
- diffEditor.removedTextBackground#A3424240
- editor.background#141414
- editor.foreground#C6CAC9
- editor.lineHighlightBackground#1A1A1A
- editor.lineHighlightBorder#1A1A1A00
- editor.selectionBackground#36575E70
- editor.selectionHighlightBackground#41625A40
- editor.wordHighlightBackground#401D1540
- editor.wordHighlightStrongBackground#5E365660
- editorGroupHeader.tabsBackground#141414
- editorGroupHeader.tabsBorder#1F1F1F
- editorGutter.background#141414
- editorLineNumber.activeForeground#9ED4E0
- editorLineNumber.foreground#575A49
- editorOverviewRuler.border#1F1F1F
- editorOverviewRuler.currentContentForeground#4F9E64
- editorOverviewRuler.errorForeground#A34242
- editorOverviewRuler.findMatchForeground#D9C99960
- editorOverviewRuler.incomingContentForeground#4A8399
- editorOverviewRuler.infoForeground#5CA5C0
- editorOverviewRuler.warningForeground#D9C999
- editorSuggestWidget.background#1A1A1A
- editorSuggestWidget.border#282828
- editorSuggestWidget.highlightForeground#9ED4E0
- editorSuggestWidget.selectedBackground#202020
- editorWidget.background#1A1A1A
- editorWidget.border#282828
- extensionButton.prominentBackground#A34242
- extensionButton.prominentForeground#C6CAC9
- extensionButton.prominentHoverBackground#C24A4A
- gitDecoration.conflictingResourceForeground#D9C999
- gitDecoration.deletedResourceForeground#A34242
- gitDecoration.ignoredResourceForeground#62736C
- gitDecoration.modifiedResourceForeground#5CA5C0
- gitDecoration.untrackedResourceForeground#5FBE78
- input.background#1A1A1A
- input.border#282828
- input.foreground#C6CAC9
- input.placeholderForeground#8C8281
- keybindingLabel.background#1A1A1A
- keybindingLabel.border#282828
- keybindingLabel.bottomBorder#282828
- keybindingLabel.foreground#C6CAC9
- list.activeSelectionBackground#202020
- list.activeSelectionForeground#C6CAC9
- list.focusBackground#202020
- list.focusForeground#C6CAC9
- list.highlightForeground#9ED4E0
- list.hoverBackground#1A1A1A
- list.inactiveSelectionBackground#1A1A1A
- list.inactiveSelectionForeground#C6CAC9
- menu.background#141414
- menu.foreground#C6CAC9
- menu.selectionBackground#202020
- menu.selectionForeground#C6CAC9
- menu.separatorBackground#1F1F1F
- merge.commonContentBackground#62736C20
- merge.commonHeaderBackground#62736C40
- merge.currentContentBackground#4F9E6430
- merge.currentHeaderBackground#4F9E6450
- merge.incomingContentBackground#4A839930
- merge.incomingHeaderBackground#4A839950
- notificationCenter.border#282828
- notificationCenterHeader.background#141414
- notificationCenterHeader.foreground#C6CAC9
- notificationLink.foreground#9ED4E0
- notifications.background#141414
- notifications.border#282828
- notifications.foreground#C6CAC9
- notificationToast.border#282828
- panel.background#141414
- panel.border#1F1F1F
- panelTitle.activeForeground#C6CAC9
- panelTitle.inactiveForeground#8C8281
- peekView.border#A34242
- peekViewEditor.background#141414
- peekViewEditor.matchHighlightBackground#A3424240
- peekViewResult.background#141414
- peekViewResult.matchHighlightBackground#A3424240
- peekViewTitle.background#1A1A1A
- pickerGroup.border#1F1F1F
- pickerGroup.foreground#9ED4E0
- quickInput.background#141414
- quickInput.foreground#C6CAC9
- scrollbarSlider.activeBackground#A3424280
- scrollbarSlider.background#28282860
- scrollbarSlider.hoverBackground#28282880
- settings.checkboxBackground#141414
- settings.dropdownBackground#141414
- settings.headerForeground#9ED4E0
- settings.modifiedItemIndicator#5CA5C0
- settings.numberInputBackground#141414
- settings.textInputBackground#141414
- sideBar.background#141414
- sideBar.border#1F1F1F
- sideBar.foreground#C6CAC9
- statusBar.background#141414
- statusBar.border#1F1F1F
- statusBar.debuggingBackground#A34242
- statusBar.foreground#C6CAC9
- statusBar.noFolderBackground#141414
- tab.activeBackground#141414
- tab.activeBorder#A34242
- tab.activeForeground#C6CAC9
- tab.inactiveBackground#1A1A1A
- tab.inactiveForeground#8C8281
- tab.unfocusedActiveBorder#894747
- terminal.ansiBlack#1A1A1A
- terminal.ansiBlue#4A8399
- terminal.ansiBrightBlack#404040
- terminal.ansiBrightBlue#5CA5C0
- terminal.ansiBrightCyan#9ED4E0
- terminal.ansiBrightGreen#5FBE78
- terminal.ansiBrightMagenta#B266A1
- terminal.ansiBrightRed#C24A4A
- terminal.ansiBrightWhite#D9E3F4
- terminal.ansiBrightYellow#D9C999
- terminal.ansiCyan#36575E
- terminal.ansiGreen#4F9E64
- terminal.ansiMagenta#9A5085
- terminal.ansiRed#A34242
- terminal.ansiWhite#C6CAC9
- terminal.ansiYellow#C4B483
- terminal.background#141414
- terminal.foreground#C6CAC9
- titleBar.activeBackground#141414
- titleBar.activeForeground#C6CAC9
- titleBar.border#1F1F1F
- titleBar.inactiveBackground#141414
- titleBar.inactiveForeground#8C8281
- welcomePage.buttonBackground#1A1A1A
- welcomePage.buttonHoverBackground#202020
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #62736C | — |
| variable, string constant.other.placeholder | #AABDBF | — |
| constant.other.color | #D9C999 | — |
| invalid, invalid.illegal | #C24A4A | — |
| keyword, storage.type, storage.modifier | #5CA5C0 | — |
| keyword.operator | #BFBAB0 | — |
| string, constant.other.symbol | #5FBE78 | — |
| constant.numeric | #D9C999 | — |
| constant.language, support.constant, constant.character, constant.escape | #D9C999 | — |
| entity.name.function, meta.function-call, support.function | #9ED4E0 | — |
| entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution | #5CA5C0 | — |
| meta.method.declaration, meta.method-call, meta.method | #9ED4E0 | — |
| variable.other.property, support.variable.property | #C5D5D9 | — |
| meta.object-literal.key | #C5D5D9 | — |
| entity.name.tag, meta.tag.sgml | #A34242 | — |
| entity.other.attribute-name | #D9C999 | — |
| markup.heading | #5CA5C0 | — |
| markup.bold | #9ED4E0 | bold |
| markup.italic | #D9C999 | italic |
| punctuation.definition, punctuation.separator, punctuation.terminator | #8C8281 | — |
| punctuation.definition.block, punctuation.definition.parameters, punctuation.section | #AABDBF | — |
| entity.name.type.interface, entity.name.type.struct | #5CA5C0 | — |
| meta.decorator, tag.decorator.js entity.name.tag, tag.decorator.js punctuation.definition.tag | #B266A1 | — |
| template.expression.begin, template.expression.end | #C24A4A | — |
| support.type.property-name.css | #AABDBF | — |
| support.constant.property-value.css | #5FBE78 | — |
| keyword.other.important.css | #A34242 | — |
| keyword.other.unit.css | #D9C999 | — |
| constant.other.color.rgb-value.css | #D9C999 | — |
| entity.name.tag.css, entity.other.attribute-name.class.css, entity.other.attribute-name.id.css | #5CA5C0 | — |
| entity.name.tag.html | #A34242 | — |
| entity.other.attribute-name.html | #D9C999 | — |
| text.html | #C6CAC9 | — |
| support.type.property-name.json | #C5D5D9 | — |
| string.quoted.double.json | #5FBE78 | — |
| constant.numeric.json | #D9C999 | — |
| meta.tag.jsx, meta.tag.tsx | #A34242 | — |
| support.class.component.jsx, support.class.component.tsx | #5CA5C0 | — |
| entity.other.attribute-name.jsx, entity.other.attribute-name.tsx | #D9C999 | — |
| meta.type.parameters.ts, meta.type.annotation.ts | #AABDBF | — |
| meta.object-literal.key, variable.object.property | #C5D5D9 | — |
| variable.language.this | #C24A4A | — |
| meta.field.graphql | #9ED4E0 | — |
| meta.type.graphql | #5CA5C0 | — |
| meta.operation.graphql | #D9C999 | — |
| entity.name.tag.xml | #A34242 | — |
| entity.other.attribute-name.xml | #D9C999 | — |
| text.xml | #C6CAC9 | — |
| markup.inserted | #5FBE78 | — |
| markup.deleted | #A34242 | — |
| markup.changed | #D9C999 | — |
| variable.parameter.function.language.special.self.python, variable.language.special.self.python | #C24A4A | — |
| variable.parameter.function.python | #D9C999 | — |
| constant.character.format.placeholder.other.python, meta.fstring.python | #D9C999 | — |
| entity.name.function.decorator.python | #B266A1 | — |
| support.variable.property.dom | #D9C999 | — |
| support.class.builtin | #5CA5C0 | — |
| entity.name.type.module | #5FBE78 | — |
| variable.other.constant | #D9C999 | — |
| variable.other.readwrite.instance.ruby | #B266A1 | — |
| variable.other.readwrite.class.ruby | #D9C999 | — |
| constant.language.symbol.ruby | #D9C999 | — |
| variable.other.block.ruby | #D9C999 | — |
| support.function.go | #9ED4E0 | — |
| entity.name.type.go | #5CA5C0 | — |
| entity.name.package.go | #5FBE78 | — |
| meta.attribute.rust | #D9C999 | — |
| storage.type.rust | #5CA5C0 | — |
| entity.name.lifetime.rust | #D9C999 | — |
| meta.macro.rust | #B266A1 | — |
| markup.heading.markdown | #5CA5C0 | — |
| markup.underline.link.markdown | #9ED4E0 | — |
| markup.bold.markdown | #D9C999 | bold |
| markup.italic.markdown | #D9C999 | italic |
| markup.list.unnumbered.markdown, markup.list.numbered.markdown | #A34242 | — |
| markup.fenced_code.block.markdown, markup.raw.block.markdown | #5FBE78 | — |
| variable.other.special.shell | #D9C999 | — |
| support.function.builtin.shell | #9ED4E0 | — |
| variable.parameter.option.shell | #D9C999 | — |
| entity.name.tag.yaml | #C5D5D9 | — |
| entity.name.type.anchor.yaml, variable.other.alias.yaml | #D9C999 | — |
| keyword.other.special-method.dockerfile | #5CA5C0 | — |
| meta.preprocessor.c, meta.preprocessor.cpp | #B266A1 | — |
| keyword.other.sql | #A34242 | — |
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#21213A
- activityBar.border#2D2940
- activityBar.foreground#FF9FB2
- activityBar.inactiveForeground#BF99A7
- activityBarBadge.background#FF9FB2
- activityBarBadge.foreground#18182E
- breadcrumb.activeSelectionForeground#FFFFFF
- breadcrumb.focusForeground#FF9FB2
- breadcrumb.foreground#BF99A7
- breadcrumbPicker.background#1E1E36
- button.background#FF9FB2
- button.foreground#FFFFFF
- button.hoverBackground#FFB5C5
- charts.blue#A7CAEC
- charts.foreground#FFD0D0
- charts.green#FFD9C0
- charts.lines#666680
- charts.orange#FFB280
- charts.purple#D7A5BC
- charts.red#FF9FB2
- charts.yellow#FFE4A3
- debugIcon.breakpointForeground#FF9FB2
- debugIcon.startForeground#FFD9C0
- debugIcon.stopForeground#BF99A7
- debugToolBar.background#1E1E36
- diffEditor.border#2D2940
- diffEditor.insertedTextBackground#FFD9C020
- diffEditor.removedTextBackground#FF9FB220
- editor.background#18182E
- editor.foreground#FFFFFF
- editor.lineHighlightBackground#FF9FB215
- editor.lineHighlightBorder#FF9FB700
- editor.selectionBackground#FF9FB280
- editor.selectionHighlightBackground#FF9FB240
- editor.wordHighlightBackground#FF9FB230
- editor.wordHighlightStrongBackground#BF99A730
- editorGroupHeader.tabsBackground#16162A
- editorGroupHeader.tabsBorder#2D2940
- editorGutter.background#18182E
- editorLineNumber.activeForeground#FF9FB2
- editorLineNumber.foreground#666680
- editorOverviewRuler.currentContentForeground#FFD9C0
- editorOverviewRuler.incomingContentForeground#A7CAEC
- editorSuggestWidget.background#1E1E36
- editorSuggestWidget.border#2D2940
- editorSuggestWidget.highlightForeground#FF9FB2
- editorSuggestWidget.selectedBackground#433F4D
- editorWidget.background#1E1E36
- editorWidget.border#2D2940
- extensionButton.prominentBackground#FF9FB2
- extensionButton.prominentForeground#FFFFFF
- extensionButton.prominentHoverBackground#FFB5C5
- gitDecoration.conflictingResourceForeground#FFD0D0
- gitDecoration.deletedResourceForeground#FF9FB2
- gitDecoration.ignoredResourceForeground#666680
- gitDecoration.modifiedResourceForeground#FFD9C0
- gitDecoration.untrackedResourceForeground#A7CAEC
- input.background#2A2840
- input.border#433F4D
- input.foreground#FFFFFF
- input.placeholderForeground#BF99A7
- keybindingLabel.background#2A2840
- keybindingLabel.border#433F4D
- keybindingLabel.bottomBorder#433F4D
- keybindingLabel.foreground#FFD0D0
- list.activeSelectionBackground#433F4D
- list.activeSelectionForeground#FFFFFF
- list.focusBackground#433F4D
- list.focusForeground#FFFFFF
- list.highlightForeground#FF9FB2
- list.hoverBackground#36334A
- list.inactiveSelectionBackground#36334A
- list.inactiveSelectionForeground#FFD0D0
- merge.commonContentBackground#66668020
- merge.commonHeaderBackground#66668030
- merge.currentContentBackground#FFD9C020
- merge.currentHeaderBackground#FFD9C040
- merge.incomingContentBackground#A7CAEC20
- merge.incomingHeaderBackground#A7CAEC40
- notificationCenter.border#2D2940
- notificationCenterHeader.background#1E1E36
- notificationCenterHeader.foreground#FFD0D0
- notificationLink.foreground#A7CAEC
- notifications.background#1E1E36
- notifications.border#2D2940
- notifications.foreground#FFD0D0
- notificationToast.border#2D2940
- panel.background#1E1E36
- panel.border#2D2940
- panelTitle.activeForeground#FFD0D0
- panelTitle.inactiveForeground#BF99A7
- peekView.border#FF9FB2
- peekViewEditor.background#18182E
- peekViewEditor.matchHighlightBackground#FF9FB250
- peekViewResult.background#1E1E36
- peekViewResult.matchHighlightBackground#FF9FB250
- peekViewTitle.background#16162A
- scrollbarSlider.activeBackground#FF9FB270
- scrollbarSlider.background#FF9FB230
- scrollbarSlider.hoverBackground#FF9FB250
- settings.checkboxBackground#1E1E36
- settings.dropdownBackground#1E1E36
- settings.headerForeground#FF9FB2
- settings.modifiedItemIndicator#FFD9C0
- settings.numberInputBackground#1E1E36
- settings.textInputBackground#1E1E36
- sideBar.background#1E1E36
- sideBar.border#2D2940
- sideBar.foreground#FFFFFF
- statusBar.background#16162A
- statusBar.border#2D2940
- statusBar.debuggingBackground#FF9FB2
- statusBar.foreground#FFD0D0
- statusBar.noFolderBackground#16162A
- tab.activeBackground#2D2940
- tab.activeBorder#FF9FB2
- tab.activeForeground#FFFFFF
- tab.inactiveBackground#1E1E36
- tab.inactiveForeground#BF99A7
- tab.unfocusedActiveBorder#BF99A7
- terminal.ansiBlack#1E1E36
- terminal.ansiBlue#A7CAEC
- terminal.ansiBrightBlack#433F4D
- terminal.ansiBrightBlue#C0DBFF
- terminal.ansiBrightCyan#CEEEFF
- terminal.ansiBrightGreen#FFE4D0
- terminal.ansiBrightMagenta#EBBDD0
- terminal.ansiBrightRed#FFB5C5
- terminal.ansiBrightWhite#FFFFFF
- terminal.ansiBrightYellow#FFE0E0
- terminal.ansiCyan#B8E6FF
- terminal.ansiGreen#FFD9C0
- terminal.ansiMagenta#D7A5BC
- terminal.ansiRed#FF9FB2
- terminal.ansiWhite#FFFFFF
- terminal.ansiYellow#FFD0D0
- terminal.background#18182E
- terminal.foreground#FFFFFF
- titleBar.activeBackground#16162A
- titleBar.activeForeground#FFD0D0
- titleBar.border#2D2940
- titleBar.inactiveBackground#16162A
- titleBar.inactiveForeground#BF99A7
- welcomePage.buttonBackground#1E1E36
- welcomePage.buttonHoverBackground#433F4D
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #5D4F57 | — |
| variable, string constant.other.placeholder | #FFFFFF | — |
| constant.other.color | #FFD0D0 | — |
| invalid, invalid.illegal | #FF9FB2 | — |
| keyword, storage.type, storage.modifier | #FF9FB2 | — |
| keyword.operator | #FFD9C0 | — |
| string, constant.other.symbol | #FFD9C0 | — |
| constant.numeric | #FFD0D0 | — |
| constant.language, support.constant, constant.character, constant.escape | #FF9FB2 | — |
| entity.name.function, meta.function-call, support.function | #A7CAEC | — |
| entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution | #FFD0D0 | — |
| meta.method.declaration, meta.method-call, meta.method | #A7CAEC | — |
| variable.other.property, support.variable.property | #B8E6FF | — |
| meta.object-literal.key | #B8E6FF | — |
| entity.name.tag, meta.tag.sgml | #FF9FB2 | — |
| entity.other.attribute-name | #A7CAEC | — |
| markup.heading | #FF9FB2 | — |
| markup.bold | #D7A5BC | bold |
| markup.italic | #FFD9C0 | italic |
| punctuation.definition, punctuation.separator, punctuation.terminator | #BF99A7 | — |
| punctuation.definition.block, punctuation.definition.parameters, punctuation.section | #FFFFFF | — |
| entity.name.type.interface, entity.name.type.struct | #FFD0D0 | — |
| meta.decorator, tag.decorator.js entity.name.tag, tag.decorator.js punctuation.definition.tag | #A7CAEC | — |
| template.expression.begin, template.expression.end | #FF9FB2 | — |
| support.type.property-name.css | #BF99A7 | — |
| support.constant.property-value.css | #FFD9C0 | — |
| entity.other.attribute-name.html | #FFD9C0 | — |
| support.type.property-name.json | #B8E6FF | — |
| string.quoted.double.json | #FFD9C0 | — |
| meta.tag.jsx, meta.tag.tsx | #FFFFFF | — |
| entity.other.attribute-name.jsx, entity.other.attribute-name.tsx | #FFD9C0 | — |
| meta.object-literal.key, variable.object.property | #B8E6FF | — |
| meta.function.decorator.python, meta.function.decorator.identifier.python | #FF9FB2 | — |
| variable.parameter.function.python | #FFE4A3 | — |
| meta.fstring.python, constant.character.format.placeholder.other.python | #FFE4A3 | — |
| variable.parameter.function.language.special.self.python, variable.parameter.function.language.special.cls.python | #FF9FB2 | — |
| constant.language.symbol.ruby | #FFE4A3 | — |
| variable.other.readwrite.instance.ruby | #FF9FB2 | — |
| variable.other.readwrite.class.ruby | #FFD0D0 | — |
| markup.underline.link.markdown, markup.underline.link.image.markdown | #A7CAEC | — |
| beginning.punctuation.definition.list.markdown | #FF9FB2 | — |
| markup.fenced_code.block.markdown, markup.inline.raw.string.markdown | #FFD9C0 | — |
| markup.quote.markdown | #BF99A7 | italic |
| entity.name.function.go | #A7CAEC | — |
| entity.name.type.go | #FFD0D0 | — |
| entity.name.package.go | #FFD9C0 | — |
| meta.attribute.rust | #FF9FB2 | — |
| entity.name.type.rust, storage.type.rust | #FFD0D0 | — |
| entity.name.lifetime.rust, punctuation.definition.lifetime.rust | #FFE4A3 | — |
| meta.macro.rust | #FF9FB2 | — |
| entity.name.tag.yaml | #B8E6FF | — |
| punctuation.definition.anchor.yaml, punctuation.definition.alias.yaml | #FF9FB2 | — |
| entity.other.document.begin.yaml, entity.other.document.end.yaml | #FFD0D0 | — |
| keyword.other.sql | #FF9FB2 | — |
| support.function.sql | #A7CAEC | — |
| meta.table.sql | #FFD9C0 | — |
| meta.decorator.ts, meta.decorator.tsx | #FF9FB2 | — |
| meta.type.annotation.ts, meta.type.annotation.tsx | #FFD0D0 | — |
| entity.name.type.interface.ts, entity.name.type.interface.tsx | #FFD0D0 | — |
| meta.preprocessor.c, meta.preprocessor.cpp | #FF9FB2 | — |
| string.quoted.other.lt-gt.include.c, string.quoted.other.lt-gt.include.cpp, string.quoted.double.include.c, string.quoted.double.include.cpp | #FFD9C0 | — |
| storage.type.annotation.java | #FF9FB2 | — |
| storage.type.generic.java | #FFD0D0 | — |
| storage.modifier.import.java, storage.modifier.package.java | #FFD9C0 | — |
| variable.other.php | #FF9FB2 | — |
| entity.name.type.class.php | #FFD0D0 | — |
| support.other.namespace.php | #FFD9C0 | — |
| variable.other.special.shell | #FF9FB2 | — |
| support.function.builtin.shell | #A7CAEC | — |
| variable.parameter.option.shell | #FFE4A3 | — |
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#172038
- activityBar.border#243049
- activityBar.foreground#E1B2C4
- activityBar.inactiveForeground#7A8AAD
- activityBarBadge.background#E296AF
- activityBarBadge.foreground#FFFFFF
- breadcrumb.activeSelectionForeground#EFF1F5
- breadcrumb.focusForeground#D9E0F0
- breadcrumb.foreground#7A8AAD
- breadcrumbPicker.background#1D2438
- button.background#E296AF
- button.foreground#FFFFFF
- button.hoverBackground#EAA8BF
- charts.blue#92B2E5
- charts.foreground#D9E0F0
- charts.green#A8D0E3
- charts.lines#536180
- charts.orange#E3B78E
- charts.purple#C79FD0
- charts.red#E296AF
- charts.yellow#F0D1A3
- debugIcon.breakpointForeground#E296AF
- debugIcon.startForeground#A8D0E3
- debugIcon.stopForeground#E296AF
- debugToolBar.background#1D2438
- diffEditor.border#243049
- diffEditor.insertedTextBackground#A8D0E320
- diffEditor.removedTextBackground#E296AF20
- editor.background#1A2030
- editor.foreground#EFF1F5
- editor.lineHighlightBackground#2A3452
- editor.lineHighlightBorder#2A345200
- editor.selectionBackground#E296AF40
- editor.selectionHighlightBackground#E296AF30
- editor.wordHighlightBackground#7A8AAD40
- editor.wordHighlightStrongBackground#7A8AAD60
- editorGroupHeader.tabsBackground#152034
- editorGroupHeader.tabsBorder#243049
- editorGutter.background#1A2030
- editorLineNumber.activeForeground#E1B2C4
- editorLineNumber.foreground#536180
- editorOverviewRuler.currentContentForeground#A8D0E3
- editorOverviewRuler.incomingContentForeground#92B2E5
- editorSuggestWidget.background#1D2438
- editorSuggestWidget.border#243049
- editorSuggestWidget.highlightForeground#E1B2C4
- editorSuggestWidget.selectedBackground#3A4466
- editorWidget.background#1D2438
- editorWidget.border#243049
- extensionButton.prominentBackground#E296AF
- extensionButton.prominentForeground#FFFFFF
- extensionButton.prominentHoverBackground#EAA8BF
- gitDecoration.conflictingResourceForeground#F0D1A3
- gitDecoration.deletedResourceForeground#E296AF
- gitDecoration.ignoredResourceForeground#536180
- gitDecoration.modifiedResourceForeground#92B2E5
- gitDecoration.untrackedResourceForeground#A8D0E3
- input.background#243049
- input.border#2A3452
- input.foreground#EFF1F5
- input.placeholderForeground#7A8AAD
- keybindingLabel.background#243049
- keybindingLabel.border#2A3452
- keybindingLabel.bottomBorder#2A3452
- keybindingLabel.foreground#D9E0F0
- list.activeSelectionBackground#3A4466
- list.activeSelectionForeground#EFF1F5
- list.focusBackground#3A4466
- list.focusForeground#EFF1F5
- list.highlightForeground#E1B2C4
- list.hoverBackground#2A3452
- list.inactiveSelectionBackground#2A3452
- list.inactiveSelectionForeground#D9E0F0
- merge.commonContentBackground#7A8AAD20
- merge.commonHeaderBackground#7A8AAD30
- merge.currentContentBackground#A8D0E320
- merge.currentHeaderBackground#A8D0E340
- merge.incomingContentBackground#92B2E520
- merge.incomingHeaderBackground#92B2E540
- notificationCenter.border#243049
- notificationCenterHeader.background#1D2438
- notificationCenterHeader.foreground#D9E0F0
- notificationLink.foreground#92B2E5
- notifications.background#1D2438
- notifications.border#243049
- notifications.foreground#D9E0F0
- notificationToast.border#243049
- panel.background#1D2438
- panel.border#243049
- panelTitle.activeForeground#E1B2C4
- panelTitle.inactiveForeground#7A8AAD
- peekView.border#E296AF
- peekViewEditor.background#1A2030
- peekViewEditor.matchHighlightBackground#E296AF30
- peekViewResult.background#1D2438
- peekViewResult.matchHighlightBackground#E296AF30
- peekViewTitle.background#152034
- scrollbarSlider.activeBackground#7A8AAD80
- scrollbarSlider.background#7A8AAD40
- scrollbarSlider.hoverBackground#7A8AAD60
- settings.checkboxBackground#1D2438
- settings.dropdownBackground#1D2438
- settings.headerForeground#E1B2C4
- settings.modifiedItemIndicator#92B2E5
- settings.numberInputBackground#1D2438
- settings.textInputBackground#1D2438
- sideBar.background#1D2438
- sideBar.border#243049
- sideBar.foreground#D9E0F0
- statusBar.background#152034
- statusBar.border#243049
- statusBar.debuggingBackground#E296AF
- statusBar.foreground#D9E0F0
- statusBar.noFolderBackground#152034
- tab.activeBackground#1A2030
- tab.activeBorder#E296AF
- tab.activeForeground#EFF1F5
- tab.inactiveBackground#1D2438
- tab.inactiveForeground#7A8AAD
- tab.unfocusedActiveBorder#7A8AAD
- terminal.ansiBlack#1D2438
- terminal.ansiBlue#92B2E5
- terminal.ansiBrightBlack#536180
- terminal.ansiBrightBlue#A4BFED
- terminal.ansiBrightCyan#A2D5E0
- terminal.ansiBrightGreen#BADCED
- terminal.ansiBrightMagenta#D5B2DA
- terminal.ansiBrightRed#EAA8BF
- terminal.ansiBrightWhite#EFF1F5
- terminal.ansiBrightYellow#F6DEBC
- terminal.ansiCyan#86C4D2
- terminal.ansiGreen#A8D0E3
- terminal.ansiMagenta#C79FD0
- terminal.ansiRed#E296AF
- terminal.ansiWhite#D9E0F0
- terminal.ansiYellow#F0D1A3
- terminal.background#1A2030
- terminal.foreground#EFF1F5
- titleBar.activeBackground#152034
- titleBar.activeForeground#D9E0F0
- titleBar.border#243049
- titleBar.inactiveBackground#152034
- titleBar.inactiveForeground#7A8AAD
- welcomePage.buttonBackground#1D2438
- welcomePage.buttonHoverBackground#2A3452
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #536180 | — |
| variable, string constant.other.placeholder | #D9E0F0 | — |
| constant.other.color | #F0D1A3 | — |
| invalid, invalid.illegal | #E296AF | — |
| keyword, storage.type, storage.modifier | #C79FD0 | — |
| keyword.operator | #92B2E5 | — |
| string, constant.other.symbol | #A8D0E3 | — |
| constant.numeric | #F0D1A3 | — |
| constant.language, support.constant, constant.character, constant.escape | #E296AF | — |
| entity.name.function, meta.function-call, support.function | #92B2E5 | — |
| entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution | #D5B2DA | — |
| meta.method.declaration, meta.method-call, meta.method | #92B2E5 | — |
| variable.other.property, support.variable.property | #86C4D2 | — |
| meta.object-literal.key | #86C4D2 | — |
| entity.name.tag, meta.tag.sgml | #C79FD0 | — |
| entity.other.attribute-name | #92B2E5 | — |
| markup.heading | #C79FD0 | — |
| markup.bold | #92B2E5 | bold |
| markup.italic | #A8D0E3 | italic |
| punctuation.definition, punctuation.separator, punctuation.terminator | #7A8AAD | — |
| punctuation.definition.block, punctuation.definition.parameters, punctuation.section | #A4BFED | — |
| entity.name.type.interface, entity.name.type.struct | #D5B2DA | — |
| meta.decorator, tag.decorator.js entity.name.tag, tag.decorator.js punctuation.definition.tag | #92B2E5 | — |
| template.expression.begin, template.expression.end | #E296AF | — |
| support.type.property-name.css | #86C4D2 | — |
| support.constant.property-value.css | #A8D0E3 | — |
| entity.other.attribute-name.html | #A8D0E3 | — |
| support.type.property-name.json | #86C4D2 | — |
| string.quoted.double.json | #A8D0E3 | — |
| meta.tag.jsx, meta.tag.tsx | #D9E0F0 | — |
| entity.other.attribute-name.jsx, entity.other.attribute-name.tsx | #A8D0E3 | — |
| meta.object-literal.key, variable.object.property | #86C4D2 | — |
| meta.function.decorator.python, meta.function.decorator.identifier.python | #E296AF | — |
| variable.parameter.function.python | #F0D1A3 | — |
| meta.fstring.python, constant.character.format.placeholder.other.python | #F0D1A3 | — |
| variable.parameter.function.language.special.self.python, variable.parameter.function.language.special.cls.python | #C79FD0 | — |
| constant.language.symbol.ruby | #F0D1A3 | — |
| variable.other.readwrite.instance.ruby | #E296AF | — |
| variable.other.readwrite.class.ruby | #C79FD0 | — |
| markup.underline.link.markdown, markup.underline.link.image.markdown | #92B2E5 | — |
| beginning.punctuation.definition.list.markdown | #E296AF | — |
| markup.fenced_code.block.markdown, markup.inline.raw.string.markdown | #A8D0E3 | — |
| markup.quote.markdown | #7A8AAD | italic |
| entity.name.function.go | #92B2E5 | — |
| entity.name.type.go | #D5B2DA | — |
| entity.name.package.go | #A8D0E3 | — |
| meta.attribute.rust | #E296AF | — |
| entity.name.type.rust, storage.type.rust | #D5B2DA | — |
| entity.name.lifetime.rust, punctuation.definition.lifetime.rust | #F0D1A3 | — |
| meta.macro.rust | #E296AF | — |
| entity.name.tag.yaml | #86C4D2 | — |
| punctuation.definition.anchor.yaml, punctuation.definition.alias.yaml | #E296AF | — |
| entity.other.document.begin.yaml, entity.other.document.end.yaml | #C79FD0 | — |
| keyword.other.sql | #C79FD0 | — |
| support.function.sql | #92B2E5 | — |
| meta.table.sql | #A8D0E3 | — |
| meta.decorator.ts, meta.decorator.tsx | #E296AF | — |
| meta.type.annotation.ts, meta.type.annotation.tsx | #D5B2DA | — |
| entity.name.type.interface.ts, entity.name.type.interface.tsx | #D5B2DA | — |
| meta.preprocessor.c, meta.preprocessor.cpp | #E296AF | — |
| string.quoted.other.lt-gt.include.c, string.quoted.other.lt-gt.include.cpp, string.quoted.double.include.c, string.quoted.double.include.cpp | #A8D0E3 | — |
| storage.type.annotation.java | #E296AF | — |
| storage.type.generic.java | #D5B2DA | — |
| storage.modifier.import.java, storage.modifier.package.java | #A8D0E3 | — |
| variable.other.php | #E296AF | — |
| entity.name.type.class.php | #D5B2DA | — |
| support.other.namespace.php | #A8D0E3 | — |
| variable.other.special.shell | #E296AF | — |
| support.function.builtin.shell | #92B2E5 | — |
| variable.parameter.option.shell | #F0D1A3 | — |