Espresso theme
Publisher: VitaliyThemes in package: 2
Espresso light and dark themes for Visual Studio Code
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#edeef4
- activityBar.dropBackground#edeef4
- activityBar.foreground#677392
- activityBarBadge.background#B7D064
- activityBarBadge.foreground#fff
- badge.background#dde46c
- badge.foreground#677392
- breadcrumb.activeSelectionForeground#832161
- breadcrumb.focusForeground#ed3b6e
- breadcrumbPicker.background#fffae9
- button.background#dde46c
- button.foreground#677392
- button.hoverBackground#B7D064
- debugExceptionWidget.background#ffe1a3
- debugExceptionWidget.border#c06a83
- debugToolBar.background#edeef4
- diffEditor.insertedTextBackground#fffae9
- diffEditor.insertedTextBorder#B7D06f
- diffEditor.removedTextBackground#edeef9
- diffEditor.removedTextBorder#d2461e
- dropdown.background#fff
- dropdown.border#677392
- dropdown.foreground#677392
- editor.background#fff
- editor.findMatchBackground#fffaef
- editor.findMatchHighlightBackground#ffe1af
- editor.findRangeHighlightBackground#c06a8e
- editor.foreground#677392
- editor.hoverHighlightBackground#ffe1af
- editor.inactiveSelectionBackground#ffe1af
- editor.lineHighlightBackground#fffae3
- editor.lineHighlightBorder#fff
- editor.rangeHighlightBackground#ffe1af
- editor.selectionBackground#fffae3
- editor.selectionHighlightBackground#ffe1af
- editor.selectionHighlightBorder#ed3b6e
- editor.wordHighlightBackground#ffe1af
- editor.wordHighlightStrongBackground#ffe1af
- editorBracketMatch.background#dde46c
- editorBracketMatch.border#3D2645
- editorCodeLens.foreground#dde46c
- editorCursor.foreground#b7d064
- editorError.foreground#F16950
- editorGroup.background#fffae2
- editorGroup.border#c06a8e
- editorGroupHeader.noTabsBackground#ffffff
- editorGroupHeader.tabsBackground#edeef4
- editorGutter.addedBackground#b7d064
- editorGutter.background#fff
- editorGutter.deletedBackground#c06a8e
- editorGutter.modifiedBackground#677392
- editorHint.border#ffe1a2
- editorHint.foreground#832161
- editorHoverWidget.background#ffe1af
- editorHoverWidget.border#c06a8e
- editorIndentGuide.background#edeefc
- editorLightBulb.foreground#FFB503
- editorLightBulbAutoFix.foreground#FFB503
- editorLineNumber.foreground#677392
- editorLink.activeForeground#c06a8e
- editorMarkerNavigation.background#fffae2
- editorMarkerNavigationError.background#ed3b6e
- editorMarkerNavigationWarning.background#A8AEC7
- editorRuler.foreground#edeef4
- editorSuggestWidget.background#fffae3
- editorSuggestWidget.border#c06a8e
- editorSuggestWidget.foreground#677392
- editorSuggestWidget.highlightForeground#c06a8e
- editorSuggestWidget.selectedBackground#ffe1af
- editorWhitespace.foreground#67739e
- editorWidget.background#fffae2
- errorForeground#d2461e
- extensionButton.prominentBackground#ed3b6e
- extensionButton.prominentForeground#fffae9
- extensionButton.prominentHoverBackground#832161
- focusBorder#edeef4
- foreground#225588
- gitDecoration.conflictingResourceForeground#ed3b6e
- gitDecoration.deletedResourceForeground#DA4167
- gitDecoration.ignoredResourceForeground#152844
- gitDecoration.modifiedResourceForeground#832161
- gitDecoration.untrackedResourceForeground#91B322
- input.background#fff
- input.border#c06a8e
- input.foreground#c06a8e
- inputOption.activeBorder#c06a8e
- inputValidation.errorBackground#fffae3
- inputValidation.errorBorder#e66a18
- inputValidation.infoBackground#fffae2
- inputValidation.infoBorder#dde46c
- inputValidation.warningBackground#FFB503
- inputValidation.warningBorder#ffe1a2
- list.activeSelectionBackground#fff
- list.activeSelectionForeground#832161
- list.dropBackground#fffae9
- list.focusBackground#ffe1a3
- list.focusForeground#DA4167
- list.highlightForeground#ed3b6e
- list.hoverBackground#ffe1a3
- list.hoverForeground#DA4167
- list.inactiveSelectionBackground#fff
- list.inactiveSelectionForeground#832161
- listFilterWidget.background#DA4167
- menu.selectionBackground#fffae2
- menubar.selectionBackground#fffae2
- menubar.selectionForeground#c06a82
- notificationCenter.border#ed3b6e
- notificationCenterHeader.background#ffe1af
- notificationCenterHeader.foreground#832161
- notificationLink.foreground#677392
- notifications.background#fffae9
- notifications.border#ffe1a2
- notifications.foreground#ed3b6e
- notificationToast.border#ed3b6e
- panel.background#fff
- panel.border#c06a82
- panelTitle.activeBorder#ed3b6e
- panelTitle.activeForeground#ed3b6e
- panelTitle.inactiveForeground#677392
- peekView.border#B7D064
- peekViewEditor.background#fff
- peekViewEditor.matchHighlightBackground#ffe1a2
- peekViewResult.background#fff
- peekViewResult.fileForeground#c06a82
- peekViewResult.lineForeground#677392
- peekViewResult.matchHighlightBackground#ffe1a2
- peekViewResult.selectionBackground#fffae2
- peekViewResult.selectionForeground#e66a12
- peekViewTitle.background#fffae2
- peekViewTitleDescription.foreground#e66a12
- peekViewTitleLabel.foreground#c06a8f
- progressBar.background#2C2E40
- scrollbar.shadow#edeef400
- scrollbarSlider.activeBackground#ed3b6e99
- scrollbarSlider.background#B7D06f99
- scrollbarSlider.hoverBackground#dde46c99
- sideBar.background#E6E7EF
- sideBarSectionHeader.background#edeef4
- sideBarSectionHeader.foreground#152844
- sideBarTitle.foreground#832161
- statusBar.background#edeef4
- statusBar.debuggingBackground#152844
- statusBar.debuggingForeground#ffffff
- statusBar.foreground#67739e
- statusBar.noFolderBackground#dde46c
- statusBar.noFolderForeground#152844
- statusBarItem.activeBackground#ffe1a3
- statusBarItem.errorBackground#ffffff
- statusBarItem.errorForeground#ed3b6e
- statusBarItem.hoverBackground#fffae2
- statusBarItem.prominentBackground#ffffff
- statusBarItem.prominentForeground#832161
- statusBarItem.prominentHoverBackground#fffae2
- statusBarItem.remoteBackground#dde46c
- statusBarItem.remoteForeground#152844
- tab.activeBackground#fff
- tab.activeForeground#c06a8e
- tab.border#edeef4
- tab.inactiveBackground#edeef4
- tab.inactiveForeground#677392
- terminal.ansiBrightGreen#dde46c
- terminal.ansiBrightRed#DA4167
- terminal.ansiGreen#B7D064
- terminal.ansiRed#d2461e
- terminal.background#fff
- terminal.foreground#152844
- terminalCursor.background#fffae9
- terminalCursor.foreground#dde46c
- titleBar.activeBackground#edeef4
- titleBar.activeForeground#2C2E40
- titleBar.inactiveBackground#2c2e40
- titleBar.inactiveForeground#dde46c
- walkThrough.embeddedEditorBackground#fffae2
- welcomePage.buttonBackground#dde46c
- welcomePage.buttonHoverBackground#B7D064
- widget.shadow#C1C0C400
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| string.quoted | #d2461e | — |
| — | #6688cc | — |
| comment | #B7D06c | italic |
| string | #d2461e | — |
| string.interpolated.single | #d2461e | — |
| constant.numeric | #ed3b60 | — |
| constant.language | #ed3b60 | — |
| constant.character, constant.other | #ed3b60 | — |
| variable | — | |
| keyword | #ed3b69 | — |
| storage | #225588 | |
| storage.type | #9966b8 | italic |
| entity.name.class, entity.name.type | #c06a8e | bold |
| entity.other.inherited-class | #ddbb88 | italic underline |
| entity.name.function | #c06a8e | italic |
| variable.parameter | #2277ff | italic |
| entity.name.tag | #225588 | |
| entity.other.attribute-name | #e66a18 | — |
| support.function | #9966b8 | |
| support.constant | #9966b8 | |
| support.type, support.class | #9966b8 | italic |
| support.type.property-name | #75a2d1 | — |
| invalid | #F8F8F0 | — |
| meta.diff, meta.diff.header | #E0EDDD | italic |
| markup.deleted | #dc322f | — |
| markup.changed | #cb4b16 | — |
| markup.inserted | #219186 | — |
| variable.parameter | #e66a18 | — |
| markup.quote | #B7D06c | — |
| markup.bold, markup.italic | #B7D06c | — |
| markup.inline.raw | #c06a8f | — |
| markup.heading.setext | #ED6A5A | — |
| entity.other.attribute-name.class | #ed3b6F | — |
| entity.other.attribute-name.id | #677395 | — |
| source.css entity.name.tag | #B7D065 | — |
| support.constant.property-value.css | #677399 | — |
| entity.name.tag.custom.css | #75a2d1 | — |
| source.json support.type.property-name.json | #75a2d1 | — |
| invalid | #e66a11 | — |
| punctuation.definition.tag.html | #ba1a9f | — |
| punctuation.definition.tag.begin.html | #ba1a9f | — |
| punctuation.definition.tag.end.html | #ba1a9f | — |
| entity.other.attribute-name.html | #75a2d1 | — |
| entity.name.tag.other.html | #c06a8f | — |
| entity.name.tag.block.any.html | #c06a8f | — |
| meta.tag.inline.any.html | #ed3b69 | — |
| meta.tag.other.html | #225588 | — |
| keyword.other.import.dart | #ed3b69 | — |
| storage.type.annotation.dart | #677392 | normal |
| variable.parameter.dart | #ed3b69 | — |
| storage.type.primitive.dart | #ed3b69 | — |
| support.class.dart | #832161 | italic |
| entity.name.function.dart | #9966b8 | normal |
| source.dart | #225588 | — |
| punctuation.other.bracket.curly.go | #ed3b6B | — |
| constant.other.placeholder.go | #BBDB9B | — |
| source.go | #225588 | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...