Accessible (AA) Theme
Publisher: phun-kyThemes in package: 2
WCAG AA-friendly syntax highlighting in dark and light variants.
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.background#d8dcdf
- activityBar.border#d8dcdf
- activityBar.foreground#566D71
- activityBar.inactiveForeground#5C6A6A
- activityBarBadge.background#1D699F
- activityBarBadge.foreground#F5F6F7
- badge.background#1D699F
- badge.foreground#F5F6F7
- button.background#1D699F
- button.foreground#F5F6F7
- button.hoverBackground#63abe3
- checkbox.foreground#566D71
- dropdown.background#d8dcdf
- dropdown.border#303445
- dropdown.listBackground#d8dcdf
- editor.background#F5F6F7
- editor.foreground#566D71
- editorBracketHighlight.foreground1#566D71
- editorBracketHighlight.foreground2#5C6A6A
- editorBracketHighlight.foreground3#99acb2
- editorBracketHighlight.foreground4#806200
- editorBracketHighlight.foreground5#1E766D
- editorBracketHighlight.foreground6#1D699F
- editorBracketHighlight.unexpectedBracket.foreground#C92243
- editorBracketMatch.border#1D699F
- editorGroup.border#d8dcdf
- editorGroupHeader.tabsBackground#EDEEEE
- editorHoverWidget.background#d9e4ec
- editorHoverWidget.border#303445
- editorWidget.background#d8dcdf
- editorWidget.border#303445
- focusBorder#1D699F
- gitDecoration.addedResourceForeground#1E766D
- gitDecoration.conflictingResourceForeground#806200
- gitDecoration.deletedResourceForeground#C92243
- gitDecoration.ignoredResourceForeground#5C6A6A
- gitDecoration.modifiedResourceForeground#806200
- gitDecoration.untrackedResourceForeground#1E766D
- input.background#d8dcdf
- input.border#303445
- input.foreground#566D71
- input.placeholderForeground#5C6A6A
- list.activeSelectionBackground#d8dcdf
- list.activeSelectionForeground#303445
- list.focusBackground#303445
- list.focusForeground#F5F6F7
- list.hoverBackground#1d699f22
- list.hoverForeground#303445
- list.inactiveSelectionBackground#d8dcdf
- list.inactiveSelectionForeground#566D71
- notificationCenterHeader.background#F5F6F7
- notifications.background#F5F6F7
- notifications.border#303445
- notifications.foreground#566D71
- panel.background#F5F6F7
- panel.border#303445
- panelTitle.activeBorder#1D699F
- panelTitle.activeForeground#566D71
- panelTitle.inactiveForeground#5C6A6A
- peekView.border#1D699F
- peekViewEditor.background#d8dcdf
- peekViewResult.background#F5F6F7
- progressBar.background#1D699F
- quickInput.background#F5F6F7
- quickInput.foreground#566D71
- quickInputList.focusBackground#d8dcdf
- quickInputList.focusForeground#303445
- scrollbarSlider.activeBackground#5C6A6A88
- scrollbarSlider.background#5C6A6A44
- scrollbarSlider.hoverBackground#5C6A6A66
- selection.background#1D699F22
- sideBar.background#f0f1f3
- sideBar.border#1D699F
- sideBar.foreground#566D71
- sideBarSectionHeader.background#F4F5F5
- sideBarSectionHeader.border#303445
- sideBarSectionHeader.foreground#566D71
- sideBarTitle.foreground#566D71
- statusBar.background#e6e8ea
- statusBar.border#303445
- statusBar.debuggingBackground#806200
- statusBar.debuggingForeground#0D0D0D
- statusBar.foreground#566D71
- statusBar.noFolderBackground#d8dcdf
- statusBar.noFolderForeground#0D0D0D
- statusBarItem.activeBackground#d8dcdf
- statusBarItem.errorBackground#C92243
- statusBarItem.errorForeground#030303
- statusBarItem.hoverBackground#d8dcdf
- statusBarItem.prominentBackground#d8dcdf
- statusBarItem.prominentForeground#0D0D0D
- statusBarItem.prominentHoverBackground#0D0D0D
- statusBarItem.remoteBackground#d8dcdf
- statusBarItem.remoteForeground#0D0D0D
- statusBarItem.warningBackground#806200
- statusBarItem.warningForeground#0D0D0D
- tab.activeBackground#cad1d3
- tab.activeBorderTop#1D699F
- tab.activeForeground#566D71
- tab.border#d8dcdf
- tab.inactiveBackground#d8dcdf
- tab.inactiveForeground#5C6A6A
- terminal.ansiBlack#F5F6F7
- terminal.ansiBlue#1D699F
- terminal.ansiBrightBlack#5C6A6A
- terminal.ansiBrightBlue#1D699F
- terminal.ansiBrightCyan#1E766D
- terminal.ansiBrightGreen#1E766D
- terminal.ansiBrightMagenta#99acb2
- terminal.ansiBrightRed#C92243
- terminal.ansiBrightWhite#FFFFFF
- terminal.ansiBrightYellow#806200
- terminal.ansiCyan#1E766D
- terminal.ansiGreen#1E766D
- terminal.ansiMagenta#DB70B7
- terminal.ansiRed#C92243
- terminal.ansiWhite#566D71
- terminal.ansiYellow#806200
- titleBar.activeBackground#e6e8ea
- titleBar.activeForeground#566D71
- titleBar.border#e6e8ea
- titleBar.inactiveBackground#F5F6F7
- titleBar.inactiveForeground#5C6A6A
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #99acb2 | italic |
| variable, string constant.other.placeholder | #1D699F | — |
| constant.other.color | #1E766D | — |
| invalid, invalid.illegal | #C92243 | bold |
| keyword, storage.type, storage.modifier, keyword.control, keyword.other, keyword.other.unit | #000000 | — |
| storage.type.tsx, storage.type.ts, support.variable.property.ts, keyword.control.flow.ts | #366E96 | — |
| keyword.operator | #806200 | — |
| punctuation, punctuation.separator, punctuation.terminator | #5C6A6A | — |
| punctuation.section.parens.begin, punctuation.section.parens.end | #806200 | — |
| variable.other.constant.ts | #806200 | — |
| support.class.component.tsx | #806200 | — |
| entity.other.attribute-name.tsx | #566D71 | — |
| punctuation.section.block.begin, punctuation.section.block.end | #1D699F | — |
| punctuation.section.brackets.begin, punctuation.section.brackets.end | #1E766D | — |
| meta.tag, punctuation.definition.tag, punctuation.definition.tag.html, punctuation.section.embedded | #5C6A6A | — |
| punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.definition.tag.begin.tsx, punctuation.definition.tag.end.tsx | #566D71 | — |
| meta.jsx.children.tsx | #566D71 | — |
| meta.object-literal.key.tsx | #366E96 | — |
| keyword.other.template, keyword.other.substitution | #1D699F | — |
| entity.name.tag, meta.tag.sgml | #5C6A6A | — |
| markup.deleted, markup.deleted.git_gutter | #C92243 | — |
| entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method | #566D71 | — |
| meta.block variable.other | #1D699F | — |
| support.other.variable, string.other.link | #1E766D | — |
| constant.numeric, constant.language, support.constant, constant.character, constant.escape, constant.language.boolean, constant.language.null | #806200 | — |
| variable.parameter | #1D699F | — |
| string, constant.other.symbol, constant.other.key | #1E766D | — |
| entity.other.inherited-class | #566D71 | italic |
| markup.heading | #1D699F | — |
| entity.name, support.type, support.class, support.type.sys-types | #566D71 | — |
| support.type, entity.name.type.ts | #806200 | — |
| entity.name.type, entity.other.inherited-class.ts | #C92243 | — |
| meta.property.object, variable.other.property, variable.other.object.property | #366E96 | — |
| source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name | #566D71 | italic |
| entity.name.module.js, variable.import.parameter.js, variable.other.class.js | #566D71 | — |
| variable.language | #1D699F | italic |
| meta.definition.function entity.name.function, meta.function entity.name.function, meta.function-call entity.name.function | #566D71 | — |
| meta.method-call entity.name.function, meta.function-call.method entity.name.function, meta.property.member entity.name.function, meta.property.object entity.name.function, meta.property.function entity.name.function, entity.name.method | #1D699F | — |
| meta.property.member variable.other.property, meta.property.object variable.other.property, variable.other.object.property | #566D71 | — |
| entity.other.attribute-name | #1E766D | — |
| entity.other.attribute-name.html, entity.other.attribute-name | #1D699F | italic |
| string.quoted.double.html | #366E96 | — |
| entity.name.tag.html, entity.name.tag.tsx | #1D699F | — |
| entity.other.attribute-name.class | #1E766D | — |
| entity.other.attribute-name.pseudo-element.css | #72c6c0 | — |
| source.sass keyword.control | #1D699F | — |
| markup.inserted | #1E766D | — |
| markup.changed | #1D699F | — |
| string.regexp | #1E766D | — |
| constant.character.escape | #1E766D | — |
| *url*, *link*, *uri* | #1E766D | underline |
| tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js | #566D71 | italic |
| source.js constant.other.object.key.js string.unquoted.label.js | #1D699F | italic |
| source.json meta.structure.dictionary.json support.type.property-name.json, source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json, source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json, source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #1D699F | — |
| text.html.markdown, punctuation.definition.list_item.markdown | #566D71 | — |
| text.html.markdown markup.inline.raw.markdown | #1D699F | — |
| text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown | #5C6A6A | — |
| markdown.heading, markup.heading, markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown | #1D699F | — |
| markup.italic | #566D71 | italic |
| markup.bold, markup.bold string | #566D71 | bold |
| markup.underline | #1D699F | underline |
| markup.quote punctuation.definition.blockquote.markdown | #5C6A6A | — |
| markup.quote | #566D71 | italic |
| string.other.link.title.markdown | #1E766D | — |
| string.other.link.description.title.markdown | #1E766D | — |
| constant.other.reference.link.markdown | #1D699F | — |
| markup.raw.block, markup.raw.block.fenced.markdown, punctuation.definition.fenced.markdown | #5C6A6A | — |
| variable.language.fenced.markdown, punctuation.section.class.end | #566D71 | — |
| meta.separator | #5C6A6A | bold |
| markup.table | #566D71 | — |
| keyword.control | #1D699F | — |