Kawa

Color themes

• 

  Kawa Dark

• 

  Kawa Light

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.background#191017
• activityBar.foreground#fafafa
• activityBar.inactiveForeground#a9a9b1
• activityBarBadge.background#f9b1dc
• badge.background#f9b1dc
• badge.foreground#18181b
• button.background#f9b1dc
• button.hoverBackground#432b40
• button.secondaryBackground#2c1f2d
• button.secondaryForeground#fafafa
• button.secondaryHoverBackground#432b40
• commandCenter.border#2c1f2d
• debugToolBar.background#2c1f2d
• descriptionForeground#a9a9b1
• dropdown.background#2c1f2d
• dropdown.border#2c1f2d
• editor.background#191017
• editor.findMatchBackground#f9b1dc
• editor.foreground#fafafa
• editor.lineHighlightBackground#432b40
• editor.selectionBackground#432b40
• editor.wordHighlightBackground#432b40
• editor.wordHighlightStrongBackground#5a3150
• editorBracketHighlight.foreground1#f9b1dc
• editorBracketHighlight.foreground2#f4ba9f
• editorBracketHighlight.foreground3#c9b0d9
• editorBracketHighlight.foreground4#d69a5d
• editorBracketHighlight.foreground5#7da889
• editorBracketHighlight.foreground6#a9a9b1
• editorBracketMatch.background#432b40
• editorBracketMatch.border#f9b1dc
• editorCodeLens.foreground#a9a9b1
• editorCursor.foreground#f9b1dc
• editorError.border#b42318
• editorError.foreground#b42318
• editorGroup.border#2c1f2d
• editorGroup.dropBackground#432b40
• editorGroupHeader.border#2c1f2d
• editorGroupHeader.noTabsBackground#191017
• editorGroupHeader.tabsBackground#191017
• editorGroupHeader.tabsBorder#2c1f2d
• editorGroupHeader.tabsForeground#fafafa
• editorGutter.addedBackground#7da889
• editorGutter.background#191017
• editorGutter.deletedBackground#b42318
• editorGutter.modifiedBackground#f9b1dc
• editorHoverWidget.background#2c1f2d
• editorHoverWidget.border#2c1f2d
• editorHoverWidget.foreground#fafafa
• editorIndentGuide.activeBackground1#f9b1dc
• editorIndentGuide.background1#2c1f2d
• editorInfo.border#a9a9b1
• editorInfo.foreground#a9a9b1
• editorLineNumber.activeForeground#fafafa
• editorLineNumber.foreground#a9a9b1
• editorMarkerNavigation.background#2c1f2d
• editorMarkerNavigationError.background#b42318
• editorMarkerNavigationInfo.background#a9a9b1
• editorMarkerNavigationWarning.background#d69a5d
• editorOverviewRuler.addedForeground#7da889
• editorOverviewRuler.border#2c1f2d
• editorOverviewRuler.bracketMatchForeground#f9b1dc
• editorOverviewRuler.commonContentForeground#fafafa
• editorOverviewRuler.currentContentForeground#fafafa
• editorOverviewRuler.deletedForeground#b42318
• editorOverviewRuler.errorForeground#b42318
• editorOverviewRuler.incomingContentForeground#fafafa
• editorOverviewRuler.infoForeground#a9a9b1
• editorOverviewRuler.modifiedForeground#f9b1dc
• editorOverviewRuler.warningForeground#d69a5d
• editorPane.background#191017
• editorRuler.foreground#2c1f2d
• editorStickyScroll.background#2c1f2d
• editorStickyScrollHover.background#432b40
• editorSuggestWidget.background#2c1f2d
• editorSuggestWidget.foreground#fafafa
• editorSuggestWidget.highlightForeground#f9b1dc
• editorSuggestWidget.selectedBackground#432b40
• editorWarning.border#d69a5d
• editorWarning.foreground#d69a5d
• editorWhitespace.foreground#a9a9b1
• editorWidget.background#2c1f2d
• editorWidget.border#2c1f2d
• editorWidget.foreground#fafafa
• extensionButton.prominentHoverBackground#432b40
• focusBorder#2c1f2d
• gitDecoration.addedResourceForeground#7da889
• gitDecoration.deletedResourceForeground#b42318
• gitDecoration.modifiedResourceForeground#d69a5d
• gitDecoration.untrackedResourceForeground#f9b1dc
• input.background#2c1f2d
• input.border#2c1f2d
• input.foreground#fafafa
• input.placeholderForeground#a9a9b1
• inputOption.activeBorder#f9b1dc
• inputOption.hoverBackground#432b40
• inputValidation.errorBackground#b42318
• inputValidation.errorBorder#b42318
• inputValidation.infoBackground#a9a9b1
• inputValidation.infoBorder#a9a9b1
• inputValidation.warningBackground#d69a5d
• inputValidation.warningBorder#d69a5d
• list.activeSelectionBackground#5a3150
• list.activeSelectionForeground#fafafa
• list.activeSelectionIconForeground#f9b1dc
• list.deemphasizedForeground#a9a9b1
• list.foreground#fafafa
• list.hoverBackground#432b40
• list.inactiveSelectionBackground#432b40
• list.inactiveSelectionForeground#fafafa
• menu.background#2c1f2d
• menu.border#2c1f2d
• menu.foreground#fafafa
• menu.selectionBackground#432b40
• menu.selectionForeground#fafafa
• notificationCenter.border#2c1f2d
• notificationCenterHeader.background#191017
• notificationLink.foreground#f9b1dc
• notifications.background#191017
• notifications.border#2c1f2d
• notifications.foreground#fafafa
• notificationToast.border#2c1f2d
• panel.background#191017
• panel.border#2c1f2d
• panelInput.border#2c1f2d
• panelSectionHeader.background#2c1f2d
• panelTitle.activeForeground#fafafa
• panelTitle.inactiveForeground#a9a9b1
• peekView.border#2c1f2d
• peekViewEditor.background#2c1f2d
• peekViewEditor.matchHighlightBackground#432b40
• peekViewResult.background#2c1f2d
• peekViewTitle.background#2c1f2d
• progressBar.background#f9b1dc
• quickInput.background#191017
• quickInput.foreground#fafafa
• quickInputList.focusBackground#432b40
• quickInputTitle.background#2c1f2d
• sideBar.background#191017
• sideBar.border#2c1f2d
• sideBar.foreground#fafafa
• sideBarSectionHeader.foreground#a9a9b1
• statusBar.background#191017
• statusBar.foreground#fafafa
• statusBarItem.hoverBackground#432b40
• tab.activeBackground#191017
• tab.activeForeground#fafafa
• tab.border#2c1f2d
• tab.inactiveBackground#191017
• tab.inactiveForeground#fafafa
• tab.unfocusedInactiveForeground#a9a9b1
• terminal.ansiBlack#191017
• terminal.ansiBlue#a9a9b1
• terminal.ansiBrightBlack#a9a9b1
• terminal.ansiBrightBlue#a9a9b1
• terminal.ansiBrightMagenta#f9b1dc
• terminal.ansiBrightRed#b42318
• terminal.ansiBrightWhite#fafafa
• terminal.ansiBrightYellow#d69a5d
• terminal.ansiMagenta#f9b1dc
• terminal.ansiRed#b42318
• terminal.ansiWhite#fafafa
• terminal.ansiYellow#d69a5d
• terminal.background#191017
• terminal.foreground#fafafa
• textLink.activeForeground#f9b1dc
• textLink.foreground#f9b1dc
• titleBar.activeBackground#191017
• titleBar.activeForeground#fafafa
• titleBar.inactiveBackground#191017
• titleBar.inactiveForeground#fafafa
• toolbar.hoverBackground#432b40
• welcomePage.progress.background#f9b1dc
• welcomePage.tileBackground#2c1f2d
• welcomePage.tileHoverBackground#432b40

tokenColors

TextMate scopes and font styles (syntax highlighting rules).