Kite Theme WCAG
Publisher: ZhouscarThemes in package: 3
Kite Theme but with higher contrast.
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.activeBorder#0A7AFA
- activityBar.background#22282F
- activityBar.border#2D353E
- activityBar.foreground#C7CED6
- activityBar.inactiveForeground#586779
- activityBarBadge.background#0A7AFA
- activityBarBadge.foreground#E4E8EC
- badge.background#606871
- badge.foreground#E6E8EA
- breadcrumb.background#24282E
- breadcrumb.focusForeground#C9CED4
- breadcrumb.foreground#ACB4BE
- button.background#0956AE
- button.foreground#E4E8EC
- button.hoverBackground#0A7AFA
- button.secondaryBackground#464E59
- button.secondaryForeground#C7CED6
- button.secondaryHoverBackground#5C6875
- debugToolBar.background#31353A
- debugToolBar.border#494f5536
- diffEditor.border#494F55
- diffEditor.insertedTextBackground#61AF5534
- diffEditor.removedTextBackground#FA3A0A34
- dropdown.background#26292C
- dropdown.border#464E5970
- dropdown.foreground#CBCED2
- editor.background#22282F
- editor.findMatchBackground#E4E8EC2B
- editor.findMatchHighlightBackground#A3702E
- editor.foldBackground#0462CD16
- editor.foreground#C7CED6
- editor.hoverHighlightBackground#424E5C
- editor.inactiveSelectionBackground#6E819626
- editor.lineHighlightBackground#424e5c80
- editor.rangeHighlightBackground#424E5C
- editor.selectionBackground#6E819642
- editor.selectionHighlightBackground#C7CED62A
- editor.selectionHighlightBorder#586779
- editor.wordHighlightBackground#494F55
- editor.wordHighlightStrongBackground#183454
- editorBracketHighlight.foreground1#6EB0FC
- editorBracketHighlight.foreground2#FCC16E
- editorBracketHighlight.foreground3#7B6FFC
- editorBracketHighlight.foreground4#6ECDFC
- editorBracketHighlight.foreground5#FCAC6E
- editorBracketHighlight.foreground6#CD6EFC
- editorBracketHighlight.unexpectedBracket.foreground#FC736E
- editorBracketMatch.background#0A7AFA20
- editorBracketMatch.border#6E8196
- editorCodeLens.foreground#6E8196
- editorCursor.background#26292C
- editorCursor.foreground#AFB5BB
- editorError.foreground#FA3A0A
- editorGroup.border#494F55
- editorGroupHeader.tabsBackground#24282E
- editorGroupHeader.tabsBorder#464E5970
- editorGutter.addedBackground#1B770D
- editorGutter.background#22282F
- editorGutter.deletedBackground#AE2A09
- editorGutter.foldingControlForeground#A9B4C1
- editorGutter.modifiedBackground#0956AE
- editorHoverWidget.background#24282E
- editorHoverWidget.border#464e59bb
- editorHoverWidget.foreground#ACB4BE
- editorIndentGuide.activeBackground#586779
- editorIndentGuide.background#38424D
- editorInfo.foreground#4696F1
- editorLineNumber.activeForeground#C7CED6
- editorLineNumber.foreground#586779
- editorLink.activeForeground#0ABAFA
- editorMarkerNavigation.background#26292C
- editorMarkerNavigationError.background#F16846
- editorMarkerNavigationInfo.background#6EB0FC
- editorMarkerNavigationWarning.background#C8A73C
- editorOverviewRuler.background#22282F
- editorOverviewRuler.border#60687180
- editorRuler.foreground#424E5C
- editorSuggestWidget.background#24282E
- editorSuggestWidget.border#464E59
- editorSuggestWidget.foreground#C9CED4
- editorSuggestWidget.highlightForeground#3C95FB
- editorSuggestWidget.selectedBackground#183454
- editorWarning.foreground#F1A746
- editorWhitespace.foreground#6E819626
- editorWidget.background#24282E
- editorWidget.foreground#C7CED6
- editorWidget.resizeBorder#8CB2DE
- focusBorder#0A7AFA
- foreground#C7CED6
- gitDecoration.addedResourceForeground#64D38D
- gitDecoration.conflictingResourceForeground#7664D3
- gitDecoration.deletedResourceForeground#D36464
- gitDecoration.ignoredResourceForeground#949BA4
- gitDecoration.modifiedResourceForeground#D3B264
- gitDecoration.stageDeletedResourceForeground#C83C3C
- gitDecoration.stageModifiedResourceForeground#E6BF84
- gitDecoration.submoduleResourceForeground#6498D3
- gitDecoration.untrackedResourceForeground#7BE09D
- icon.foreground#C7CED6
- input.background#26292C
- input.foreground#CBCED2
- input.placeholderForeground#AFB5BB
- inputOption.activeBackground#0A7AFA66
- inputOption.activeBorder#f50c0c00
- inputOption.activeForeground#E6E8EA
- list.activeSelectionBackground#073264
- list.activeSelectionForeground#E4E8EC
- list.dropBackground#464E59
- list.focusBackground#183454
- list.highlightForeground#0A7AFA
- list.hoverBackground#24282E
- list.hoverForeground#E4E8EC
- list.inactiveSelectionBackground#24282E
- list.inactiveSelectionForeground#E4E8EC
- listFilterWidget.background#424E5C
- listFilterWidget.noMatchesOutline#FA3A0A
- menu.background#24282E
- menu.border#464E5970
- menu.foreground#C9CED4
- menu.selectionBackground#034A9B
- menu.selectionForeground#E5E8EB
- menu.separatorBackground#464E59
- menubar.selectionBackground#5C6875
- menubar.selectionForeground#E5E8EB
- merge.commonContentBackground#26292C
- merge.commonHeaderBackground#494F55
- notificationCenter.border#494F552A
- notificationCenterHeader.background#333538
- notificationCenterHeader.foreground#AFB5BB
- notifications.background#26292C
- notifications.border#494F552A
- notifications.foreground#CBCED2
- notificationsErrorIcon.foreground#C8433C
- notificationsInfoIcon.foreground#3CA3C8
- notificationsWarningIcon.foreground#C8BF3C
- notificationToast.border#494F552A
- panel.background#24282E
- panel.border#464E59
- panelTitle.activeBorder#0A7AFA
- panelTitle.activeForeground#E6E8EA
- panelTitle.inactiveForeground#CBCED2CC
- peekView.border#0A7AFA
- peekViewEditor.background#223449
- peekViewEditor.matchHighlightBackground#c88b3c69
- peekViewEditorGutter.background#223449
- peekViewResult.background#1A2837
- peekViewResult.lineForeground#8C9AAB
- peekViewResult.matchHighlightBackground#C88D3C4F
- peekViewResult.selectionBackground#183454
- peekViewResult.selectionForeground#E4E8EC
- peekViewTitleLabel.foreground#E4E8EC
- pickerGroup.border#464E59
- pickerGroup.foreground#3C95FB
- progressBar.background#0A7AFA
- scrollbar.shadow#22282F
- scrollbarSlider.activeBackground#7381919B
- scrollbarSlider.background#464E599B
- scrollbarSlider.hoverBackground#5C68759B
- selection.background#6E8196
- sideBar.background#22282F
- sideBar.border#2D353E
- sideBar.foreground#C7CED6
- sideBarSectionHeader.background#2D353E
- sideBarTitle.foreground#ACB4BE
- statusBar.background#24282E
- statusBar.debuggingBackground#C88B3C
- statusBar.debuggingForeground#24282E
- statusBar.foreground#ACB4BE
- statusBar.noFolderBackground#61237B
- statusBar.noFolderForeground#C9CED4
- statusBarItem.hoverBackground#464E59BB
- statusBarItem.remoteBackground#034A9B
- statusBarItem.remoteForeground#E5E8EB
- tab.activeBackground#22282F
- tab.activeBorder#0A7AFA
- tab.activeForeground#E4E8EC
- tab.border#22282F
- tab.hoverBackground#424E5C
- tab.hoverForeground#C7CED6
- tab.inactiveBackground#24282E
- tab.inactiveForeground#A9B4C1
- terminal.ansiBlack#000913
- terminal.ansiBlue#3C7dC8
- terminal.ansiBrightBlack#606871
- terminal.ansiBrightBlue#5097E7
- terminal.ansiBrightCyan#46C3F1
- terminal.ansiBrightGreen#53EC3C
- terminal.ansiBrightMagenta#D165FF
- terminal.ansiBrightRed#F14F46
- terminal.ansiBrightWhite#E6E8EA
- terminal.ansiBrightYellow#f1E646
- terminal.ansiCyan#3CA3C8
- terminal.ansiGreen#4FC83C
- terminal.ansiMagenta#9E3CC8
- terminal.ansiRed#C8433C
- terminal.ansiWhite#CBCED2
- terminal.ansiYellow#C8BF3C
- terminal.border#464E59
- terminal.foreground#CBCED2
- terminal.selectionBackground#78818C80
- terminalCursor.background#0462CD
- terminalCursor.foreground#E6E8EA
- textLink.foreground#3C95FB
- titleBar.activeBackground#24282EBB
- titleBar.activeForeground#ACB4BE
- titleBar.inactiveBackground#24282E
- titleBar.inactiveForeground#ACB4bECC
- tree.indentGuidesStroke#464E59
- widget.shadow#424e5c36
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment, string.comment | #7c8fa5 | italic |
| punctuation | #a9b4c1 | — |
| punctuation.decorator, meta.brace.round | #c7ced6 | — |
| punctuation.terminator.statement | #8c9aab | — |
| punctuation.accessor.optional | #ac71f1 | — |
| punctuation.definition.constant | #6eb0fc | — |
| punctuation.section.embedded | #c87ded | — |
| string, punctuation.definition.string | #edd37d | — |
| constant.numeric, keyword.other.unit | #edb97d | — |
| constant.language, entity.name.tag, keyword, keyword.operator, storage.modifier, storage.type, support.type.primitive | #fc6e86 | — |
| variable.language, fenced_code.block.language | #a9b4c1 | italic |
| variable.parameter, entity.name.variable.parameter, parameter.variable | #c7ced6 | italic |
| meta.function, meta.function-call, meta.definition.function, meta.definition.method, meta.method.declaration, entity.name.function, entity.other.attribute-name, support.function, function.support.builtin, function.support.core, punctuation.definition.entity | #91e684 | — |
| constant.language.boolean.true | #7fe255 | bold |
| constant.language.boolean.false | #ee5e55 | bold |
| constant.language.null | — | bold |
| support.variable.property | #a9b4c1 | — |
| meta.property-value | #eef4fc | — |
| constant.character, constant.other, support.constant | #6eb0fc | — |
| meta.definition.variable, meta.parameters, meta.method.declaration, meta.object.member, variable.other.constant, variable.other.object, entity.name.variable.local | #6eb0fc | — |
| entity.name.class, entity.name.type, entity.name.class.declaration, entity.name.type.class, entity.other.inherited-class | #c87ded | — |
| meta.block, meta.class, meta.var.expr, meta.template.expression, meta.function-call.arguments, meta.definition.property, meta.field.declaration, meta.tag.without-attributes, meta.children, entity.name.type.namespace, entity.name.variable, entity.name.section, variable.object.property, variable.other.assignment, variable.other.object.property, variable.other.constant.property, variable.other.readwrite.alias | #c7ced6 | — |
| punctuation.definition.variable, punctuation.support.type.property-name, storage.modifier.lifetime, variable.other.property, variable.other.jsdoc | #c7ced6 | — |
| meta.object-literal.key, support.type.property-name | #c7ced6 | — |
| meta.return.type, meta.field.declaration, meta.interface, support.type, support.type.primitive, support.type.property-name, punctuation.support.type.property-name | #7dc8ed | — |
| entity.other.attribute-name.pseudo-class | — | italic |
| markup.underline.link | #7ddbed | — |
| markup.bold | #dfdfe0 | bold |
| markup.italic | #dfdfe0 | italic |
| case-clause.expr, switch-block.expr, switch-statement.expr | #41a1c0 | — |
| token.info-token | #6498d3 | — |
| token.warn-token | #d3b264 | — |
| token.error-token | #db6b6b | — |
| token.debug-token | #917cef | — |
| fenced_code.block.language, punctuation.definition.bold.markdown, punctuation.definition.heading.markdown, punctuation.definition.italic.markdown, punctuation.definition.markdown, punctuation.definition.metadata.markdown, punctuation.definition.raw.markdown, punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown | #6eb0fc | — |
| punctuation.definition.list.begin.markdown, punctuation.definition.quote.begin.markdown | #7dc8ed | — |
| markup.quote.markdown | #edb97d | — |
| storage.type.cs, entity.name.type.cs | #897ff0 | — |
| keyword.type.cs | #7dc8ed | — |
| variable.css, variable.scss, variable.less, variable.sass | #6eb0fc | — |
| support.class.dart, other.source.dart | #fc6e86 | — |
| punctuation.definition.variable.php, variable.other | #c7ced6 | — |
| meta.class.kotlin | #c87ded | — |
| support.class.kotlin | #7dc8ed | — |
| variable.other.readwrite.instance.ruby, punctuation.definition.variable.ruby | #6eb0fc | — |
| constant.other.symbol.hashkey.ruby, constant.other.symbol.ruby, punctuation.definition.constant.ruby | #7dc8ed | — |
| meta.function.method.with-arguments.ruby | #c7ced6 | — |
| entity.name.type.class.std.rust | #897ff0 | — |
| entity.name.type.rust, entity.name.type.numeric.rust | #6eb0fc | — |
| meta.indexed-name.python | #91e684 | — |