KatanaX
Publisher: priteshlad3Themes in package: 3
KatanaX is a sleek dark theme collection for Visual Studio Code, featuring Midnight Blue, MistyWind, and Cherry Blossom themes, designed for comfortable coding and vibrant syntax highlights.
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#F0DEE6
- activityBar.activeBorder#E8A0B4
- activityBar.background#E8D5DC
- activityBar.border#DEC8D2
- activityBar.foreground#8A4A55
- activityBar.inactiveForeground#C8AABB
- activityBarBadge.background#E8A0B4
- activityBarBadge.foreground#FFFFFF
- badge.background#E8A0B4
- badge.foreground#FFFFFF
- breadcrumb.activeSelectionForeground#8A4A55
- breadcrumb.background#F8EEF2
- breadcrumb.focusForeground#5A3A45
- breadcrumb.foreground#AA8898
- breadcrumbPicker.background#F8EEF2
- button.background#E8A0B4
- button.foreground#FFFFFF
- button.hoverBackground#D48899
- button.secondaryBackground#EDD8E2
- button.secondaryForeground#5A3A45
- button.secondaryHoverBackground#E0C8D4
- checkbox.background#FFFFFF
- checkbox.border#DEC8D2
- checkbox.foreground#2A2A3A
- contrastBorder#00000000
- diffEditor.diagonalFill#E8D5DC
- diffEditor.insertedLineBackground#5AA87A12
- diffEditor.insertedTextBackground#5AA87A22
- diffEditor.removedLineBackground#E8A0B412
- diffEditor.removedTextBackground#E8A0B422
- dropdown.background#FFFFFF
- dropdown.border#DEC8D2
- dropdown.foreground#2A2A3A
- dropdown.listBackground#F8EEF2
- editor.background#F8EEF2
- editor.findMatchBackground#E8A0B466
- editor.findMatchHighlightBackground#E8A0B433
- editor.findRangeHighlightBackground#E8A0B418
- editor.foreground#2A2A3A
- editor.hoverHighlightBackground#D4E8F044
- editor.inactiveSelectionBackground#E8A0B420
- editor.lineHighlightBackground#EFE0E8
- editor.lineHighlightBorder#E8D0DA
- editor.rangeHighlightBackground#D4E8F033
- editor.selectionBackground#E8A0B455
- editor.selectionHighlightBackground#E8A0B428
- editor.wordHighlightBackground#D4E8F055
- editor.wordHighlightStrongBackground#D4E8F088
- editorBracketHighlight.foreground1#E8A0B4
- editorBracketHighlight.foreground2#7A7A8A
- editorBracketHighlight.foreground3#8A4A55
- editorBracketHighlight.foreground4#A07888
- editorBracketHighlight.unexpectedBracket.foreground#CC4444
- editorBracketMatch.background#E8A0B433
- editorBracketMatch.border#E8A0B4AA
- editorCodeLens.foreground#C8AABB
- editorCursor.background#F8EEF2
- editorCursor.foreground#E8A0B4
- editorGroupHeader.border#DEC8D2
- editorGroupHeader.noTabsBackground#F8EEF2
- editorGroupHeader.tabsBackground#E8D5DC
- editorGutter.addedBackground#5AA87A
- editorGutter.background#F8EEF2
- editorGutter.changedBackground#B87040
- editorGutter.deletedBackground#E8A0B4
- editorHoverWidget.background#FFFFFF
- editorHoverWidget.border#E0C8D4
- editorHoverWidget.foreground#2A2A3A
- editorHoverWidget.statusBarBackground#F8EEF2
- editorIndentGuide.activeBackground1#E8A0B466
- editorIndentGuide.background1#E0C8D4
- editorInlayHint.background#EDD8E2CC
- editorInlayHint.foreground#AA8898
- editorInlayHint.parameterBackground#EDD8E2CC
- editorInlayHint.parameterForeground#8A4A5588
- editorInlayHint.typeBackground#EDD8E2CC
- editorInlayHint.typeForeground#7A7A8A
- editorLightBulb.foreground#B87040
- editorLightBulbAutoFix.foreground#4A8A6A
- editorLineNumber.activeForeground#8A4A55
- editorLineNumber.foreground#C8AABB
- editorOverviewRuler.border#EDD8E2
- editorOverviewRuler.errorForeground#CC4444CC
- editorOverviewRuler.findMatchForeground#E8A0B4AA
- editorOverviewRuler.infoForeground#7A7A8ACC
- editorOverviewRuler.selectionHighlightForeground#7A7A8AAA
- editorOverviewRuler.warningForeground#B87040CC
- editorRuler.foreground#E0C8D4
- editorSuggestWidget.background#FFFFFF
- editorSuggestWidget.border#E0C8D4
- editorSuggestWidget.focusHighlightForeground#8A4A55
- editorSuggestWidget.foreground#2A2A3A
- editorSuggestWidget.highlightForeground#8A4A55
- editorSuggestWidget.selectedBackground#F0DCE4
- editorSuggestWidget.selectedForeground#2A2A3A
- editorSuggestWidget.selectedIconForeground#E8A0B4
- editorWhitespace.foreground#DCC8D2
- extensionBadge.remoteBackground#E8A0B4
- extensionBadge.remoteForeground#FFFFFF
- extensionButton.prominentBackground#E8A0B4
- extensionButton.prominentForeground#FFFFFF
- extensionButton.prominentHoverBackground#D48899
- focusBorder#E8A0B488
- gitDecoration.addedResourceForeground#4A8A6A
- gitDecoration.conflictingResourceForeground#AA5522
- gitDecoration.deletedResourceForeground#CC4455
- gitDecoration.ignoredResourceForeground#C8AABB
- gitDecoration.modifiedResourceForeground#B87040
- gitDecoration.renamedResourceForeground#8A4A55
- gitDecoration.stageDeletedResourceForeground#CC4455
- gitDecoration.stageModifiedResourceForeground#B87040
- gitDecoration.untrackedResourceForeground#4A8A6A
- icon.foreground#7A5A62
- input.background#FFFFFF
- input.border#DEC8D2
- input.foreground#2A2A3A
- input.placeholderForeground#C8AABB
- inputOption.activeBackground#E8A0B433
- inputOption.activeBorder#E8A0B4
- inputOption.activeForeground#2A2A3A
- inputValidation.errorBackground#FFF0F0
- inputValidation.errorBorder#CC4444
- inputValidation.infoBackground#F0F4FF
- inputValidation.infoBorder#7A7A8A
- inputValidation.warningBackground#FFF8EE
- inputValidation.warningBorder#B87040
- keybindingLabel.background#F0E2EA
- keybindingLabel.border#DEC8D2
- keybindingLabel.bottomBorder#C8AABB
- keybindingLabel.foreground#5A3A45
- list.activeSelectionBackground#E8C0CC
- list.activeSelectionForeground#2A2A3A
- list.dropBackground#E8C0CC
- list.focusBackground#E8C0CC
- list.focusForeground#2A2A3A
- list.focusHighlightForeground#E8A0B4
- list.highlightForeground#8A4A55
- list.hoverBackground#EDD5DF
- list.hoverForeground#2A2A3A
- list.inactiveSelectionBackground#EDD5DF
- list.inactiveSelectionForeground#3A2A30
- listFilterWidget.background#F0E2EA
- listFilterWidget.noMatchesOutline#CC4444
- listFilterWidget.outline#E8A0B4
- merge.border#E0C8D4
- merge.currentContentBackground#4A8A6A15
- merge.currentHeaderBackground#4A8A6A44
- merge.incomingContentBackground#E8A0B415
- merge.incomingHeaderBackground#E8A0B444
- minimap.background#EDD8E2
- minimap.errorHighlight#CC4444
- minimap.findMatchHighlight#E8A0B499
- minimap.selectionHighlight#E8A0B466
- minimap.warningHighlight#B87040
- minimapGutter.addedBackground#5AA87A
- minimapGutter.deletedBackground#E8A0B4
- minimapGutter.modifiedBackground#B87040
- notificationCenterHeader.background#EDD8E2
- notificationCenterHeader.foreground#7A5A62
- notificationLink.foreground#8A4A55
- notifications.background#F8EEF2
- notifications.border#E0C8D4
- notifications.foreground#2A2A3A
- notificationToast.border#E8A0B466
- panel.background#F0E2EA
- panel.border#E8A0B444
- panelTitle.activeBorder#E8A0B4
- panelTitle.activeForeground#8A4A55
- panelTitle.inactiveForeground#BBA0AA
- peekView.border#E8A0B4
- peekViewEditor.background#FFF6F8
- peekViewEditor.matchHighlightBackground#E8A0B444
- peekViewEditorGutter.background#FFF6F8
- peekViewResult.background#F8EEF2
- peekViewResult.fileForeground#8A4A55
- peekViewResult.lineForeground#7A5A62
- peekViewResult.matchHighlightBackground#E8A0B444
- peekViewResult.selectionBackground#E8C0CC
- peekViewResult.selectionForeground#2A2A3A
- peekViewTitle.background#F8EEF2
- peekViewTitleDescription.foreground#AA8898
- peekViewTitleLabel.foreground#2A2A3A
- pickerGroup.border#E0C8D4
- pickerGroup.foreground#C8AABB
- progressBar.background#E8A0B4
- quickInput.background#F8EEF2
- quickInput.foreground#2A2A3A
- quickInputHighlightForeground#8A4A55
- quickInputList.focusBackground#E8C0CC
- quickInputList.focusForeground#2A2A3A
- quickInputList.focusIconForeground#8A4A55
- scrollbar.shadow#00000018
- scrollbarSlider.activeBackground#E8A0B499
- scrollbarSlider.background#E8A0B433
- scrollbarSlider.hoverBackground#E8A0B466
- search.resultsInfoForeground#AA8898
- searchEditor.findMatchBackground#E8A0B444
- searchEditor.findMatchBorder#E8A0B477
- selection.background#E8A0B444
- settings.dropdownBackground#FFFFFF
- settings.dropdownBorder#DEC8D2
- settings.dropdownForeground#2A2A3A
- settings.headerForeground#8A4A55
- settings.modifiedItemIndicator#E8A0B4
- settings.numberInputBackground#FFFFFF
- settings.numberInputForeground#2A2A3A
- settings.textInputBackground#FFFFFF
- settings.textInputForeground#2A2A3A
- sideBar.background#F0E2EA
- sideBar.border#DEC8D2
- sideBar.foreground#5A3A45
- sideBarSectionHeader.background#E8D5DC
- sideBarSectionHeader.border#DEC8D2
- sideBarSectionHeader.foreground#7A5A62
- sideBarTitle.foreground#8A4A55
- statusBar.background#E8A0B4
- statusBar.border#D890A4
- statusBar.debuggingBackground#8A4A55
- statusBar.debuggingForeground#FFFFFF
- statusBar.foreground#FFFFFF
- statusBar.noFolderBackground#C8A0A8
- statusBar.noFolderForeground#FFFFFF
- statusBarItem.activeBackground#CC88A0
- statusBarItem.errorBackground#AA2222
- statusBarItem.errorForeground#FFFFFF
- statusBarItem.hoverBackground#D890A4
- statusBarItem.remoteBackground#8A4A55
- statusBarItem.remoteForeground#FFFFFF
- statusBarItem.warningBackground#996030
- statusBarItem.warningForeground#FFFFFF
- tab.activeBackground#F8EEF2
- tab.activeBorder#F8EEF2
- tab.activeBorderTop#E8A0B4
- tab.activeForeground#2A2A3A
- tab.border#DEC8D2
- tab.hoverBackground#F0E2EA
- tab.hoverForeground#3A2A30
- tab.inactiveBackground#E8D5DC
- tab.inactiveForeground#AA8898
- tab.lastPinnedBorder#E8A0B455
- tab.unfocusedActiveBackground#F8EEF2
- tab.unfocusedActiveForeground#7A5A62
- tab.unfocusedInactiveForeground#BBA0AA
- terminal.ansiBlack#2A2A3A
- terminal.ansiBlue#5A7AAA
- terminal.ansiBrightBlack#5A5A6A
- terminal.ansiBrightBlue#7A9ABF
- terminal.ansiBrightCyan#6AACAC
- terminal.ansiBrightGreen#6AAA8A
- terminal.ansiBrightMagenta#AA6A95
- terminal.ansiBrightRed#E8A0B4
- terminal.ansiBrightWhite#2A2A3A
- terminal.ansiBrightYellow#C89060
- terminal.ansiCyan#4A8A8A
- terminal.ansiGreen#4A8A6A
- terminal.ansiMagenta#8A4A75
- terminal.ansiRed#CC4455
- terminal.ansiWhite#7A7A8A
- terminal.ansiYellow#B87040
- terminal.background#F0E2EA
- terminal.border#DEC8D2
- terminal.cursorForeground#E8A0B4
- terminal.foreground#2A2A3A
- terminal.selectionBackground#E8A0B433
- terminalCursor.background#F0E2EA
- terminalCursor.foreground#E8A0B4
- textBlockQuote.background#F0DCE6
- textBlockQuote.border#E8A0B4
- textLink.activeForeground#CC6688
- textLink.foreground#8A4A55
- textPreformat.foreground#8A4A55
- textSeparator.foreground#E0C8D4
- titleBar.activeBackground#EDD8E2
- titleBar.activeForeground#5A3A45
- titleBar.border#DEC8D2
- titleBar.inactiveBackground#EDD8E2
- titleBar.inactiveForeground#AA8898
- tree.indentGuidesStroke#DCC8D2
- widget.shadow#00000022
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #BBA0AA | italic |
| comment.block.documentation | #AA9098 | italic |
| keyword, keyword.control, keyword.operator.new, keyword.operator.delete, keyword.operator.typeof, keyword.operator.void, storage.modifier, storage.type.class, storage.type.function, storage.type.interface, storage.type.enum, storage.type.type | #CC5577 | bold |
| keyword.control.flow, keyword.control.return, keyword.control.if, keyword.control.else, keyword.control.switch, keyword.control.for, keyword.control.while, keyword.control.break, keyword.control.continue, keyword.control.throw, keyword.control.try, keyword.control.catch, keyword.control.finally | #E8608A | bold italic |
| keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as | #CC5577 | italic |
| storage.type, storage.type.js, storage.type.ts | #CC5577 | bold |
| string, string.quoted.single, string.quoted.double, string.quoted.backtick, string.template | #AA4466 | — |
| constant.character.escape, string.regexp | #CC3366 | bold |
| punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end | #CC5577 | — |
| constant.numeric, constant.numeric.decimal, constant.numeric.hex, constant.numeric.octal, constant.numeric.binary | #AA6644 | — |
| constant.language.boolean, constant.language.null, constant.language.undefined, constant.language | #BB7755 | italic |
| entity.name.function, meta.function-call.generic | #5A5A7A | bold |
| variable.function | #6A6A8A | — |
| variable.parameter, meta.parameters variable | #7A6878 | italic |
| variable, variable.other, variable.other.readwrite | #2A2A3A | — |
| variable.language.this, variable.language.self, variable.language.super | #CC5577 | italic bold |
| variable.other.constant, variable.other.constant.property | #8A5A44 | — |
| variable.other.property, variable.other.object.property, support.variable.property | #4A4A5A | — |
| entity.name.class, entity.name.type, entity.name.type.class, entity.name.type.interface, entity.name.type.enum, entity.name.type.alias | #8A4A55 | bold |
| entity.other.inherited-class | #9A5A65 | italic |
| meta.type.annotation, meta.return.type, meta.type.parameters | #7A4A55 | — |
| support.type, support.class | #805060 | — |
| meta.decorator, entity.name.function.decorator, punctuation.decorator | #AA6644 | italic |
| keyword.operator, keyword.operator.assignment, keyword.operator.comparison, keyword.operator.logical, keyword.operator.arithmetic | #885566 | — |
| storage.type.function.arrow, keyword.operator.arrow | #CC5577 | bold |
| keyword.operator.spread, keyword.operator.rest | #CC5577 | — |
| punctuation.separator, punctuation.terminator, punctuation.definition.string.begin, punctuation.definition.string.end | #AA8898 | — |
| punctuation.definition.block, punctuation.section.block, meta.brace.curly, meta.brace.square, meta.brace.round | #8A6878 | — |
| entity.name.tag, meta.tag.sgml | #CC5577 | bold |
| entity.other.attribute-name, meta.tag entity.other.attribute-name | #8A4A55 | italic |
| string.quoted.double.html, string.quoted.single.html | #AA4466 | — |
| punctuation.definition.tag, meta.tag punctuation.definition.tag | #CC88AA | — |
| support.class.component | #8A4A55 | bold |
| entity.name.tag.css, entity.other.attribute-name.class.css, entity.other.attribute-name.id.css | #CC5577 | — |
| support.type.property-name.css, meta.property-name.css | #5A5A7A | — |
| support.constant.property-value, meta.property-value | #AA4466 | — |
| keyword.other.unit, constant.numeric.css | #AA6644 | — |
| variable.scss, variable.sass | #8A4A55 | — |
| entity.other.attribute-name.pseudo-class, entity.other.attribute-name.pseudo-element | #885566 | italic |
| support.type.property-name.json, meta.object-literal.key string, meta.structure.dictionary.json support.type.property-name | #8A4A55 | — |
| meta.structure.dictionary.value.json string.quoted.double | #AA4466 | — |
| markup.heading, markup.heading.markdown, punctuation.definition.heading.markdown | #CC5577 | bold |
| markup.bold | #2A2A3A | bold |
| markup.italic | #8A4A55 | italic |
| markup.inline.raw, markup.raw.inline | #5A5A7A | — |
| markup.underline.link | #8A4A55 | underline |
| markup.quote | #BBA0AA | italic |
| punctuation.definition.list.begin.markdown | #CC5577 | — |
| variable.language.special.self.python | #CC5577 | italic bold |
| entity.name.function.decorator.python, meta.function.decorator.python | #AA6644 | italic |
| support.function.builtin.python | #6A6A8A | — |
| support.function.magic.python | #885566 | bold italic |
| entity.name.lifetime.rust, storage.modifier.lifetime.rust | #AA6644 | italic |
| support.function.macro.rust, entity.name.function.macro.rust | #CC5577 | bold |
| entity.name.type.trait.rust | #8A4A55 | italic |
| entity.name.namespace, entity.name.module | #7A4A55 | — |
| support.function | #6A6A8A | — |
| support.constant | #BB7755 | — |
| invalid, invalid.illegal | #CC2244 | underline bold |
| invalid.deprecated | #C8AABB | strikethrough |