Kanagawa Paper
Publisher: thesimonhoThemes in package: 2
Remixed Kanagawa colourscheme with muted colors. For VSCode.
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.
- actionBar.toggledBackground#54546D
- activityBar.activeBorder#658594
- activityBar.background#16161D
- activityBar.border#2A2A37
- activityBar.foreground#658594
- activityBar.inactiveForeground#737c73
- activityBarBadge.background#658594
- activityBarBadge.foreground#DCD7BA
- badge.background#717C7C
- badge.foreground#DCD7BA
- button.background#658594
- button.border#00000000
- button.foreground#DCD7BA
- button.hoverBackground#5d7a88
- button.secondaryBackground#1F1F28
- button.secondaryForeground#c5c9c5
- button.secondaryHoverBackground#2A2A37
- chat.editedFileForeground#C0A36E
- chat.slashCommandBackground#435965
- chat.slashCommandForeground#9CABCA
- checkbox.background#1a1a22
- checkbox.border#363646
- debugToolBar.background#16161D
- descriptionForeground#c5c9c5
- diffEditor.insertedTextBackground#2B332880
- dropdown.background#1a1a22
- dropdown.border#363646
- dropdown.foreground#c5c9c5
- dropdown.listBackground#1F1F28
- editor.background#1F1F28
- editor.findMatchBackground#938056
- editor.findMatchBorder#C0A36E
- editor.findMatchHighlightBackground#43596580
- editor.foreground#c5c9c5
- editor.inactiveSelectionBackground#36364680
- editor.lineHighlightBackground#2A2A37
- editor.selectionBackground#36364680
- editor.selectionHighlightBackground#36364680
- editor.selectionHighlightBorder#54546D
- editor.wordHighlightBackground#3636464d
- editor.wordHighlightBorder#54546D
- editor.wordHighlightStrongBackground#3636464d
- editor.wordHighlightStrongBorder#54546D
- editorBracketHighlight.foreground1#c4746e
- editorBracketHighlight.foreground2#a292a3
- editorBracketHighlight.foreground3#658594
- editorBracketHighlight.foreground4#9d7665
- editorBracketHighlight.foreground5#699469
- editorBracketHighlight.foreground6#737c73
- editorBracketHighlight.unexpectedBracket.foreground#c4746e
- editorBracketMatch.background#16161D
- editorBracketMatch.border#54546D
- editorBracketPairGuide.activeBackground1#c4746e
- editorBracketPairGuide.activeBackground2#a292a3
- editorBracketPairGuide.activeBackground3#658594
- editorBracketPairGuide.activeBackground4#9d7665
- editorBracketPairGuide.activeBackground5#699469
- editorBracketPairGuide.activeBackground6#737c73
- editorBracketPairGuide.background1#c4746e66
- editorBracketPairGuide.background2#a292a366
- editorBracketPairGuide.background3#65859466
- editorBracketPairGuide.background4#9d766566
- editorBracketPairGuide.background5#69946966
- editorBracketPairGuide.background6#737c7366
- editorCursor.background#1F1F28
- editorCursor.foreground#C8C093
- editorError.foreground#E46876
- editorGroup.border#625e5a
- editorGroupHeader.tabsBackground#16161D
- editorGroupHeader.tabsBorder#2A2A37
- editorGutter.addedBackground#699469
- editorGutter.deletedBackground#E46876
- editorGutter.modifiedBackground#c4b28a
- editorHoverWidget.background#1F1F28
- editorHoverWidget.border#2A2A37
- editorHoverWidget.highlightForeground#658594
- editorIndentGuide.activeBackground1#8992a7
- editorIndentGuide.background1#363646
- editorInlayHint.background#1F1F28
- editorInlayHint.foreground#727169
- editorLineNumber.activeForeground#c5c9c5
- editorLineNumber.foreground#7a8382
- editorMarkerNavigation.background#363646
- editorOverviewRuler.border#12120f
- editorRuler.foreground#363646
- editorSuggestWidget.background#223249
- editorSuggestWidget.border#223249
- editorSuggestWidget.selectedBackground#2D4F67
- editorWarning.foreground#c4b28a
- editorWhitespace.foreground#2A2A37
- editorWidget.background#2A2A37
- errorForeground#E46876
- focusBorder#658594
- foreground#c5c9c5
- gitDecoration.addedResourceForeground#699469
- gitDecoration.conflictingResourceForeground#C0A36E
- gitDecoration.deletedResourceForeground#E46876
- gitDecoration.ignoredResourceForeground#727169
- gitDecoration.modifiedResourceForeground#c4b28a
- gitDecoration.untrackedResourceForeground#699469
- icon.foreground#c5c9c5
- input.background#1a1a22
- input.border#363646
- input.foreground#c5c9c5
- input.placeholderForeground#7a8382
- inputOption.activeBackground#708e9e
- inputOption.activeBorder#859fac
- keybindingLabel.foreground#c5c9c5
- list.activeSelectionBackground#363646
- list.activeSelectionForeground#c5c9c5
- list.activeSelectionIconForeground#DCD7BA
- list.dropBackground#363646
- list.errorForeground#E46876
- list.focusBackground#2A2A37
- list.focusForeground#c5c9c5
- list.highlightForeground#859fac
- list.hoverBackground#363646
- list.hoverForeground#c5c9c5
- list.inactiveSelectionBackground#2A2A37
- list.inactiveSelectionForeground#c5c9c5
- list.warningForeground#c4b28a
- menu.background#1F1F28
- menu.border#625e5a
- menu.foreground#c5c9c5
- menu.selectionBackground#658594
- menu.selectionForeground#DCD7BA
- menu.separatorBackground#625e5a
- minimapGutter.addedBackground#699469
- minimapGutter.deletedBackground#E46876
- minimapGutter.modifiedBackground#c4b28a
- notificationCenterHeader.background#1F1F28
- notificationCenterHeader.foreground#c5c9c5
- notifications.background#1F1F28
- notifications.border#2A2A37
- notifications.foreground#c5c9c5
- panel.background#16161D
- panel.border#2A2A37
- panelInput.border#2A2A37
- panelSectionHeader.background#16161D
- panelTitle.activeBorder#658594
- panelTitle.activeForeground#c5c9c5
- panelTitle.inactiveForeground#c5c9c5
- peekView.border#54546D
- peekViewEditor.background#1F1F28
- peekViewEditor.matchHighlightBackground#9d7665
- peekViewResult.background#1F1F28
- peekViewResult.matchHighlightBackground#9d7665
- pickerGroup.border#363646
- ports.iconRunningProcessForeground#76946A
- progressBar.background#658594
- quickInput.background#282727
- quickInput.foreground#c5c9c5
- quickInputList.focusBackground#2A2A37
- quickInputList.focusForeground#c5c9c5
- quickInputList.focusIconForeground#c5c9c5
- scrollbar.shadow#363646
- scrollbarSlider.activeBackground#54546D80
- scrollbarSlider.background#54546D66
- scrollbarSlider.hoverBackground#54546D80
- settings.dropdownBackground#1a1a22
- settings.dropdownBorder#363646
- settings.focusedRowBackground#363646
- settings.headerForeground#DCD7BA
- settings.modifiedItemIndicator#9d7665
- sideBar.background#1a1a22
- sideBar.border#2A2A37
- sideBar.foreground#c5c9c5
- sideBarSectionHeader.background#1a1a22
- sideBarSectionHeader.border#2A2A37
- sideBarSectionHeader.foreground#c5c9c5
- sideBarTitle.foreground#c5c9c5
- statusBar.background#16161D
- statusBar.border#2A2A37
- statusBar.debuggingBackground#658594
- statusBar.debuggingBorder#8992a7
- statusBar.debuggingForeground#DCD7BA
- statusBar.focusBorder#658594
- statusBar.foreground#c4b28a
- statusBar.noFolderBackground#1F1F28
- statusBarItem.errorBackground#E46876
- statusBarItem.focusBorder#658594
- statusBarItem.hoverBackground#363646
- statusBarItem.hoverForeground#c5c9c5
- statusBarItem.prominentBackground#658594
- statusBarItem.prominentForeground#DCD7BA
- statusBarItem.remoteBackground#658594
- statusBarItem.remoteForeground#DCD7BA
- statusBarItem.warningBackground#c4b28a
- tab.activeBackground#1F1F28
- tab.activeBorder#1F1F28
- tab.activeBorderTop#658594
- tab.activeForeground#c5c9c5
- tab.activeModifiedBorder#c4b28a
- tab.border#2A2A37
- tab.hoverBackground#1F1F28
- tab.inactiveBackground#16161D
- tab.inactiveForeground#c5c9c5
- tab.inactiveModifiedBorder#c4b28a
- tab.lastPinnedBorder#9e9b93
- tab.selectedBackground#282727
- tab.selectedBorderTop#9CABCA
- tab.selectedForeground#c5c9c5
- tab.unfocusedActiveBorder#1F1F28
- tab.unfocusedActiveBorderTop#2A2A37
- tab.unfocusedActiveModifiedBorder#c4b28a
- tab.unfocusedHoverBackground#1F1F28
- tab.unfocusedInactiveModifiedBorder#c4b28a
- terminal.ansiBlack#393836
- terminal.ansiBlue#435965
- terminal.ansiBrightBlack#625e5a
- terminal.ansiBrightBlue#658594
- terminal.ansiBrightCyan#8ea49e
- terminal.ansiBrightGreen#8a9a7b
- terminal.ansiBrightMagenta#a292a3
- terminal.ansiBrightRed#c4746e
- terminal.ansiBrightWhite#c8c093
- terminal.ansiBrightYellow#c4b28a
- terminal.ansiCyan#8ea49e
- terminal.ansiGreen#699469
- terminal.ansiMagenta#a292a3
- terminal.ansiRed#c4746e
- terminal.ansiWhite#c5c9c5
- terminal.ansiYellow#c4b28a
- terminal.background#1F1F28
- terminal.border#2A2A37
- terminal.foreground#c5c9c5
- terminal.inactiveSelectionBackground#282727
- terminal.selectionBackground#36364680
- terminal.tab.activeBorder#658594
- textBlockQuote.background#2A2A37
- textBlockQuote.border#717C7C
- textCodeBlock.background#2A2A37
- textLink.activeForeground#7FB4CA
- textLink.foreground#7FB4CA
- textPreformat.background#363646
- textPreformat.foreground#c8c093
- textSeparator.foreground#363646
- titleBar.activeBackground#16161D
- titleBar.activeForeground#c5c9c5
- titleBar.border#2A2A37
- titleBar.inactiveBackground#16161D
- titleBar.inactiveForeground#c5c9c5
- walkThrough.embeddedEditorBackground#1F1F28
- welcomePage.progress.foreground#658594
- welcomePage.tileBackground#2A2A37
- widget.border#393836
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #727169 | italic |
| comment.documentation, comment.block.documentation | #717e67 | — |
| invalid.illegal | #C34043 | — |
| keyword.operator | #c4746e | — |
| keyword, storage | #a292a3 | — |
| storage.type, support.type | #957FB8 | — |
| constant.language, support.constant, variable.language | #b6927b | — |
| variable, support.variable | #957FB8 | — |
| entity.name.function, support.function | #E46876 | bold |
| entity.name.type, entity.other.inherited-class, support.class | #957FB8 | bold |
| entity.name.exception | #C34043 | — |
| entity.name.section | — | bold |
| constant.numeric, constant.character, constant | #a292a3 | — |
| string | #8a9a7b | — |
| constant.character.escape | #9e9b93 | — |
| string.regexp, constant.regexp | #c4746e | — |
| constant.other.symbol | #c4746e | — |
| punctuation | #9e9b93 | — |
| meta.tag.sgml.doctype, meta.tag.sgml.doctype string, meta.tag.sgml.doctype entity.name.tag, meta.tag.sgml punctuation.definition.tag.html | #c5c9c5 | — |
| meta.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html | #708e9e | — |
| entity.name.tag | #7E9CD8 | — |
| meta.tag entity.other.attribute-name, entity.other.attribute-name.html | #708e9e | italic |
| constant.character.entity, punctuation.definition.entity | #b6927b | — |
| meta.selector, meta.selector entity, meta.selector entity punctuation, entity.name.tag.css | #957FB8 | — |
| meta.property-name, support.type.property-name | #b6927b | — |
| meta.property-value, meta.property-value constant.other, support.constant.property-value | #8a9a7b | — |
| keyword.other.important | — | bold |
| markup.changed | #c4b28a | — |
| markup.deleted | #c4746e | — |
| markup.error | #C34043 | — |
| markup.inserted | #699469 | — |
| meta.link | #7E9CD8 | — |
| markup.output, markup.raw | #9e9b93 | — |
| markup.prompt | #9e9b93 | — |
| markup.heading | #c4746e | — |
| markup.traceback | #C34043 | — |
| markup.underline | — | underline |
| markup.quote | #a292a3 | — |
| markup.list | #658594 | — |
| markup.bold, markup.italic | #9d7665 | — |
| markup.inline.raw | #699469 | |
| meta.diff.range, meta.diff.index, meta.separator | #625e5a | — |
| meta.diff.header.from-file | #625e5a | — |
| meta.diff.header.to-file | #625e5a | — |