KanaMin Theme

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.activeBorder#949498
• activityBar.background#0F1014
• activityBar.dropBorder#131317
• activityBar.foreground#A3A3A2
• activityBar.inactiveForeground#6C6D73
• activityBarBadge.background#999999
• activityBarBadge.foreground#191A1E
• badge.background#999999
• badge.foreground#191A1E
• banner.background#111216
• banner.foreground#90909A
• banner.iconForeground#61626B
• breadcrumb.activeSelectionForeground#FFC592
• breadcrumb.background#131416
• breadcrumb.focusForeground#81828B
• breadcrumb.foreground#5D5E67
• breadcrumbPicker.background#16171B
• button.background#a5867b
• button.foreground#191A1E
• button.hoverBackground#ffbb88e6
• button.secondaryBackground#212226
• button.secondaryForeground#A0A0AA
• button.secondaryHoverBackground#131317
• checkbox.background#111216
• checkbox.border#817c9c
• checkbox.foreground#90909A
• debugExceptionWidget.background#111216
• debugExceptionWidget.border#817c9c
• debugIcon.breakpointCurrentStackframeForeground#FFEF70
• debugIcon.breakpointDisabledForeground#C4C0CA
• debugIcon.breakpointForeground#FF6B97
• debugIcon.breakpointStackframeForeground#C1BBC9
• debugIcon.breakpointUnverifiedForeground#FF9D5D
• debugIcon.continueForeground#C1BBC9
• debugIcon.disconnectForeground#C1BBC9
• debugIcon.pauseForeground#C1BBC9
• debugIcon.restartForeground#85E299
• debugIcon.startForeground#85E299
• debugIcon.stepBackForeground#C1BBC9
• debugIcon.stepIntoForeground#C1BBC9
• debugIcon.stepOutForeground#C1BBC9
• debugIcon.stepOverForeground#C1BBC9
• debugIcon.stopForeground#FF6B97
• debugToolBar.background#111416
• debugToolBar.border#25292a
• descriptionForeground#61626B
• diffEditor.border#333337
• diffEditor.diagonalFill#817c9c4d
• diffEditor.insertedTextBackground#c58f8f14
• diffEditor.insertedTextBorder#8fffb180
• diffEditor.removedTextBackground#f58ee014
• diffEditor.removedTextBorder#f5bc8e80
• dropdown.background#111216
• dropdown.border#817c9c75
• dropdown.foreground#90909A
• dropdown.listBackground#111216
• editor.background#121417
• editor.findMatchBackground#817c9c4d
• editor.findMatchHighlightBackground#817c9c4d
• editor.findRangeHighlightBackground#817c9c4d
• editor.findRangeHighlightBorder#0000
• editor.focusedStackFrameHighlightBackground#817c9c26
• editor.foldBackground#111216F0
• editor.foreground#B0B0BA
• editor.hoverHighlightBackground#5d5d5d50
• editor.inactiveSelectionBackground#817c9c34
• editor.inlineValuesBackground#0000
• editor.inlineValuesForeground#61626B
• editor.lineHighlightBackground#817c9c24
• editor.lineHighlightBorder#817c9c24
• editor.linkedEditingBackground#111216
• editor.rangeHighlightBackground#817c9c44
• editor.rangeHighlightBorder#0000
• editor.selectionBackground#817c9c46
• editor.selectionForeground#90909A
• editor.selectionHighlightBackground#817c9c46
• editor.selectionHighlightBorder#0000
• editor.snippetFinalTabstopHighlightBackground#817c9c26
• editor.snippetFinalTabstopHighlightBorder#111216
• editor.snippetTabstopHighlightBackground#817c9c26
• editor.snippetTabstopHighlightBorder#111216
• editor.stackFrameHighlightBackground#817c9c26
• editor.symbolHighlightBackground#817c9c26
• editor.symbolHighlightBorder#0000
• editor.wordHighlightBackground#817c9c36
• editor.wordHighlightBorder#0000
• editor.wordHighlightStrongBackground#817c9c26
• editor.wordHighlightStrongBorder#817c9c26
• editorBracketHighlight.foreground1#FF98EA90
• editorBracketHighlight.foreground2#98C0FF90
• editorBracketHighlight.foreground3#A2A2B090
• editorBracketHighlight.foreground4#CF99FF90
• editorBracketHighlight.foreground5#FFC59290
• editorBracketHighlight.foreground6#FFFFFF90
• editorBracketMatch.background#0000
• editorBracketMatch.border#61626B
• editorBracketPairGuide.activeBackground1#8eb6f5
• editorBracketPairGuide.activeBackground2#ffbb88
• editorBracketPairGuide.activeBackground3#fdfdfe
• editorBracketPairGuide.activeBackground4#c58fff
• editorBracketPairGuide.activeBackground5#9898a6
• editorBracketPairGuide.activeBackground6#f58ee0
• editorBracketPairGuide.background1#8eb6f580
• editorBracketPairGuide.background2#ffbb8880
• editorBracketPairGuide.background3#fdfdfe80
• editorBracketPairGuide.background4#c58fff80
• editorBracketPairGuide.background5#9898a680
• editorBracketPairGuide.background6#f58ee080
• editorCodeLens.foreground#FFC592
• editorCursor.background#868690
• editorCursor.foreground#FFF
• editorError.border#0000
• editorError.foreground#FF9898
• editorGhostText.foreground#61626B
• editorGroup.border#0000
• editorGroup.dropBackground#111216
• editorGroup.emptyBackground#0000
• editorGroup.focusedEmptyBorder#0000
• editorGroupHeader.noTabsBackground#0000
• editorGroupHeader.tabsBackground#0000
• editorGroupHeader.tabsBorder#0000
• editorGutter.addedBackground#45c05a
• editorGutter.background#0000
• editorGutter.commentRangeForeground#61626B
• editorGutter.deletedBackground#ff3e48
• editorGutter.foldingControlForeground#FFFFFF
• editorGutter.modifiedBackground#ffbb88
• editorHint.border#0000
• editorHint.foreground#61626B
• editorHoverWidget.background#111216
• editorHoverWidget.border#43444D80
• editorHoverWidget.foreground#61626B
• editorHoverWidget.highlightForeground#90909A
• editorHoverWidget.statusBarBackground#0000
• editorIndentGuide.activeBackground#43444D
• editorIndentGuide.background#817c9c4d
• editorInfo.border#131317
• editorInfo.foreground#99D7FF
• editorInlayHint.background#131317
• editorInlayHint.foreground#61626B
• editorInlayHint.parameterBackground#131317
• editorInlayHint.parameterForeground#FFFFFF
• editorInlayHint.typeBackground#131317
• editorInlayHint.typeForeground#9B98FF
• editorLightBulb.foreground#98C0FF
• editorLightBulbAutoFix.foreground#FFC592
• editorLineNumber.activeForeground#B0B0BA
• editorLineNumber.foreground#61626B
• editorLink.activeForeground#FFC592
• editorMarkerNavigation.background#111216
• editorMarkerNavigationError.background#111216
• editorMarkerNavigationInfo.background#111216
• editorMarkerNavigationWarning.background#111216
• editorOverviewRuler.addedForeground#ff8f8f80
• editorOverviewRuler.background#0F1014
• editorOverviewRuler.border#817c9c4d
• editorOverviewRuler.bracketMatchForeground#61626B
• editorOverviewRuler.commonContentForeground#817c9c14
• editorOverviewRuler.currentContentForeground#817c9c26
• editorOverviewRuler.deletedForeground#f58ee080
• editorOverviewRuler.errorForeground#f58ee080
• editorOverviewRuler.findMatchForeground#8B86A64D
• editorOverviewRuler.incomingContentForeground#fdfdfe80
• editorOverviewRuler.infoForeground#8fcdff80
• editorOverviewRuler.modifiedForeground#ffbb8880
• editorOverviewRuler.rangeHighlightForeground#8B86A64D
• editorOverviewRuler.selectionHighlightForeground#8B86A64D
• editorOverviewRuler.warningForeground#9898a680
• editorOverviewRuler.wordHighlightForeground#8B86A626
• editorOverviewRuler.wordHighlightStrongForeground#8B86A64D
• editorPane.background#0000
• editorRuler.foreground#8B86A64D
• editorSuggestWidget.background#111216
• editorSuggestWidget.border#0000
• editorSuggestWidget.focusHighlightForeground#FFC592
• editorSuggestWidget.foreground#61626B
• editorSuggestWidget.highlightForeground#FFC592
• editorSuggestWidget.selectedBackground#817c9c26
• editorSuggestWidget.selectedForeground#90909A
• editorSuggestWidget.selectedIconForeground#90909A
• editorUnnecessaryCode.border#0000
• editorUnnecessaryCode.opacity#00000080
• editorWarning.border#0000
• editorWarning.foreground#D6B10A
• editorWhitespace.foreground#4D4E57
• editorWidget.background#111216
• editorWidget.border#131317
• editorWidget.foreground#71727B
• editorWidget.resizeBorder#43444D
• errorForeground#FF7E7E
• extensionBadge.remoteBackground#fdfdfe
• extensionBadge.remoteForeground#191A1E
• extensionButton.prominentBackground#ffbb88
• extensionButton.prominentForeground#191A1E
• extensionButton.prominentHoverBackground#ffbb88e6
• extensionIcon.starForeground#FFC592
• extensionIcon.verifiedForeground#FFFFFF
• focusBorder#817c9c26
• foreground#90909A
• gitDecoration.addedResourceForeground#6691AE
• gitDecoration.conflictingResourceForeground#8CA9B1
• gitDecoration.deletedResourceForeground#D15843
• gitDecoration.ignoredResourceForeground#4D4E57
• gitDecoration.modifiedResourceForeground#B99F79
• gitDecoration.renamedResourceForeground#6E9972
• gitDecoration.stageDeletedResourceForeground#6691AE
• gitDecoration.stageModifiedResourceForeground#F2BC50
• gitDecoration.submoduleResourceForeground#E47155
• gitDecoration.untrackedResourceForeground#75C591
• icon.foreground#61626B
• input.background#13131780
• input.border#817c9c26
• input.foreground#90909A
• input.placeholderForeground#61626B
• inputOption.activeBackground#ffbb88
• inputOption.activeBorder#0000
• inputOption.activeForeground#191A1E
• inputValidation.errorBackground#121417
• inputValidation.errorBorder#817c9c26
• inputValidation.errorForeground#ff9898
• inputValidation.infoBackground#0000
• inputValidation.infoBorder#0000
• inputValidation.infoForeground#99D7FF
• inputValidation.warningBackground#0000
• inputValidation.warningBorder#0000
• inputValidation.warningForeground#99D7FF80
• keybindingLabel.background#131317
• keybindingLabel.border#817c9c4d
• keybindingLabel.bottomBorder#817c9c4d
• keybindingLabel.foreground#FFFFFF
• keybindingTable.headerBackground#131317
• keybindingTable.rowsBackground#111216
• list.activeSelectionBackground#817c9c26
• list.activeSelectionForeground#90909A
• list.activeSelectionIconForeground#90909A
• list.deemphasizedForeground#61626B
• list.dropBackground#111216
• list.errorForeground#E77D7D
• list.filterMatchBackground#111216
• list.filterMatchBorder#ffbb88
• list.focusBackground#817c9c4d
• list.focusForeground#90909A
• list.focusOutline#817c9c26
• list.highlightForeground#FFC592
• list.hoverBackground#817c9c34
• list.hoverForeground#90909A
• list.inactiveFocusBackground#817c9c14
• list.inactiveSelectionBackground#111216
• list.inactiveSelectionForeground#90909A
• list.inactiveSelectionIconForeground#61626B
• list.invalidItemForeground#FF98EA
• list.warningForeground#D6B10A
• listFilterWidget.background#111216
• listFilterWidget.noMatchesOutline#f58ee0
• listFilterWidget.outline#131317
• menu.background#111216
• menu.border#817c9c14
• menu.foreground#90909A
• menu.selectionBackground#817c9c56
• menu.selectionBorder#131317
• menu.selectionForeground#A1A2AB
• menu.separatorBackground#868690
• menubar.selectionBackground#817c9c56
• menubar.selectionBorder#817c9c14
• menubar.selectionForeground#A1A2AB
• merge.border#131317
• merge.commonContentBackground#817c9c26
• merge.commonHeaderBackground#817c9c26
• merge.currentContentBackground#9898a680
• merge.currentHeaderBackground#9898a680
• merge.incomingContentBackground#8fcdff80
• merge.incomingHeaderBackground#8fcdff80
• minimap.background#111216
• minimap.errorHighlight#f58ee080
• minimap.findMatchHighlight#817c9c26
• minimap.selectionHighlight#817c9c26
• minimap.warningHighlight#9898a680
• minimapGutter.addedBackground#8fcdff
• minimapGutter.deletedBackground#f58ee0
• minimapGutter.modifiedBackground#ffbb88
• minimapSlider.activeBackground#817c9c4d
• minimapSlider.background#817c9c26
• minimapSlider.hoverBackground#817c9c26
• notificationCenter.border#817c9c26
• notificationCenterHeader.background#111216
• notificationCenterHeader.foreground#61626B
• notificationLink.foreground#FFFFFF
• notifications.background#111216
• notifications.border#817c9c26
• notifications.foreground#90909A
• notificationsErrorIcon.foreground#FF98EA
• notificationsInfoIcon.foreground#99D7FF
• notificationsWarningIcon.foreground#A2A2B0
• notificationToast.border#817c9c26
• panel.background#111216
• panel.border#0000
• panel.dropBorder#131317
• panelInput.border#111216
• panelSection.dropBackground#817c9c26
• panelSectionHeader.background#111216
• panelSectionHeader.foreground#90909A
• panelTitle.activeBorder#817c9c4d
• panelTitle.activeForeground#90909A
• panelTitle.inactiveForeground#61626B
• peekView.border#131317
• peekViewEditor.background#111216
• peekViewEditor.matchHighlightBackground#817c9c4d
• peekViewResult.background#111216
• peekViewResult.fileForeground#61626B
• peekViewResult.lineForeground#61626B
• peekViewResult.matchHighlightBackground#817c9c4d
• peekViewResult.selectionBackground#817c9c26
• peekViewResult.selectionForeground#90909A
• peekViewTitle.background#131317
• peekViewTitleDescription.foreground#61626B
• pickerGroup.border#817c9c4d
• pickerGroup.foreground#FFFFFF
• ports.iconRunningProcessForeground#FFC592
• problemsErrorIcon.foreground#FF98EA
• problemsInfoIcon.foreground#99D7FF
• problemsWarningIcon.foreground#A2A2B0
• progressBar.background#ffbb88
• quickInput.background#111216
• quickInput.foreground#A1A2AB
• quickInputList.focusBackground#817c9c56
• quickInputList.focusForeground#C0C0CA
• quickInputList.focusIconForeground#C0C0CA
• scrollbar.shadow#0000
• scrollbarSlider.activeBackground#817c9c4d
• scrollbarSlider.background#817c9c14
• scrollbarSlider.hoverBackground#817c9c26
• searchEditor.findMatchBackground#817c9c26
• selection.background#817c9c4d
• settings.focusedRowBackground#111216
• settings.focusedRowBorder#817c9c26
• settings.headerForeground#90909A
• settings.modifiedItemIndicator#FFC592
• settings.rowHoverBackground#212226
• sideBar.background#121417
• sideBar.dropBackground#121417
• sideBar.foreground#81828B
• sideBarSectionHeader.background#0000
• sideBarSectionHeader.border#817c9c26
• statusBar.background#0F1014
• statusBar.debuggingBackground#7d7d7e
• statusBar.debuggingForeground#191A1E
• statusBar.focusBorder#0F1014
• statusBar.foreground#71727B
• statusBar.noFolderBackground#0F1014
• statusBar.noFolderForeground#61626B
• statusBarItem.activeBackground#817c9c4d
• statusBarItem.errorBackground#0F1014
• statusBarItem.errorForeground#FF9898
• statusBarItem.hoverBackground#111216
• statusBarItem.hoverForeground#B0B0BA
• statusBarItem.prominentBackground#131317
• statusBarItem.prominentForeground#90909A
• statusBarItem.prominentHoverBackground#817c9c26
• statusBarItem.remoteBackground#a5867b
• statusBarItem.remoteForeground#191A1E
• statusBarItem.remoteHoverBackground#ffbb88e6
• statusBarItem.remoteHoverForeground#191A1E
• symbolIcon.arrayForeground#61626B
• symbolIcon.classForeground#61626B
• symbolIcon.colorForeground#61626B
• symbolIcon.constantForeground#61626B
• symbolIcon.constructorForeground#61626B
• symbolIcon.enumeratorForeground#61626B
• symbolIcon.enumeratorMemberForeground#61626B
• symbolIcon.eventForeground#61626B
• symbolIcon.fieldForeground#61626B
• symbolIcon.fileForeground#61626B
• symbolIcon.folderForeground#61626B
• symbolIcon.functionForeground#61626B
• symbolIcon.interfaceForeground#61626B
• symbolIcon.keyForeground#61626B
• symbolIcon.keywordForeground#61626B
• symbolIcon.methodForeground#61626B
• symbolIcon.moduleForeground#61626B
• symbolIcon.namespaceForeground#61626B
• symbolIcon.nullForeground#61626B
• symbolIcon.numberForeground#61626B
• symbolIcon.objectForeground#61626B
• symbolIcon.operatorForeground#61626B
• symbolIcon.packageForeground#61626B
• symbolIcon.propertyForeground#61626B
• symbolIcon.referenceForeground#61626B
• symbolIcon.snippetForeground#61626B
• symbolIcon.stringForeground#61626B
• symbolIcon.structForeground#61626B
• symbolIcon.textForeground#61626B
• symbolIcon.typeParameterForeground#61626B
• symbolIcon.unitForeground#61626B
• symbolIcon.variableForeground#61626B
• tab.activeBackground#817c9c14
• tab.activeForeground#90909A
• tab.activeModifiedBorder#99D7FF
• tab.border#0000
• tab.hoverBackground#817c9c26
• tab.inactiveBackground#0000
• tab.inactiveForeground#61626B
• tab.inactiveModifiedBorder#99D7FF80
• tab.lastPinnedBorder#43444D
• tab.unfocusedActiveBackground#0000
• tab.unfocusedHoverBackground#0000
• tab.unfocusedInactiveBackground#0000
• tab.unfocusedInactiveModifiedBorder#99D7FF80
• terminal.ansiBlack#1F1F28
• terminal.ansiBlue#658594
• terminal.ansiBrightBlack#2A2A37
• terminal.ansiBrightBlue#7FB4CA
• terminal.ansiBrightCyan#A3D4D5
• terminal.ansiBrightGreen#98BB6C
• terminal.ansiBrightMagenta#D27E99
• terminal.ansiBrightRed#FF5D62
• terminal.ansiBrightWhite#DCD7BA
• terminal.ansiBrightYellow#E6C384
• terminal.ansiCyan#9CABCA
• terminal.ansiGreen#76946A
• terminal.ansiMagenta#957FB8
• terminal.ansiRed#E82424
• terminal.ansiWhite#DCD7BA
• terminal.ansiYellow#FF9E3B
• terminal.dropBackground#817c9c26
• terminal.foreground#90909A
• terminal.selectionBackground#323239
• terminal.tab.activeBorder#868690
• terminalCursor.background#868690
• terminalCursor.foreground#4D4E57
• textBlockQuote.background#111216
• textBlockQuote.border#817c9c26
• textCodeBlock.background#111216
• textLink.activeForeground#FFFFFFE6
• textLink.foreground#FFFFFF
• textPreformat.foreground#A2A2B0
• textSeparator.foreground#61626B
• titleBar.activeBackground#0F1014
• titleBar.activeForeground#61626B
• titleBar.inactiveBackground#111216
• titleBar.inactiveForeground#61626B
• toolbar.activeBackground#817c9c4d
• toolbar.hoverBackground#817c9c26
• tree.indentGuidesStroke#61626B
• walkThrough.embeddedEditorBackground#0F1014
• welcomePage.background#0F1014
• welcomePage.buttonBackground#111216
• welcomePage.buttonHoverBackground#131317
• widget.shadow#1917244d
• window.activeBorder#111216
• window.inactiveBorder#111216

tokenColors

TextMate scopes and font styles (syntax highlighting rules).