Ghibli Inspired Theme
Publisher: Daniel BiedmaThemes in package: 3
A dreamy, nature-inspired color theme inspired by Studio Ghibli films
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#120E18
- activityBar.border#2A2234
- activityBar.foreground#C89090
- activityBar.inactiveForeground#6A5A78
- activityBarBadge.background#FF7766
- activityBarBadge.foreground#1A1420
- badge.background#FF7766
- badge.foreground#1A1420
- breadcrumb.activeSelectionForeground#E8E0F0
- breadcrumb.background#1A1420
- breadcrumb.focusForeground#E8E0F0
- breadcrumb.foreground#8A7A98
- breadcrumbPicker.background#16101C
- button.background#883358
- button.foreground#E8E0F0
- button.hoverBackground#994468
- button.secondaryBackground#3A2E44
- button.secondaryForeground#E8E0F0
- button.secondaryHoverBackground#4A3E54
- diffEditor.insertedTextBackground#88C89822
- diffEditor.removedTextBackground#FF776622
- dropdown.background#201828
- dropdown.border#3A2E44
- dropdown.foreground#E8E0F0
- editor.background#1A1420
- editor.findMatchBackground#FF776644
- editor.findMatchBorder#FF7766
- editor.findMatchHighlightBackground#FF776633
- editor.foreground#E8E0F0
- editor.inactiveSelectionBackground#6B4A7822
- editor.lineHighlightBackground#261E2E
- editor.lineHighlightBorder#00000000
- editor.selectionBackground#6B4A7855
- editor.selectionHighlightBackground#6B4A7833
- editor.wordHighlightBackground#7A5A8833
- editor.wordHighlightStrongBackground#7A5A8855
- editorBracketMatch.background#FFD70033
- editorBracketMatch.border#FFD700
- editorCursor.background#1A1420
- editorCursor.foreground#FF8866
- editorError.foreground#FF7766
- editorGroupHeader.tabsBackground#16101C
- editorGroupHeader.tabsBorder#2A2234
- editorHoverWidget.background#16101C
- editorHoverWidget.border#3A2E44
- editorHoverWidget.foreground#E8E0F0
- editorIndentGuide.activeBackground#5A4A68
- editorIndentGuide.background#3A2E44
- editorInfo.foreground#88A8D8
- editorLineNumber.activeForeground#9A8AB0
- editorLineNumber.foreground#5A4A68
- editorSuggestWidget.background#16101C
- editorSuggestWidget.border#3A2E44
- editorSuggestWidget.foreground#E8E0F0
- editorSuggestWidget.highlightForeground#FFD080
- editorSuggestWidget.selectedBackground#3A2848
- editorWarning.foreground#FFD080
- editorWhitespace.foreground#3A2E4466
- editorWidget.background#16101C
- editorWidget.border#3A2E44
- editorWidget.foreground#E8E0F0
- gitDecoration.addedResourceForeground#88C898
- gitDecoration.conflictingResourceForeground#D898D8
- gitDecoration.deletedResourceForeground#FF7766
- gitDecoration.ignoredResourceForeground#5A4A68
- gitDecoration.modifiedResourceForeground#FFD080
- gitDecoration.untrackedResourceForeground#88D8D0
- input.background#201828
- input.border#3A2E44
- input.foreground#E8E0F0
- input.placeholderForeground#6A5A78
- inputOption.activeBackground#6B4A78
- inputOption.activeForeground#E8E0F0
- list.activeSelectionBackground#3A2848
- list.activeSelectionForeground#E8E0F0
- list.errorForeground#FF7766
- list.focusBackground#3A2848
- list.highlightForeground#FFD080
- list.hoverBackground#261E2E
- list.hoverForeground#E8E0F0
- list.inactiveSelectionBackground#2A2234
- list.inactiveSelectionForeground#C8C0D8
- list.warningForeground#FFD080
- minimap.background#16101C
- minimap.findMatchHighlight#FF776688
- minimap.selectionHighlight#6B4A7888
- notificationCenterHeader.background#16101C
- notifications.background#201828
- notifications.border#3A2E44
- notifications.foreground#E8E0F0
- panel.background#16101C
- panel.border#2A2234
- panelTitle.activeBorder#C89090
- panelTitle.activeForeground#E8E0F0
- panelTitle.inactiveForeground#6A5A78
- quickInput.background#16101C
- quickInput.foreground#E8E0F0
- quickInputList.focusBackground#2A2234
- quickInputList.focusForeground#E8E0F0
- scrollbar.shadow#00000033
- scrollbarSlider.activeBackground#7A6A8888
- scrollbarSlider.background#5A4A6844
- scrollbarSlider.hoverBackground#6A5A7866
- sideBar.background#16101C
- sideBar.border#2A2234
- sideBar.foreground#C8C0D8
- sideBarSectionHeader.background#201828
- sideBarSectionHeader.foreground#B0A8C0
- sideBarTitle.foreground#E8E0F0
- statusBar.background#2A1828
- statusBar.border#3A2234
- statusBar.debuggingBackground#883344
- statusBar.debuggingForeground#E8E0F0
- statusBar.foreground#C8B0B8
- statusBar.noFolderBackground#3A2E44
- statusBarItem.hoverBackground#3A2838
- statusBarItem.remoteBackground#883344
- statusBarItem.remoteForeground#E8E0F0
- tab.activeBackground#1A1420
- tab.activeBorder#00000000
- tab.activeBorderTop#C89090
- tab.activeForeground#E8E0F0
- tab.border#2A2234
- tab.hoverBackground#201828
- tab.inactiveBackground#16101C
- tab.inactiveForeground#8A7A98
- terminal.ansiBlack#1A1420
- terminal.ansiBlue#88A8D8
- terminal.ansiBrightBlack#6A5A78
- terminal.ansiBrightBlue#A8C8F0
- terminal.ansiBrightCyan#A8F0E8
- terminal.ansiBrightGreen#A8E8B8
- terminal.ansiBrightMagenta#F0B8F0
- terminal.ansiBrightRed#FFA090
- terminal.ansiBrightWhite#F8F0FF
- terminal.ansiBrightYellow#FFE0A0
- terminal.ansiCyan#88D8D0
- terminal.ansiGreen#88C898
- terminal.ansiMagenta#D898D8
- terminal.ansiRed#FF7766
- terminal.ansiWhite#E8E0F0
- terminal.ansiYellow#FFD080
- terminal.background#16101C
- terminal.foreground#E8E0F0
- terminalCursor.foreground#FF8866
- titleBar.activeBackground#120E18
- titleBar.activeForeground#C8C0D8
- titleBar.border#2A2234
- titleBar.inactiveBackground#120E18
- titleBar.inactiveForeground#6A5A78
- tree.indentGuidesStroke#3A2E44
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #6A5A78 | italic |
| string, string.quoted | #FFD080 | — |
| constant.character.escape | #FFE0A0 | — |
| string.template, punctuation.definition.string.template | #FFD080 | — |
| punctuation.definition.template-expression | #D898D8 | — |
| constant.numeric | #FF9080 | — |
| constant.language | #FF9080 | italic |
| constant.other, variable.other.constant | #FFD080 | — |
| keyword, keyword.control | #D898D8 | — |
| keyword.operator | #88D8D0 | — |
| storage, storage.type | #D898D8 | — |
| storage.modifier | #D898D8 | italic |
| entity.name.function, meta.function-call, support.function | #88C898 | — |
| variable.parameter, meta.parameter | #FFD080 | italic |
| entity.name.class, entity.name.type.class, support.class | #88A8D8 | — |
| entity.other.inherited-class | #A8C8F0 | italic |
| entity.name.type, support.type, support.type.primitive | #88D8D0 | — |
| entity.name.type.interface | #88D8D0 | italic |
| variable, variable.other | #E8E0F0 | — |
| variable.other.property, variable.other.object.property, meta.object-literal.key | #A8E8B8 | — |
| variable.language.this, variable.language.self | #FF9080 | italic |
| entity.name.tag | #FF7766 | — |
| entity.other.attribute-name | #FFD080 | italic |
| support.class.component, entity.name.tag.js, entity.name.tag support.class.component | #88A8D8 | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.id.css | #FFD080 | — |
| support.type.property-name.css | #88C898 | — |
| support.constant.property-value.css | #FFE0A0 | — |
| keyword.other.unit.css | #FF9080 | — |
| entity.other.attribute-name.pseudo-class.css | #D898D8 | — |
| support.type.property-name.json | #C89090 | — |
| string.quoted.double.json | #FFD080 | — |
| heading.1.markdown, heading.2.markdown, heading.3.markdown, heading.4.markdown, heading.5.markdown, heading.6.markdown, markup.heading | #88A8D8 | bold |
| markup.bold | #FFE0A0 | bold |
| markup.italic | #D898D8 | italic |
| markup.underline.link | #88D8D0 | — |
| markup.inline.raw, markup.fenced_code | #88C898 | — |
| markup.quote | #6A5A78 | italic |
| punctuation | #B0A8C0 | — |
| punctuation.definition.block, punctuation.definition.parameters, punctuation.definition.arguments | #B0A8C0 | — |
| string.regexp | #88D8D0 | — |
| meta.decorator, meta.annotation | #FFD080 | italic |
| keyword.control.import, keyword.control.export, keyword.control.from | #D898D8 | — |
| invalid, invalid.illegal | #FF7766 | underline |
| invalid.deprecated | #FF8866 | strikethrough |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...