ZeroToSaaS Accessibility Theme Suite
Publisher: ZeroToSaaS.inThemes in package: 20
Medically optimized, WCAG AAA compliant themes with Semantic Cognitive Status (Safe, Caution, Warning, Panic) and contextual file-type adaptation.
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#63A3DE
- activityBar.background#1D232E
- activityBar.border#2B323D
- activityBar.foreground#63A3DE
- activityBar.inactiveForeground#95A0B0
- activityBarBadge.background#63A3DE
- activityBarBadge.foreground#FFFFFF
- badge.background#63A3DE
- badge.foreground#FFFFFF
- breadcrumb.activeSelectionForeground#63A3DE
- breadcrumb.background#0C1119
- breadcrumb.focusForeground#E8ECF1
- breadcrumb.foreground#95A0B0
- button.background#63A3DE
- button.foreground#FFFFFF
- button.hoverBackground#7AB5E8
- button.secondaryBackground#121822
- button.secondaryForeground#E8ECF1
- button.secondaryHoverBackground#1E2530
- chat.avatarBackground#63A3DE
- chat.avatarForeground#FFFFFF
- chat.linesAddedForeground#6BCB7A
- chat.linesRemovedForeground#FF768A
- chat.requestBackground#121822
- chat.requestBorder#2B323D
- chat.slashCommandBackground#63A3DE1A
- chat.slashCommandForeground#63A3DE
- commandCenter.activeBackground#1E2530
- commandCenter.activeBorder#63A3DE
- commandCenter.activeForeground#E8ECF1
- commandCenter.background#121822
- commandCenter.border#2B323D
- commandCenter.foreground#E8ECF1
- commandCenter.inactiveBorder#2B323D
- commandCenter.inactiveForeground#95A0B0
- debugConsole.background#0C1119
- debugConsole.errorForeground#FF768A
- debugConsole.foreground#E8ECF1
- debugConsole.infoForeground#6BCB7A
- debugConsole.sourceForeground#95A0B0
- debugConsole.warningForeground#E89A5A
- debugConsoleInputIcon.foreground#63A3DE
- debugIcon.breakpointCurrentStackframeForeground#E8B85A
- debugIcon.breakpointDisabledForeground#95A0B080
- debugIcon.breakpointForeground#FF768A
- debugIcon.breakpointStackframeForeground#6BCB7A
- debugIcon.breakpointUnverifiedForeground#E89A5A
- debugIcon.continueForeground#6BCB7A
- debugIcon.disconnectForeground#FF768A
- debugIcon.pauseForeground#E8B85A
- debugIcon.restartForeground#6BCB7A
- debugIcon.startForeground#6BCB7A
- debugIcon.stepBackForeground#63A3DE
- debugIcon.stepIntoForeground#63A3DE
- debugIcon.stepOutForeground#63A3DE
- debugIcon.stepOverForeground#63A3DE
- debugIcon.stopForeground#FF768A
- debugTokenExpression.boolean#E8B85A
- debugTokenExpression.error#FF768A
- debugTokenExpression.name#E8ECF1
- debugTokenExpression.number#FD7084
- debugTokenExpression.string#E89A5A
- debugTokenExpression.value#E89A5A
- debugToolBar.background#121822
- debugToolBar.border#2B323D
- debugView.stateLabelForeground#63A3DE
- debugView.valueChangedHighlight#2A2410
- descriptionForeground#95A0B0
- diffEditor.border#2B323D
- diffEditor.insertedTextBackground#0E2A14CC
- diffEditor.removedTextBackground#2A0E12CC
- disabledForeground#95A0B0AA
- dropdown.background#0C1119
- dropdown.border#3D4651
- dropdown.foreground#E8ECF1
- editor.background#0C1119
- editor.findMatchBackground#2A2410
- editor.findMatchBorder#E8B85A
- editor.findMatchHighlightBackground#2A2410CC
- editor.foreground#E8ECF1
- editor.hoverHighlightBackground#121822
- editor.inactiveSelectionBackground#2A4A7A80
- editor.lineHighlightBackground#12182277
- editor.lineHighlightBorder#00000000
- editor.selectionBackground#2A4A7AB3
- editor.selectionHighlightBackground#2A4A7A66
- editor.selectionHighlightBorder#63A3DE4D
- editor.wordHighlightBackground#63A3DE1A
- editor.wordHighlightStrongBackground#63A3DE2E
- editorActionList.background#0C1119
- editorActionList.focusBackground#1E2530
- editorActionList.focusForeground#E8ECF1
- editorActionList.foreground#E8ECF1
- editorAI.background#63A3DE15
- editorAI.border#63A3DE4D
- editorAI.foreground#63A3DE
- editorBracketHighlight.foreground1#63A3DE
- editorBracketHighlight.foreground2#6BCB7A
- editorBracketHighlight.foreground3#E8B85A
- editorBracketHighlight.foreground4#B89BE8
- editorBracketHighlight.foreground5#6BCB7A
- editorBracketHighlight.foreground6#E89A5A
- editorBracketMatch.background#1E2530
- editorBracketMatch.border#63A3DE
- editorCursor.foreground#63A3DE
- editorError.foreground#FF768A
- editorGhostText.background#00000000
- editorGhostText.border#00000000
- editorGhostText.foreground#95A0B0CC
- editorGroup.border#2B323D
- editorGroupHeader.noTabsBackground#0C1119
- editorGroupHeader.tabsBackground#121822
- editorGroupHeader.tabsBorder#2B323D
- editorHint.foreground#6BCB7A
- editorHoverWidget.background#0C1119
- editorHoverWidget.border#3D4651
- editorHoverWidget.foreground#E8ECF1
- editorHoverWidget.statusBarBackground#121822
- editorIndentGuide.activeBackground#63A3DE
- editorIndentGuide.activeBackground1#63A3DE
- editorIndentGuide.activeBackground2#6BCB7A
- editorIndentGuide.activeBackground3#E8B85A
- editorIndentGuide.activeBackground4#B89BE8
- editorIndentGuide.activeBackground5#6BCB7A
- editorIndentGuide.activeBackground6#E89A5A
- editorIndentGuide.background#2B323D
- editorIndentGuide.background1#63A3DE25
- editorIndentGuide.background2#6BCB7A25
- editorIndentGuide.background3#E8B85A25
- editorIndentGuide.background4#B89BE825
- editorIndentGuide.background5#6BCB7A25
- editorIndentGuide.background6#E89A5A25
- editorInfo.foreground#63A3DE
- editorInlayHint.background#1E253099
- editorInlayHint.foreground#95A0B0
- editorInlayHint.parameterForeground#E8B85A
- editorInlayHint.typeForeground#6BCB7A
- editorLineNumber.activeForeground#63A3DE
- editorLineNumber.foreground#95A0B099
- editorLink.activeForeground#63A3DE
- editorStickyScroll.background#121822
- editorStickyScroll.border#2B323D
- editorStickyScroll.shadow#00000044
- editorStickyScrollHover.background#1E2530
- editorSuggestWidget.background#0C1119
- editorSuggestWidget.border#3D4651
- editorSuggestWidget.focusHighlightForeground#63A3DE
- editorSuggestWidget.foreground#E8ECF1
- editorSuggestWidget.highlightForeground#63A3DE
- editorSuggestWidget.selectedBackground#1E2530
- editorSuggestWidget.selectedForeground#E8ECF1
- editorSuggestWidget.selectedIconForeground#63A3DE
- editorWarning.foreground#E89A5A
- editorWidget.background#0C1119
- editorWidget.border#3D4651
- editorWidget.foreground#E8ECF1
- editorWidget.resizeBorder#63A3DE
- errorForeground#FF768A
- focusBorder#63A3DE
- foreground#E8ECF1
- gitDecoration.addedResourceForeground#6BCB7A
- gitDecoration.conflictingResourceForeground#E89A5A
- gitDecoration.deletedResourceForeground#FF768A
- gitDecoration.ignoredResourceForeground#95A0B088
- gitDecoration.modifiedResourceForeground#E8B85A
- gitDecoration.untrackedResourceForeground#6BCB7A
- icon.foreground#E8ECF1
- inlineChat.background#0C1119
- inlineChat.border#3D4651
- inlineChat.regionHighlight#63A3DE1A
- inlineChat.shadow#00000055
- inlineChatDiff.inserted#0E2A14CC
- inlineChatDiff.removed#2A0E12CC
- inlineChatInput.background#121822
- inlineChatInput.border#2B323D
- inlineChatInput.focusBorder#63A3DE
- inlineChatInput.placeholderForeground#95A0B0
- inlineEdit.border#3D4651
- inlineEdit.indicator.background#63A3DE
- inlineEdit.indicator.border#7AB5E8
- inlineEdit.indicator.foreground#FFFFFF
- inlineEdit.modifiedBackground#0E2A1480
- inlineEdit.originalBackground#2A0E1280
- input.background#0C1119
- input.border#3D4651
- input.foreground#E8ECF1
- input.placeholderForeground#95A0B0
- inputOption.activeBorder#63A3DE
- inputValidation.errorBackground#2A0E12
- inputValidation.errorBorder#FF768A
- inputValidation.infoBackground#0E2A14
- inputValidation.infoBorder#6BCB7A
- inputValidation.warningBackground#2A1A0E
- inputValidation.warningBorder#E89A5A
- interactive.activeCodeBorder#63A3DE
- interactive.inactiveCodeBorder#2B323D
- interactive.requestBorder#2B323D
- keybindingLabel.background#121822
- keybindingLabel.border#3D4651
- keybindingLabel.bottomBorder#3D4651
- keybindingLabel.foreground#E8ECF1
- list.activeSelectionBackground#1E2530
- list.activeSelectionForeground#E8ECF1
- list.activeSelectionIconForeground#63A3DE
- list.errorForeground#FF768A
- list.focusBackground#1E2530
- list.focusForeground#E8ECF1
- list.focusHighlightForeground#63A3DE
- list.highlightForeground#63A3DE
- list.hoverBackground#1E253066
- list.hoverForeground#E8ECF1
- list.inactiveFocusBackground#2A4A7A55
- list.inactiveSelectionBackground#2A4A7A77
- list.inactiveSelectionForeground#E8ECF1
- list.inactiveSelectionIconForeground#63A3DE
- list.warningForeground#E89A5A
- menu.background#0C1119
- menu.border#3D4651
- menu.foreground#E8ECF1
- menu.selectionBackground#1E2530
- menu.selectionBorder#63A3DE
- menu.selectionForeground#E8ECF1
- menu.separatorBackground#2B323D
- menubar.selectionBackground#1E2530
- menubar.selectionForeground#E8ECF1
- multiDiffEditor.background#0C1119
- multiDiffEditor.border#2B323D
- multiDiffEditor.headerBackground#121822
- notificationCenter.border#3D4651
- notifications.background#0C1119
- notifications.border#2B323D
- notifications.foreground#E8ECF1
- notificationToast.border#3D4651
- outputView.background#0C1119
- outputViewStickyScroll.background#121822
- panel.background#171D27
- panel.border#2B323D
- panelSection.border#2B323D
- panelSection.dropBackground#1E2530
- panelSectionHeader.background#121822
- panelSectionHeader.border#2B323D
- panelSectionHeader.foreground#E8ECF1
- panelTitle.activeBorder#63A3DE
- panelTitle.activeForeground#E8ECF1
- panelTitle.inactiveForeground#95A0B0
- peekView.border#63A3DE
- peekViewEditor.background#121822
- peekViewEditor.matchHighlightBackground#2A2410
- peekViewResult.background#171D27
- peekViewResult.matchHighlightBackground#2A2410
- peekViewResult.selectionBackground#1E2530
- peekViewTitle.background#121822
- problemsErrorIcon.foreground#FF768A
- problemsInfoIcon.foreground#63A3DE
- problemsWarningIcon.foreground#E89A5A
- quickInput.background#0C1119
- quickInput.foreground#E8ECF1
- quickInputList.focusBackground#1E2530
- searchEditor.findMatchBackground#2A2410
- searchEditor.findMatchBorder#E8B85A
- selection.background#1E2530
- settings.focusedRowBackground#1E253050
- settings.headerForeground#63A3DE
- settings.modifiedItemIndicator#63A3DE
- settings.rowHoverBackground#1E253025
- sideBar.background#171D27
- sideBar.border#2B323D
- sideBar.foreground#E8ECF1
- sideBarSectionHeader.background#121822
- sideBarSectionHeader.border#2B323D
- sideBarSectionHeader.foreground#E8ECF1
- sideBarTitle.foreground#63A3DE
- statusBar.background#0B4F9C
- statusBar.border#0B4F9C
- statusBar.debuggingBackground#2A1A0E
- statusBar.debuggingForeground#E89A5A
- statusBar.foreground#FFFFFF
- statusBar.noFolderBackground#0B4F9C
- statusBar.noFolderForeground#FFFFFF
- statusBarItem.hoverBackground#FFFFFF25
- statusBarItem.remoteBackground#00000030
- statusBarItem.remoteForeground#FFFFFF
- symbolIcon.arrayForeground#E8ECF1
- symbolIcon.booleanForeground#FD7084
- symbolIcon.classForeground#6BCB7A
- symbolIcon.colorForeground#FD7084
- symbolIcon.constantForeground#E8B85A
- symbolIcon.eventForeground#B89BE8
- symbolIcon.fieldForeground#E8ECF1
- symbolIcon.fileForeground#E8ECF1
- symbolIcon.folderForeground#63A3DE
- symbolIcon.functionForeground#B89BE8
- symbolIcon.interfaceForeground#6BCB7A
- symbolIcon.keyForeground#63A3DE
- symbolIcon.keywordForeground#63A3DE
- symbolIcon.methodForeground#B89BE8
- symbolIcon.moduleForeground#63A3DE
- symbolIcon.nullForeground#E8B85A
- symbolIcon.numberForeground#FD7084
- symbolIcon.objectForeground#6BCB7A
- symbolIcon.operatorForeground#E8ECF1
- symbolIcon.packageForeground#63A3DE
- symbolIcon.propertyForeground#E8ECF1
- symbolIcon.snippetForeground#63A3DE
- symbolIcon.stringForeground#E89A5A
- symbolIcon.structForeground#6BCB7A
- symbolIcon.textForeground#E8ECF1
- symbolIcon.typeParameterForeground#6BCB7A
- symbolIcon.unitForeground#E8B85A
- symbolIcon.variableForeground#E8ECF1
- tab.activeBackground#0C1119
- tab.activeBorder#63A3DE
- tab.activeBorderTop#63A3DE
- tab.activeForeground#E8ECF1
- tab.border#2B323D
- tab.hoverBackground#0C1119
- tab.hoverForeground#E8ECF1
- tab.inactiveBackground#121822
- tab.inactiveForeground#95A0B0
- tab.unfocusedActiveBackground#0C1119
- tab.unfocusedActiveForeground#E8ECF1
- tab.unfocusedInactiveForeground#95A0B0
- terminal.ansiBlack#121822
- terminal.ansiBlue#63A3DE
- terminal.ansiBrightBlack#171D27
- terminal.ansiBrightBlue#7AB5E8
- terminal.ansiBrightCyan#6BCB7A
- terminal.ansiBrightGreen#6BCB7A
- terminal.ansiBrightMagenta#B89BE8
- terminal.ansiBrightRed#FF768A
- terminal.ansiBrightWhite#FFFFFF
- terminal.ansiBrightYellow#E8B85A
- terminal.ansiCyan#6BCB7A
- terminal.ansiGreen#6BCB7A
- terminal.ansiMagenta#B89BE8
- terminal.ansiRed#FF768A
- terminal.ansiWhite#E8ECF1
- terminal.ansiYellow#E8B85A
- terminal.background#0C1119
- terminal.border#2B323D
- terminal.findMatchBackground#2A2410
- terminal.findMatchBorder#E8B85A
- terminal.findMatchHighlightBackground#2A2410CC
- terminal.foreground#E8ECF1
- terminal.hoverHighlightBackground#121822
- terminal.inactiveSelectionBackground#2A4A7A55
- terminal.selectionBackground#2A4A7AB3
- terminal.tab.activeBorder#63A3DE
- terminalCommandDecoration.defaultBackground#63A3DE80
- terminalCommandDecoration.errorBackground#FF768A
- terminalCommandDecoration.successBackground#6BCB7A
- terminalCursor.background#0C1119
- terminalCursor.foreground#63A3DE
- terminalOverviewRuler.cursorForeground#63A3DE
- terminalOverviewRuler.findMatchForeground#E8B85A
- titleBar.activeBackground#171D27
- titleBar.activeForeground#E8ECF1
- titleBar.border#2B323D
- titleBar.inactiveBackground#121822
- titleBar.inactiveForeground#95A0B0
- walkThrough.embeddedEditorBackground#121822
- welcomePage.background#0C1119
- welcomePage.buttonBackground#121822
- welcomePage.buttonHoverBackground#1E2530
- widget.shadow#00000066
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, comment.line, comment.line.double-slash, comment.line.triple-slash, comment.line.number-sign, comment.line.dashes, comment.line.character, comment.line.percentage, comment.block, comment.block.documentation, punctuation.definition.comment, string.comment, string.quoted.docstring, string.quoted.docstring.multi, string.quoted.docstring.multi.python, string.quoted.docstring.single.python, string.quoted.double.block.python, string.quoted.single.block.python, source.kotlin comment, source.kotlin comment.line, source.kotlin comment.block, source.kotlin comment.block.documentation, source.swift comment, source.go comment, source.rust comment, source.dart comment, source.java comment, source.ts comment, source.tsx comment, source.js comment, source.jsx comment, source.python comment, source.sql comment, source.shell comment, source.yaml comment | #95A0B0 | italic |
| keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical, keyword.operator.delete, storage, storage.type, storage.modifier | #63A3DE | bold |
| entity.name.function, support.function, meta.function-call, variable.function | #B89BE8 | — |
| entity.name.type, entity.name.class, entity.name.struct, entity.name.enum, entity.name.interface, support.class, support.type, entity.other.inherited-class | #6BCB7A | bold |
| constant, constant.language, constant.numeric, support.constant | #E8B85A | — |
| variable, variable.other, variable.other.readwrite, variable.other.property | #E8ECF1 | — |
| keyword.operator, punctuation, punctuation.accessor, punctuation.separator | #E8ECF1 | — |
| invalid, invalid.illegal, invalid.deprecated | #FF768A | bold underline |
| constant.other.color, constant.other.color.rgb-value, constant.other.uuid, support.constant.color, keyword.other.dotenv, source.env variable.other.key, source.dotenv variable.other.key | #FF768A | — |
| string.regexp, string.regexp constant.character.escape, constant.other.character-class.regexp | #FF768A | — |
| source.python string.quoted, source.js string.quoted, source.jsx string.quoted, source.ts string.quoted, source.tsx string.quoted, source.rust string.quoted, source.go string.quoted, source.kotlin string.quoted, source.swift string.quoted, source.dart string.quoted, source.sql string.quoted | #E89A5A | — |
| source.js string.template, source.ts string.template, source.tsx string.template, source.python string.interpolated | #E89A5A | — |
| source.python variable.parameter, source.js variable.parameter, source.jsx variable.parameter, source.ts variable.parameter, source.tsx variable.parameter, source.rust variable.parameter, source.go variable.parameter, source.kotlin variable.parameter, source.swift variable.parameter, source.dart variable.parameter | #E8B85A | — |
| source.ts entity.name.type, source.tsx entity.name.type, source.rust entity.name.type, source.go entity.name.type, source.kotlin entity.name.type, source.swift entity.name.type, source.dart entity.name.type, source.python entity.name.type.class | #6BCB7A | bold |
| source.python entity.name.function.decorator, source.python variable.language.special.self, source.python variable.language.special.cls | #7AB5E8 | italic |
| source.python support.function.magic | #B89BE8 | bold |
| source.jsx entity.name.tag, source.tsx entity.name.tag, source.jsx support.class.component, source.tsx support.class.component | #6BCB7A | bold |
| source.jsx entity.other.attribute-name, source.tsx entity.other.attribute-name | #E8B85A | — |
| source.sql keyword.other.DML, source.sql keyword.other.DDL, source.sql keyword.other.order, source.sql keyword.other.create | #63A3DE | bold |
| source.sql constant.other.database-name, source.sql constant.other.table-name | #6BCB7A | — |
| source.rust storage.modifier.lifetime, source.rust entity.name.function.macro | #B89BE8 | bold |
| source.go entity.name.package, source.go keyword.channel | #63A3DE | bold |
| source.kotlin storage.type.annotation, source.swift storage.type.annotation, source.swift keyword.other.declaration-specifier | #B89BE8 | — |
| source.dart storage.type.annotation, source.dart support.class.flutter | #6BCB7A | bold |
| source.json support.type.property-name | #6BCB7A | bold |
| source.yaml entity.name.tag | #6BCB7A | bold |
| source.toml entity.other.attribute-name.table, source.toml keyword.key | #6BCB7A | bold |
| source.ini entity.name.section, source.ini keyword.other.definition | #6BCB7A | bold |
| source.env variable.other.key, source.dotenv variable.other.key, source.env keyword.other | #FF768A | bold |
| text.html.markdown, text.plain, meta.paragraph.markdown | #E8ECF1 | — |
| text.html.markdown markup.heading, text.html.markdown entity.name.section, text.html.markdown punctuation.definition.heading | #63A3DE | bold |
| text.html.markdown markup.inline.raw, text.html.markdown markup.fenced_code | #6BCB7A | — |
| text.html.markdown markup.underline.link, text.html.markdown string.other.link | #63A3DE | underline |
| text.html.markdown markup.quote | #95A0B0 | italic |
| text.html entity.name.tag, text.xml entity.name.tag | #63A3DE | bold |
| text.html entity.other.attribute-name, text.xml entity.other.attribute-name | #B89BE8 | — |
| log.error, log.fatal, log.critical, log.exception | #FF768A | bold |
| log.warning, log.warn | #E89A5A | bold |
| log.info, log.notice | #6BCB7A | bold |
| log.debug, log.trace | #E8B85A | — |
| log.date, log.timestamp | #95A0B0 | — |