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#E2DDD3
- activityBar.activeBorder#6B8E7A
- activityBar.background#F0EDE5
- activityBar.border#E2DDD3
- activityBar.foreground#6B8E7A
- activityBar.inactiveForeground#857D6E
- activityBarBadge.background#6B8E7A
- activityBarBadge.foreground#F9F7F1
- badge.background#6B8E7A
- badge.foreground#F9F7F1
- breadcrumb.activeSelectionForeground#40553E
- breadcrumb.background#F9F7F1
- breadcrumb.focusForeground#1A1C1A
- breadcrumb.foreground#857D6E
- breadcrumbPicker.background#F5F2EA
- button.background#6B8E7A
- button.foreground#F9F7F1
- button.hoverBackground#567260
- button.secondaryBackground#F0EDE5
- button.secondaryForeground#40553E
- button.secondaryHoverBackground#E2DDD3
- charts.blue#5E8A8C
- charts.foreground#1A1C1A
- charts.green#2E9E5A
- charts.lines#E2DDD3
- charts.orange#B87008
- charts.purple#7B5EA3
- charts.red#C44536
- charts.yellow#D4850A
- commandCenter.activeBackground#6B8E7A24
- commandCenter.activeBorder#6B8E7A
- commandCenter.activeForeground#40553E
- commandCenter.background#F5F2EA
- commandCenter.border#C9C2B5
- commandCenter.foreground#655E51
- debugConsole.errorForeground#C44536
- debugConsole.infoForeground#5E8A8C
- debugConsole.sourceForeground#1A1C1A
- debugConsole.warningForeground#D4850A
- debugConsoleInputIcon.foreground#2E9E5A
- debugIcon.breakpointDisabledForeground#C9C2B5
- debugIcon.breakpointForeground#C44536
- debugIcon.breakpointUnverifiedForeground#D4850A
- debugIcon.continueForeground#2E9E5A
- debugIcon.disconnectForeground#C44536
- debugIcon.pauseForeground#D4850A
- debugIcon.restartForeground#5E8A8C
- debugIcon.stepBackForeground#655E51
- debugIcon.stepIntoForeground#567260
- debugIcon.stepOutForeground#567260
- debugIcon.stepOverForeground#567260
- debugIcon.stopForeground#C44536
- debugToolBar.background#F5F2EA
- debugToolBar.border#C9C2B5
- descriptionForeground#857D6E
- diffEditor.insertedLineBackground#2E9E5A0c
- diffEditor.insertedTextBackground#2E9E5A10
- diffEditor.insertedTextBorder#00000000
- diffEditor.removedLineBackground#C4453608
- diffEditor.removedTextBackground#C4453610
- diffEditor.removedTextBorder#00000000
- diffEditorGutter.insertedLineBackground#2E9E5A18
- diffEditorGutter.removedLineBackground#C4453618
- diffEditorOverview.insertedForeground#2E9E5A
- diffEditorOverview.removedForeground#C44536
- disabledForeground#C9C2B5
- dropdown.background#F5F2EA
- dropdown.border#C9C2B5
- dropdown.foreground#1A1C1A
- dropdown.listBackground#F5F2EA
- editor.background#F9F7F1
- editor.findMatchBackground#D4850A30
- editor.findMatchBorder#D4850A
- editor.findMatchHighlightBackground#D4850A20
- editor.findMatchHighlightBorder#D4850A40
- editor.focusedStackFrameHighlightBackground#6B8E7A14
- editor.foreground#1A1C1A
- editor.hoverHighlightBackground#6B8E7A14
- editor.inactiveSelectionBackground#6B8E7A14
- editor.lineHighlightBackground#F0EDE500
- editor.lineHighlightBorder#E2DDD360
- editor.rangeHighlightBackground#6B8E7A10
- editor.selectionBackground#6B8E7A28
- editor.selectionHighlightBackground#6B8E7A18
- editor.selectionHighlightBorder#6B8E7A38
- editor.stackFrameHighlightBackground#D4850A14
- editor.wordHighlightBackground#7B5EA318
- editor.wordHighlightBorder#7B5EA338
- editor.wordHighlightStrongBackground#6B8E7A18
- editor.wordHighlightStrongBorder#6B8E7A38
- editorBracketHighlight.foreground1#567260
- editorBracketHighlight.foreground2#7B5EA3
- editorBracketHighlight.foreground3#D4850A
- editorBracketHighlight.foreground4#5E8A8C
- editorBracketHighlight.foreground5#C44536
- editorBracketHighlight.foreground6#857D6E
- editorBracketHighlight.unexpectedBracket.foreground#C44536
- editorBracketMatch.background#6B8E7A18
- editorBracketMatch.border#6B8E7A60
- editorCursor.background#F9F7F1
- editorCursor.foreground#567260
- editorError.border#C4453640
- editorError.foreground#C44536
- editorGroupHeader.border#E2DDD3
- editorGroupHeader.noTabsBackground#F0EDE5
- editorGroupHeader.tabsBackground#F0EDE5
- editorGutter.addedBackground#2E9E5A60
- editorGutter.background#F9F7F1
- editorGutter.commentRangeForeground#C9C2B5
- editorGutter.deletedBackground#C4453660
- editorGutter.modifiedBackground#D4850A60
- editorHint.foreground#567260
- editorHoverWidget.background#F5F2EA
- editorHoverWidget.border#E2DDD3
- editorHoverWidget.foreground#1A1C1A
- editorIndentGuide.activeBackground#C9C2B5
- editorIndentGuide.background#F0EDE5
- editorInfo.border#5E8A8C40
- editorInfo.foreground#5E8A8C
- editorInlayHint.background#F0EDE5
- editorInlayHint.foreground#857D6E
- editorInlayHint.parameterForeground#857D6E
- editorInlayHint.typeForeground#655E51
- editorLineNumber.activeForeground#567260
- editorLineNumber.foreground#C9C2B5
- editorOverviewRuler.addedForeground#2E9E5A70
- editorOverviewRuler.border#E2DDD3
- editorOverviewRuler.deletedForeground#C4453670
- editorOverviewRuler.errorForeground#C44536
- editorOverviewRuler.findMatchForeground#D4850A70
- editorOverviewRuler.infoForeground#5E8A8C
- editorOverviewRuler.modifiedForeground#D4850A70
- editorOverviewRuler.rangeHighlightForeground#6B8E7A40
- editorOverviewRuler.selectionHighlightForeground#6B8E7A28
- editorOverviewRuler.warningForeground#D4850A
- editorOverviewRuler.wordHighlightForeground#7B5EA370
- editorOverviewRuler.wordHighlightStrongForeground#6B8E7A70
- editorRuler.foreground#E2DDD3
- editorSuggestWidget.background#F5F2EA
- editorSuggestWidget.border#E2DDD3
- editorSuggestWidget.foreground#1A1C1A
- editorSuggestWidget.highlightForeground#567260
- editorSuggestWidget.selectedBackground#6B8E7A24
- editorSuggestWidget.selectedForeground#40553E
- editorWarning.border#D4850A40
- editorWarning.foreground#D4850A
- editorWhitespace.foreground#E2DDD3
- editorWidget.background#F5F2EA
- editorWidget.border#E2DDD3
- editorWidget.foreground#1A1C1A
- editorWidget.resizeBorder#6B8E7A
- errorForeground#C44536
- extensionButton.prominentBackground#6B8E7A
- extensionButton.prominentForeground#F9F7F1
- extensionButton.prominentHoverBackground#567260
- extensionIcon.preReleaseForeground#7B5EA3
- extensionIcon.starForeground#D4850A
- extensionIcon.verifiedForeground#2E9E5A
- focusBorder#6B8E7A60
- foreground#1A1C1A
- gitDecoration.addedResourceForeground#2E9E5A
- gitDecoration.conflictingResourceForeground#7B5EA3
- gitDecoration.deletedResourceForeground#C44536
- gitDecoration.ignoredResourceForeground#C9C2B5
- gitDecoration.modifiedResourceForeground#D4850A
- gitDecoration.stageDeletedResourceForeground#A83830
- gitDecoration.stageModifiedResourceForeground#B87008
- gitDecoration.submoduleResourceForeground#655E51
- gitDecoration.untrackedResourceForeground#5E8A8C
- icon.foreground#655E51
- input.background#F5F2EA
- input.border#C9C2B5
- input.foreground#1A1C1A
- input.placeholderForeground#A69E8F
- inputOption.activeBackground#6B8E7A18
- inputOption.activeBorder#6B8E7A
- inputOption.activeForeground#40553E
- inputValidation.errorBackground#C4453614
- inputValidation.errorBorder#C44536
- inputValidation.errorForeground#C44536
- inputValidation.infoBackground#5E8A8C14
- inputValidation.infoBorder#5E8A8C
- inputValidation.warningBackground#D4850A14
- inputValidation.warningBorder#D4850A
- keybindingLabel.background#F0EDE5
- keybindingLabel.border#C9C2B5
- keybindingLabel.bottomBorder#A69E8F
- keybindingLabel.foreground#40553E
- list.activeSelectionBackground#6B8E7A24
- list.activeSelectionForeground#40553E
- list.errorForeground#C44536
- list.focusBackground#6B8E7A24
- list.focusForeground#40553E
- list.highlightForeground#567260
- list.hoverBackground#F0EDE5
- list.hoverForeground#1A1C1A
- list.inactiveSelectionBackground#F0EDE5
- list.inactiveSelectionForeground#1A1C1A
- list.warningForeground#D4850A
- listFilterWidget.background#F0EDE5
- listFilterWidget.noMatchesOutline#C4453660
- listFilterWidget.outline#6B8E7A50
- menu.background#F5F2EA
- menu.border#C9C2B5
- menu.foreground#1A1C1A
- menu.selectionBackground#6B8E7A24
- menu.selectionBorder#6B8E7A40
- menu.selectionForeground#40553E
- menu.separatorBackground#E2DDD3
- menubar.selectionBackground#6B8E7A24
- menubar.selectionBorder#6B8E7A30
- menubar.selectionForeground#40553E
- minimap.background#F5F2EA
- minimap.errorHighlight#C44536
- minimap.findMatchHighlight#D4850A70
- minimap.selectionHighlight#6B8E7A38
- minimap.warningHighlight#D4850A
- minimapGutter.addedBackground#2E9E5A
- minimapGutter.deletedBackground#C44536
- minimapGutter.modifiedBackground#D4850A
- minimapSlider.activeBackground#6B8E7A38
- minimapSlider.background#6B8E7A14
- minimapSlider.hoverBackground#6B8E7A24
- notificationCenter.border#C9C2B5
- notificationCenterHeader.background#F0EDE5
- notificationCenterHeader.foreground#40553E
- notifications.background#F5F2EA
- notifications.border#C9C2B5
- notifications.foreground#1A1C1A
- notificationsErrorIcon.foreground#C44536
- notificationsInfoIcon.foreground#5E8A8C
- notificationsWarningIcon.foreground#D4850A
- notificationToast.border#6B8E7A40
- panel.background#F5F2EA
- panel.border#E2DDD3
- panel.dropBorder#6B8E7A
- panelInput.border#C9C2B5
- panelSection.border#E2DDD3
- panelTitle.activeBorder#6B8E7A
- panelTitle.activeForeground#40553E
- panelTitle.inactiveForeground#857D6E
- peekView.border#6B8E7A60
- peekViewEditor.background#F0EDE5
- peekViewEditor.matchHighlightBackground#6B8E7A28
- peekViewEditor.matchHighlightBorder#6B8E7A
- peekViewEditorGutter.background#F0EDE5
- peekViewResult.background#F5F2EA
- peekViewResult.fileForeground#4A443A
- peekViewResult.lineForeground#857D6E
- peekViewResult.matchHighlightBackground#6B8E7A20
- peekViewResult.selectionBackground#6B8E7A28
- peekViewResult.selectionForeground#40553E
- peekViewTitle.background#F0EDE5
- peekViewTitleDescription.foreground#857D6E
- peekViewTitleLabel.foreground#40553E
- pickerGroup.border#C9C2B5
- pickerGroup.foreground#56726090
- problemsErrorIcon.foreground#C44536
- problemsInfoIcon.foreground#5E8A8C
- problemsWarningIcon.foreground#D4850A
- progressBar.background#6B8E7A
- quickInput.background#F5F2EA
- quickInput.foreground#1A1C1A
- quickInputList.focusBackground#6B8E7A24
- quickInputList.focusForeground#40553E
- quickInputList.focusIconForeground#567260
- quickInputTitle.background#F0EDE5
- scrollbar.shadow#00000014
- scrollbarSlider.activeBackground#6B8E7A40
- scrollbarSlider.background#6B8E7A14
- scrollbarSlider.hoverBackground#6B8E7A28
- selection.background#6B8E7A24
- settings.checkboxBackground#F5F2EA
- settings.checkboxBorder#C9C2B5
- settings.checkboxForeground#567260
- settings.dropdownBackground#F5F2EA
- settings.dropdownBorder#C9C2B5
- settings.dropdownForeground#1A1C1A
- settings.headerForeground#40553E
- settings.modifiedItemIndicator#D4850A
- settings.numberInputBackground#F5F2EA
- settings.numberInputBorder#C9C2B5
- settings.numberInputForeground#1A1C1A
- settings.textInputBackground#F5F2EA
- settings.textInputBorder#C9C2B5
- settings.textInputForeground#1A1C1A
- sideBar.background#F5F2EA
- sideBar.border#E2DDD3
- sideBar.foreground#4A443A
- sideBarSectionHeader.background#F0EDE5
- sideBarSectionHeader.border#E2DDD3
- sideBarSectionHeader.foreground#655E51
- sideBarTitle.foreground#567260
- statusBar.background#F0EDE5
- statusBar.border#E2DDD3
- statusBar.debuggingBackground#D4850A
- statusBar.debuggingForeground#F9F7F1
- statusBar.foreground#4A443A
- statusBar.noFolderBackground#F0EDE5
- statusBar.noFolderForeground#857D6E
- statusBarItem.activeBackground#6B8E7A28
- statusBarItem.errorBackground#C4453670
- statusBarItem.errorForeground#F9F7F1
- statusBarItem.hoverBackground#6B8E7A18
- statusBarItem.prominentBackground#6B8E7A28
- statusBarItem.prominentHoverBackground#6B8E7A38
- statusBarItem.remoteBackground#6B8E7A
- statusBarItem.remoteForeground#F9F7F1
- statusBarItem.warningBackground#D4850A70
- statusBarItem.warningForeground#1A1C1A
- tab.activeBackground#F9F7F1
- tab.activeBorder#F9F7F1
- tab.activeBorderTop#6B8E7A
- tab.activeForeground#40553E
- tab.border#E2DDD3
- tab.hoverBackground#F5F2EA
- tab.hoverForeground#1A1C1A
- tab.inactiveBackground#F0EDE5
- tab.inactiveForeground#857D6E
- tab.lastPinnedBorder#6B8E7A40
- tab.unfocusedActiveBackground#F9F7F1
- tab.unfocusedActiveForeground#655E51
- tab.unfocusedInactiveBackground#F0EDE5
- tab.unfocusedInactiveForeground#A69E8F
- terminal.ansiBlack#1A1C1A
- terminal.ansiBlue#5E8A8C
- terminal.ansiBrightBlack#655E51
- terminal.ansiBrightBlue#40686A
- terminal.ansiBrightCyan#40553E
- terminal.ansiBrightGreen#567260
- terminal.ansiBrightMagenta#5A4080
- terminal.ansiBrightRed#E0635A
- terminal.ansiBrightWhite#1A1C1A
- terminal.ansiBrightYellow#B87008
- terminal.ansiCyan#6B8E7A
- terminal.ansiGreen#2E9E5A
- terminal.ansiMagenta#7B5EA3
- terminal.ansiRed#C44536
- terminal.ansiWhite#857D6E
- terminal.ansiYellow#D4850A
- terminal.background#F5F2EA
- terminal.border#E2DDD3
- terminal.foreground#1A1C1A
- terminal.selectionBackground#6B8E7A24
- terminalCursor.background#F9F7F1
- terminalCursor.foreground#567260
- testing.iconErrored#C44536
- testing.iconFailed#C44536
- testing.iconPassed#2E9E5A
- testing.iconSkipped#C9C2B5
- testing.runAction#567260
- titleBar.activeBackground#F0EDE5
- titleBar.activeForeground#2E2A23
- titleBar.border#E2DDD3
- titleBar.inactiveBackground#F0EDE5
- titleBar.inactiveForeground#857D6E
- tree.indentGuidesStroke#C9C2B5
- walkThrough.embeddedEditorBackground#F5F2EA
- welcomePage.background#F9F7F1
- welcomePage.progress.background#F0EDE5
- welcomePage.progress.foreground#6B8E7A
- welcomePage.tileBackground#F5F2EA
- welcomePage.tileBorder#E2DDD3
- welcomePage.tileHoverBackground#F0EDE5
- widget.shadow#00000014
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #A69E8F | italic |
| comment.block.documentation, comment.line.documentation | #857D6E | italic |
| string, string.quoted, string.template | #40553E | — |
| constant.character.escape, constant.other.placeholder | #B87008 | — |
| string.regexp, punctuation.definition.string.regexp, string.regexp.character-class | #5A4080 | — |
| punctuation.definition.template-expression, punctuation.section.embedded | #B87008 | — |
| constant.numeric, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.numeric.octal, constant.numeric.binary | #B87008 | — |
| constant.language, constant.language.boolean, constant.language.null, constant.language.undefined | #A83830 | — |
| constant.other, constant.character | #A83830 | — |
| variable.other.constant | #A83830 | — |
| keyword, keyword.control, keyword.control.flow | #5A4080 | italic |
| keyword.operator, keyword.operator.assignment, keyword.operator.comparison, keyword.operator.logical, keyword.operator.arithmetic | #655E51 | — |
| keyword.operator.logical.python, keyword.operator.wordlike | #5A4080 | italic |
| keyword.operator.new, keyword.operator.delete, keyword.operator.typeof, keyword.operator.void, keyword.operator.instanceof | #5A4080 | italic |
| storage, storage.type, storage.modifier | #5A4080 | italic |
| entity.name.function, meta.function entity.name.function | #40686A | — |
| meta.function-call entity.name.function, meta.function-call.generic, support.function | #40686A | — |
| variable.parameter, meta.function.parameters variable.other | #4A443A | italic |
| storage.type.function.arrow | #655E51 | — |
| entity.name.class, entity.name.type.class, entity.name.type | #40553E | — |
| entity.other.inherited-class | #567260 | italic |
| entity.name.type.interface, support.type.interface | #40553E | italic |
| entity.name.type.parameter, variable.type.parameter | #B87008 | — |
| support.type, support.type.primitive, keyword.type | #40553E | — |
| variable, variable.other, variable.other.readwrite | #1A1C1A | — |
| variable.language.self, variable.language.this, variable.language.super | #A83830 | italic |
| variable.other.property, variable.other.object.property, meta.property-name, support.variable.property | #4A443A | — |
| meta.object-literal.key, meta.object.member, support.type.property-name | #655E51 | — |
| punctuation, meta.brace, punctuation.separator, punctuation.terminator | #857D6E | — |
| punctuation.definition.string.begin, punctuation.definition.string.end | #567260 | — |
| meta.decorator, entity.name.function.decorator, punctuation.decorator | #B87008 | italic |
| entity.name.namespace, entity.name.module, entity.name.package | #40553E | — |
| entity.name.tag, meta.tag.sgml | #5A4080 | — |
| punctuation.definition.tag, meta.tag punctuation | #A69E8F | — |
| entity.other.attribute-name, meta.tag.attributes entity.other.attribute-name | #B87008 | — |
| 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 | #B87008 | — |
| support.type.property-name.css, meta.property-name.css | #40686A | — |
| meta.property-value.css, support.constant.property-value.css | #40553E | — |
| constant.other.color.rgb-value.css, keyword.other.unit.css | #B87008 | — |
| markup.heading, entity.name.section.markdown | #40553E | bold |
| markup.bold | #1A1C1A | bold |
| markup.italic | #5A4080 | italic |
| markup.inline.raw | #40553E | — |
| markup.underline.link | #40686A | underline |
| markup.quote | #857D6E | italic |
| punctuation.definition.list.begin.markdown | #567260 | — |
| support.type.property-name.json | #40686A | — |
| entity.name.tag.yaml | #40686A | — |
| support.function.builtin.shell | #40686A | — |
| variable.other.normal.shell, variable.other.special.shell | #B87008 | — |
| invalid | #C44536 | strikethrough |
| invalid.deprecated | #B87008 | strikethrough |
| markup.inserted | #2E9E5A | — |
| markup.deleted | #C44536 | — |
| markup.changed | #D4850A | — |