CITS Themes
Publisher: Axel OllivierThemes in package: 18
A curated collection of VS Code color themes inspired by cinema, anime, and cult films — Ghost in the Shell, Princess Mononoke, Blade Runner, Spirited Away, Studio Ghibli, Star Wars.
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.activeBackground#0e1808
- activityBar.activeBorder#50e018
- activityBar.background#060a04
- activityBar.border#0e1808
- activityBar.foreground#50e018
- activityBar.inactiveForeground#1a3008
- activityBarBadge.background#e030a0
- activityBarBadge.foreground#fff0f8
- badge.background#e030a0
- badge.foreground#fff0f8
- breadcrumb.activeSelectionForeground#50e018
- breadcrumb.background#0c1008
- breadcrumb.focusForeground#78c838
- breadcrumb.foreground#1e3010
- breadcrumbPicker.background#0c1008
- button.background#286010
- button.foreground#c8f0a0
- button.hoverBackground#388018
- button.secondaryBackground#142008
- button.secondaryForeground#50e018
- button.secondaryHoverBackground#1e2c10
- charts.blue#50e018
- charts.foreground#78c838
- charts.green#50e018
- charts.lines#1e3010
- charts.orange#c8a020
- charts.purple#e030a0
- charts.red#ff2010
- charts.yellow#e0e010
- commandCenter.activeBackground#142008
- commandCenter.activeBorder#50e018
- commandCenter.activeForeground#50e018
- commandCenter.background#0c1008
- commandCenter.border#50e01830
- commandCenter.foreground#3a6018
- debugConsole.errorForeground#ff2010
- debugConsole.infoForeground#50e018
- debugConsole.sourceForeground#78c838
- debugConsole.warningForeground#e0e010
- debugConsoleInputIcon.foreground#50e018
- debugIcon.breakpointDisabledForeground#1e3010
- debugIcon.breakpointForeground#e030a0
- debugIcon.breakpointUnverifiedForeground#e0e010
- debugIcon.continueForeground#50e018
- debugIcon.disconnectForeground#ff2010
- debugIcon.pauseForeground#e0e010
- debugIcon.restartForeground#50e018
- debugIcon.stepBackForeground#c030d0
- debugIcon.stepIntoForeground#50e018
- debugIcon.stepOutForeground#50e018
- debugIcon.stepOverForeground#50e018
- debugIcon.stopForeground#ff2010
- debugToolBar.background#040804
- debugToolBar.border#50e01830
- descriptionForeground#2a4810
- diffEditor.insertedLineBackground#50e0180a
- diffEditor.insertedTextBackground#50e0180e
- diffEditor.insertedTextBorder#00000000
- diffEditor.removedLineBackground#ff20100a
- diffEditor.removedTextBackground#ff20100e
- diffEditor.removedTextBorder#00000000
- diffEditorGutter.insertedLineBackground#50e01814
- diffEditorGutter.removedLineBackground#ff201014
- diffEditorOverview.insertedForeground#50e018
- diffEditorOverview.removedForeground#ff2010
- disabledForeground#183008
- dropdown.background#0c1008
- dropdown.border#50e01828
- dropdown.foreground#78c838
- dropdown.listBackground#0c1008
- editor.background#080c06
- editor.findMatchBackground#50e01828
- editor.findMatchBorder#50e018
- editor.findMatchHighlightBackground#e0e0101e
- editor.findMatchHighlightBorder#e0e01044
- editor.focusedStackFrameHighlightBackground#50e01814
- editor.foreground#78c838
- editor.hoverHighlightBackground#50e01814
- editor.inactiveSelectionBackground#50e01810
- editor.lineHighlightBackground#0e1408
- editor.lineHighlightBorder#00000000
- editor.rangeHighlightBackground#50e0180c
- editor.selectionBackground#50e01820
- editor.selectionHighlightBackground#50e01818
- editor.selectionHighlightBorder#50e01830
- editor.stackFrameHighlightBackground#e0e01014
- editor.wordHighlightBackground#e030a014
- editor.wordHighlightBorder#e030a038
- editor.wordHighlightStrongBackground#50e01814
- editor.wordHighlightStrongBorder#50e01838
- editorBracketHighlight.foreground1#50e018
- editorBracketHighlight.foreground2#e030a0
- editorBracketHighlight.foreground3#e0e010
- editorBracketHighlight.foreground4#c8a020
- editorBracketHighlight.foreground5#c030d0
- editorBracketHighlight.foreground6#90e050
- editorBracketHighlight.unexpectedBracket.foreground#ff2010
- editorBracketMatch.background#50e01818
- editorBracketMatch.border#50e01860
- editorCursor.background#000400
- editorCursor.foreground#50e018
- editorError.border#ff201038
- editorError.foreground#ff2010
- editorGroupHeader.border#0e1808
- editorGroupHeader.noTabsBackground#060a04
- editorGroupHeader.tabsBackground#060a04
- editorGutter.addedBackground#50e01850
- editorGutter.background#080c06
- editorGutter.commentRangeForeground#1e2c10
- editorGutter.deletedBackground#ff201050
- editorGutter.modifiedBackground#e0e01050
- editorHint.foreground#50e01870
- editorHoverWidget.background#080c06
- editorHoverWidget.border#50e01830
- editorHoverWidget.foreground#78c838
- editorIndentGuide.activeBackground#1e2c10
- editorIndentGuide.background#142008
- editorInfo.border#50e01838
- editorInfo.foreground#50e018
- editorInlayHint.background#060a04
- editorInlayHint.foreground#1e3010
- editorInlayHint.parameterForeground#203010
- editorInlayHint.typeForeground#243810
- editorLineNumber.activeForeground#50e01890
- editorLineNumber.foreground#1e3010
- editorOverviewRuler.addedForeground#50e01870
- editorOverviewRuler.border#0e1808
- editorOverviewRuler.deletedForeground#ff201070
- editorOverviewRuler.errorForeground#ff2010
- editorOverviewRuler.findMatchForeground#50e01870
- editorOverviewRuler.infoForeground#50e018
- editorOverviewRuler.modifiedForeground#e0e01070
- editorOverviewRuler.rangeHighlightForeground#50e01840
- editorOverviewRuler.selectionHighlightForeground#50e01828
- editorOverviewRuler.warningForeground#e0e010
- editorOverviewRuler.wordHighlightForeground#e030a070
- editorOverviewRuler.wordHighlightStrongForeground#50e01870
- editorRuler.foreground#142008
- editorSuggestWidget.background#0c1008
- editorSuggestWidget.border#50e01828
- editorSuggestWidget.foreground#78c838
- editorSuggestWidget.highlightForeground#50e018
- editorSuggestWidget.selectedBackground#142008
- editorSuggestWidget.selectedForeground#50e018
- editorWarning.border#e0e01038
- editorWarning.foreground#e0e010
- editorWhitespace.foreground#1a2c10
- editorWidget.background#0c1008
- editorWidget.border#50e01830
- editorWidget.foreground#78c838
- editorWidget.resizeBorder#50e018
- errorForeground#ff2010
- extensionButton.prominentBackground#286010
- extensionButton.prominentForeground#c8f0a0
- extensionButton.prominentHoverBackground#388018
- extensionIcon.preReleaseForeground#e030a0
- extensionIcon.starForeground#e0e010
- extensionIcon.verifiedForeground#50e018
- focusBorder#50e01860
- foreground#78c838
- gitDecoration.addedResourceForeground#50e018
- gitDecoration.conflictingResourceForeground#e030a0
- gitDecoration.deletedResourceForeground#ff2010
- gitDecoration.ignoredResourceForeground#1e3010
- gitDecoration.modifiedResourceForeground#e0e010
- gitDecoration.stageDeletedResourceForeground#ff4830
- gitDecoration.stageModifiedResourceForeground#f8f030
- gitDecoration.submoduleResourceForeground#c030d0
- gitDecoration.untrackedResourceForeground#90e050
- icon.foreground#3a6018
- input.background#0c1008
- input.border#50e01828
- input.foreground#78c838
- input.placeholderForeground#1e3010
- inputOption.activeBackground#50e0181a
- inputOption.activeBorder#50e018
- inputOption.activeForeground#50e018
- inputValidation.errorBackground#180200
- inputValidation.errorBorder#ff2010
- inputValidation.errorForeground#ff2010
- inputValidation.infoBackground#021000
- inputValidation.infoBorder#50e018
- inputValidation.warningBackground#181800
- inputValidation.warningBorder#e0e010
- keybindingLabel.background#142008
- keybindingLabel.border#50e01830
- keybindingLabel.bottomBorder#78c838
- keybindingLabel.foreground#50e018
- list.activeSelectionBackground#142008
- list.activeSelectionForeground#50e018
- list.errorForeground#ff2010
- list.focusBackground#142008
- list.focusForeground#50e018
- list.highlightForeground#50e018
- list.hoverBackground#101808
- list.hoverForeground#70f030
- list.inactiveSelectionBackground#0e1808
- list.inactiveSelectionForeground#3a6018
- list.warningForeground#e0e010
- listFilterWidget.background#060a04
- listFilterWidget.noMatchesOutline#ff201050
- listFilterWidget.outline#50e01840
- menu.background#0c1008
- menu.border#50e01828
- menu.foreground#78c838
- menu.selectionBackground#142008
- menu.selectionBorder#50e01830
- menu.selectionForeground#50e018
- menu.separatorBackground#0e1808
- menubar.selectionBackground#142008
- menubar.selectionBorder#50e01830
- menubar.selectionForeground#50e018
- minimap.background#060a04
- minimap.errorHighlight#ff2010
- minimap.findMatchHighlight#50e01870
- minimap.selectionHighlight#50e01838
- minimap.warningHighlight#e0e010
- minimapGutter.addedBackground#50e018
- minimapGutter.deletedBackground#ff2010
- minimapGutter.modifiedBackground#e0e010
- minimapSlider.activeBackground#50e01820
- minimapSlider.background#50e01806
- minimapSlider.hoverBackground#50e01814
- notificationCenter.border#50e01830
- notificationCenterHeader.background#060a04
- notificationCenterHeader.foreground#50e018
- notifications.background#0c1008
- notifications.border#50e01828
- notifications.foreground#78c838
- notificationsErrorIcon.foreground#ff2010
- notificationsInfoIcon.foreground#50e018
- notificationsWarningIcon.foreground#e0e010
- notificationToast.border#50e01830
- panel.background#060a04
- panel.border#0e1808
- panel.dropBorder#50e018
- panelInput.border#50e01828
- panelSection.border#0e1808
- panelTitle.activeBorder#50e018
- panelTitle.activeForeground#50e018
- panelTitle.inactiveForeground#1e3010
- peekView.border#50e01830
- peekViewEditor.background#080c06
- peekViewEditor.matchHighlightBackground#50e01828
- peekViewEditor.matchHighlightBorder#50e018
- peekViewEditorGutter.background#080c06
- peekViewResult.background#060a04
- peekViewResult.fileForeground#3a6018
- peekViewResult.lineForeground#243810
- peekViewResult.matchHighlightBackground#50e0181a
- peekViewResult.selectionBackground#142008
- peekViewResult.selectionForeground#50e018
- peekViewTitle.background#060a04
- peekViewTitleDescription.foreground#243810
- peekViewTitleLabel.foreground#50e018
- pickerGroup.border#50e01828
- pickerGroup.foreground#50e01850
- problemsErrorIcon.foreground#ff2010
- problemsInfoIcon.foreground#50e018
- problemsWarningIcon.foreground#e0e010
- progressBar.background#50e018
- quickInput.background#0c1008
- quickInput.foreground#78c838
- quickInputList.focusBackground#142008
- quickInputList.focusForeground#50e018
- quickInputList.focusIconForeground#50e018
- quickInputTitle.background#060a04
- scrollbar.shadow#00000080
- scrollbarSlider.activeBackground#50e01830
- scrollbarSlider.background#50e01810
- scrollbarSlider.hoverBackground#50e01820
- selection.background#50e01820
- settings.checkboxBackground#0c1008
- settings.checkboxBorder#50e01828
- settings.checkboxForeground#50e018
- settings.dropdownBackground#0c1008
- settings.dropdownBorder#50e01828
- settings.dropdownForeground#78c838
- settings.headerForeground#50e018
- settings.modifiedItemIndicator#e0e010
- settings.numberInputBackground#0c1008
- settings.numberInputBorder#50e01828
- settings.numberInputForeground#78c838
- settings.textInputBackground#0c1008
- settings.textInputBorder#50e01828
- settings.textInputForeground#78c838
- sideBar.background#0c1008
- sideBar.border#0e1808
- sideBar.foreground#3a6018
- sideBarSectionHeader.background#080c06
- sideBarSectionHeader.border#0e1808
- sideBarSectionHeader.foreground#2a4810
- sideBarTitle.foreground#50e018
- statusBar.background#040804
- statusBar.border#0e1808
- statusBar.debuggingBackground#c030d0
- statusBar.debuggingForeground#fce8ff
- statusBar.foreground#2a4810
- statusBar.noFolderBackground#040804
- statusBar.noFolderForeground#2a4810
- statusBarItem.activeBackground#50e0181a
- statusBarItem.errorBackground#ff201070
- statusBarItem.errorForeground#ffe8e8
- statusBarItem.hoverBackground#50e01814
- statusBarItem.prominentBackground#50e0181a
- statusBarItem.prominentHoverBackground#50e01828
- statusBarItem.remoteBackground#50e018
- statusBarItem.remoteForeground#060a04
- statusBarItem.warningBackground#e0e01070
- statusBarItem.warningForeground#fffff0
- tab.activeBackground#080c06
- tab.activeBorder#080c06
- tab.activeBorderTop#50e018
- tab.activeForeground#50e018
- tab.border#0e1808
- tab.hoverBackground#0e1408
- tab.hoverForeground#78c838
- tab.inactiveBackground#060a04
- tab.inactiveForeground#1e3010
- tab.lastPinnedBorder#50e01830
- tab.unfocusedActiveBackground#080c06
- tab.unfocusedActiveForeground#3a6018
- tab.unfocusedInactiveBackground#060a04
- tab.unfocusedInactiveForeground#162808
- terminal.ansiBlack#060a04
- terminal.ansiBlue#2050c8
- terminal.ansiBrightBlack#1e3010
- terminal.ansiBrightBlue#3870e8
- terminal.ansiBrightCyan#90f050
- terminal.ansiBrightGreen#70f030
- terminal.ansiBrightMagenta#f860c8
- terminal.ansiBrightRed#ff4830
- terminal.ansiBrightWhite#a0e870
- terminal.ansiBrightYellow#f8f030
- terminal.ansiCyan#50e018
- terminal.ansiGreen#50e018
- terminal.ansiMagenta#e030a0
- terminal.ansiRed#ff2010
- terminal.ansiWhite#78c838
- terminal.ansiYellow#e0e010
- terminal.background#060a04
- terminal.border#0e1808
- terminal.foreground#90e050
- terminal.selectionBackground#50e0181a
- terminalCursor.background#000400
- terminalCursor.foreground#50e018
- testing.iconErrored#ff2010
- testing.iconFailed#ff2010
- testing.iconPassed#50e018
- testing.iconSkipped#1e3010
- testing.runAction#50e018
- titleBar.activeBackground#040804
- titleBar.activeForeground#2a4810
- titleBar.border#0e1808
- titleBar.inactiveBackground#040804
- titleBar.inactiveForeground#162808
- tree.indentGuidesStroke#1a2c10
- walkThrough.embeddedEditorBackground#0c1008
- welcomePage.background#080c06
- welcomePage.progress.background#060a04
- welcomePage.progress.foreground#50e018
- welcomePage.tileBackground#0c1008
- welcomePage.tileBorder#0e1808
- welcomePage.tileHoverBackground#142008
- widget.shadow#00000090
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #1a3010 | italic |
| comment.block.documentation, comment.line.documentation | #243c14 | italic |
| string, string.quoted, string.template | #c8a020 | — |
| constant.character.escape, constant.other.placeholder | #50e018 | — |
| string.regexp, punctuation.definition.string.regexp, string.regexp.character-class | #d06010 | — |
| punctuation.definition.template-expression, punctuation.section.embedded | #50e018 | — |
| constant.numeric, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.numeric.octal, constant.numeric.binary | #e8d010 | — |
| constant.language, constant.language.boolean, constant.language.null, constant.language.undefined | #d06010 | — |
| constant.other, constant.character | #d0b010 | — |
| variable.other.constant | #d06010 | — |
| keyword, keyword.control, keyword.control.flow | #e030a0 | italic |
| keyword.operator, keyword.operator.assignment, keyword.operator.comparison, keyword.operator.logical, keyword.operator.arithmetic | #50e018 | — |
| keyword.operator.logical.python, keyword.operator.wordlike | #e030a0 | italic |
| keyword.operator.new, keyword.operator.delete, keyword.operator.typeof, keyword.operator.void, keyword.operator.instanceof | #c030d0 | italic |
| storage, storage.type, storage.modifier | #c030d0 | italic |
| entity.name.function, meta.function entity.name.function | #50e018 | — |
| meta.function-call entity.name.function, meta.function-call.generic, support.function | #38c010 | — |
| variable.parameter, meta.function.parameters variable.other | #a0e050 | italic |
| storage.type.function.arrow | #50e018 | — |
| entity.name.class, entity.name.type.class, entity.name.type | #e0e010 | — |
| entity.other.inherited-class | #c8c010 | italic |
| entity.name.type.interface, support.type.interface | #e0e010 | italic |
| entity.name.type.parameter, variable.type.parameter | #f0f030 | — |
| support.type, support.type.primitive, keyword.type | #c8c010 | — |
| variable, variable.other, variable.other.readwrite | #78c838 | — |
| variable.language.self, variable.language.this, variable.language.super | #e030a0 | italic |
| variable.other.property, variable.other.object.property, meta.property-name, support.variable.property | #60b030 | — |
| meta.object-literal.key, meta.object.member, support.type.property-name | #508020 | — |
| punctuation, meta.brace, punctuation.separator, punctuation.terminator | #243c14 | — |
| punctuation.definition.string.begin, punctuation.definition.string.end | #8c7010 | — |
| meta.decorator, entity.name.function.decorator, punctuation.decorator | #e8d010 | italic |
| entity.name.namespace, entity.name.module, entity.name.package | #c8c010 | — |
| entity.name.tag, meta.tag.sgml | #e030a0 | — |
| punctuation.definition.tag, meta.tag punctuation | #902880 | — |
| entity.other.attribute-name, meta.tag.attributes entity.other.attribute-name | #c030d0 | — |
| meta.tag.attributes string | #c8a020 | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.id.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css | #c030d0 | — |
| support.type.property-name.css, meta.property-name.css | #e0e010 | — |
| meta.property-value.css, support.constant.property-value.css | #c8a020 | — |
| constant.other.color.rgb-value.css, keyword.other.unit.css | #e8d010 | — |
| keyword.control.at-rule.css | #e030a0 | italic |
| markup.heading, entity.name.section.markdown | #50e018 | bold |
| markup.bold | #e030a0 | bold |
| markup.italic | #c030d0 | italic |
| markup.inline.raw | #50e018 | — |
| markup.fenced_code.block | #38c010 | — |
| markup.underline.link | #e0e010 | underline |
| markup.quote | #243c14 | italic |
| punctuation.definition.list.begin.markdown | #e030a0 | — |
| support.type.property-name.json | #e0e010 | — |
| entity.name.tag.yaml | #e0e010 | — |
| entity.name.type.anchor.yaml, variable.other.alias.yaml | #e8d010 | — |
| support.function.builtin.shell | #50e018 | — |
| variable.other.normal.shell, variable.other.special.shell | #c8a020 | — |
| invalid | #ff2010 | strikethrough |
| invalid.deprecated | #d06010 | strikethrough |
| meta.diff, meta.diff.header | #243c14 | — |
| markup.inserted | #50e018 | — |
| markup.deleted | #ff2010 | — |
| markup.changed | #e0e010 | — |