Modus
Publisher: wroycaThemes in package: 16
Accessible themes conforming to the highest standard for color contrast (WCAG AAA).
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#303030
- activityBar.foreground#ffffff
- activityBar.inactiveForeground#989898
- activityBarBadge.background#1640b0
- activityBarBadge.foreground#ffffff
- activityErrorBadge.background#9d1f1f
- activityErrorBadge.foreground#ffffff
- activityWarningBadge.background#7a6100
- activityWarningBadge.foreground#ffffff
- badge.background#1640b0
- badge.foreground#ffffff
- breadcrumb.activeSelectionForeground#ffffff
- breadcrumb.focusForeground#ffffff
- breadcrumb.foreground#989898
- breadcrumbPicker.background#1e1e1e
- button.background#535353
- button.foreground#ffffff
- button.hoverBackground#45605e
- button.secondaryHoverBackground#654a39
- button.separator#646464
- chat.avatarBackground#303030
- chat.avatarForeground#ffffff
- chat.editedFileForeground#79a8ff
- chat.linesAddedForeground#a0e0a0
- chat.linesRemovedForeground#ffbfbf
- chat.requestBackground#1e1e1e
- chat.requestBorder#646464
- chat.slashCommandBackground#12154a
- chat.slashCommandForeground#00bcff
- checkbox.background#303030
- commandCenter.background#1e1e1e
- commandCenter.border#646464
- debugToolBar.background#1e1e1e
- diffEditor.border#646464
- diffEditor.diagonalFill#1a1a1a
- diffEditor.insertedLineBackground#00291026
- diffEditor.insertedTextBackground#034f2f4d
- diffEditor.removedLineBackground#380a0f26
- diffEditor.removedTextBackground#781a1f4d
- diffEditor.unchangedCodeBackground#1a1a1a
- diffEditor.unchangedRegionBackground#1e1e1e
- diffEditor.unchangedRegionForeground#989898
- diffEditor.unchangedRegionShadow#1e1e1e
- diffEditorOverview.insertedForeground#237f3f
- diffEditorOverview.removedForeground#b81a1f
- disabledForeground#989898
- dropdown.background#303030
- editor.background#000000
- editor.findMatchBackground#7a6100
- editor.findMatchHighlightBackground#2266ae
- editor.findRangeHighlightBackground#2266ae4d
- editor.foreground#ffffff
- editor.inactiveSelectionBackground#5a5a5a73
- editor.lineHighlightBackground#2f3849
- editor.selectionBackground#5a5a5aa6
- editor.selectionForeground#000000
- editor.selectionHighlightBackground#45605e4d
- editor.wordHighlightBackground#45605e66
- editor.wordHighlightStrongBackground#654a3966
- editor.wordHighlightTextBackground#45605e4d
- editorBracketHighlight.foreground1#ff66ff
- editorBracketHighlight.foreground2#00eff0
- editorBracketHighlight.foreground3#ff6b55
- editorBracketHighlight.foreground4#efef00
- editorBracketHighlight.foreground5#b6a0ff
- editorBracketHighlight.foreground6#44df44
- editorBracketHighlight.unexpectedBracket.foreground#ff5f59
- editorBracketMatch.background#2f7f9f
- editorBracketMatch.border#2f7f9f
- editorCodeLens.foreground#989898
- editorCursor.foreground#ffffff
- editorError.foreground#ff5f59
- editorGroup.border#646464
- editorGroupHeader.tabsBackground#1e1e1e
- editorGutter.addedBackground#237f3f
- editorGutter.addedSecondaryBackground#034f2f
- editorGutter.deletedBackground#b81a1f
- editorGutter.deletedSecondaryBackground#781a1f
- editorGutter.modifiedBackground#8a7a00
- editorGutter.modifiedSecondaryBackground#4a4a00
- editorHint.foreground#989898
- editorHoverWidget.background#1e1e1e
- editorHoverWidget.border#646464
- editorIndentGuide.activeBackground1#646464
- editorIndentGuide.background1#64646480
- editorInfo.foreground#6ae4b9
- editorLineNumber.activeForeground#ffffff
- editorLineNumber.foreground#989898
- editorLink.activeForeground#79a8ff
- editorMarkerNavigationError.background#ff5f59
- editorMarkerNavigationInfo.background#6ae4b9
- editorMarkerNavigationWarning.background#fec43f
- editorOverviewRuler.addedForeground#237f3f
- editorOverviewRuler.bracketMatchForeground#2f7f9f
- editorOverviewRuler.currentContentForeground#237f3f
- editorOverviewRuler.deletedForeground#b81a1f
- editorOverviewRuler.errorForeground#ff5f59
- editorOverviewRuler.findMatchForeground#7a6100
- editorOverviewRuler.incomingContentForeground#1640b0
- editorOverviewRuler.infoForeground#6ae4b9
- editorOverviewRuler.modifiedForeground#8a7a00
- editorOverviewRuler.warningForeground#fec43f
- editorRuler.foreground#64646480
- editorSuggestWidget.background#1e1e1e
- editorSuggestWidget.border#646464
- editorSuggestWidget.focusHighlightForeground#00bcff
- editorSuggestWidget.highlightForeground#00bcff
- editorWarning.foreground#fec43f
- editorWhitespace.foreground#646464
- errorForeground#ff5f59
- focusBorder#646464
- foreground#ffffff
- git.blame.editorDecorationForeground#efef80
- gitDecoration.addedResourceForeground#a0e0a0
- gitDecoration.conflictingResourceForeground#b81a1f
- gitDecoration.deletedResourceForeground#ffbfbf
- gitDecoration.ignoredResourceForeground#989898
- gitDecoration.modifiedResourceForeground#efef80
- gitDecoration.renamedResourceForeground#80e080
- gitDecoration.stageDeletedResourceForeground#ff9095
- gitDecoration.stageModifiedResourceForeground#c0b05f
- gitDecoration.submoduleResourceForeground#8a7a00
- gitDecoration.untrackedResourceForeground#c6daff
- inlineChat.background#1e1e1e
- inlineChat.border#646464
- inlineChat.foreground#ffffff
- inlineChatInput.background#000000
- inlineChatInput.border#646464
- inlineChatInput.focusBorder#00bcff
- inlineChatInput.placeholderForeground#989898
- input.background#303030
- inputValidation.errorBackground#9d1f1f
- inputValidation.errorBorder#ff5f59
- inputValidation.errorForeground#ffffff
- inputValidation.infoBackground#2266ae
- inputValidation.infoBorder#6ae4b9
- inputValidation.infoForeground#ffffff
- inputValidation.warningBackground#7a6100
- inputValidation.warningBorder#fec43f
- inputValidation.warningForeground#ffffff
- list.activeSelectionBackground#45605e33
- list.activeSelectionForeground#ffffff
- list.errorForeground#ff5f59
- list.focusHighlightForeground#00bcff
- list.focusOutline#45605e
- list.highlightForeground#00bcff
- list.hoverBackground#45605e
- list.hoverForeground#ffffff
- list.inactiveSelectionBackground#303030
- list.warningForeground#fec43f
- menu.background#1e1e1e
- menu.border#646464
- menu.foreground#ffffff
- menu.selectionBackground#45605e
- menu.selectionForeground#ffffff
- menu.separatorBackground#646464
- menubar.selectionBackground#45605e
- menubar.selectionForeground#ffffff
- merge.currentContentBackground#0029104d
- merge.currentHeaderBackground#00381f80
- merge.incomingContentBackground#2426794d
- merge.incomingHeaderBackground#24267980
- minimap.errorHighlight#ff5f59
- minimap.findMatchHighlight#7a6100
- minimap.selectionHighlight#5a5a5a
- minimap.warningHighlight#fec43f
- minimapGutter.addedBackground#237f3f
- minimapGutter.deletedBackground#b81a1f
- minimapGutter.modifiedBackground#8a7a00
- minimapSlider.activeBackground#535353cc
- minimapSlider.background#53535380
- minimapSlider.hoverBackground#535353a6
- multiDiffEditor.background#000000
- multiDiffEditor.border#646464
- multiDiffEditor.headerBackground#1e1e1e
- notifications.background#1e1e1e
- notificationsErrorIcon.foreground#ff5f59
- notificationsInfoIcon.foreground#6ae4b9
- notificationsWarningIcon.foreground#fec43f
- panel.border#646464
- panelSection.border#646464
- peekView.border#00bcff
- peekViewEditor.background#00bcff1a
- peekViewEditor.matchHighlightBackground#654a39
- peekViewResult.background#1e1e1e
- peekViewResult.lineForeground#989898
- peekViewResult.matchHighlightBackground#654a39
- pickerGroup.border#646464
- pickerGroup.foreground#ffffff
- progressBar.background#00bcff
- quickInput.background#1e1e1e
- quickInput.foreground#ffffff
- quickInputList.focusBackground#45605e
- quickInputList.focusForeground#ffffff
- quickInputList.focusIconForeground#ffffff
- sash.hoverBorder#45605e
- scmGraph.foreground1#ff66ff
- scmGraph.foreground2#00eff0
- scmGraph.foreground3#ff6b55
- scmGraph.foreground4#efef00
- scmGraph.foreground5#b6a0ff
- scmGraph.historyItemBaseRefColor#ffffff
- scmGraph.historyItemHoverAdditionsForeground#a0e0a0
- scmGraph.historyItemHoverDefaultLabelBackground#1e1e1e
- scmGraph.historyItemHoverDefaultLabelForeground#ffffff
- scmGraph.historyItemHoverDeletionsForeground#ffbfbf
- scmGraph.historyItemHoverLabelForeground#000000
- scmGraph.historyItemRefColor#79a8ff
- scmGraph.historyItemRemoteRefColor#f78fe7
- scrollbarSlider.activeBackground#535353cc
- scrollbarSlider.background#53535380
- scrollbarSlider.hoverBackground#535353a6
- searchEditor.findMatchBackground#7a6100
- selection.background#5a5a5a
- settings.focusedRowBackground#c6daff1a
- settings.focusedRowBorder#646464
- settings.headerBorder#646464
- settings.rowHoverBackground#c6daff1a
- settings.sashBorder#646464
- sideBar.background#1e1e1e
- sideBar.foreground#ffffffcc
- sideBarSectionHeader.background#1e1e1e
- sideBarSectionHeader.border#646464
- sideBySideEditor.horizontalBorder#646464
- sideBySideEditor.verticalBorder#646464
- statusBar.background#505050
- statusBar.foreground#ffffff
- statusBar.noFolderBackground#2d2d2d
- statusBar.noFolderForeground#969696
- statusBarItem.hoverBackground#45605e
- tab.border#1e1e1e
- tab.hoverBackground#45605e
- tab.hoverForeground#ffffff
- tab.inactiveBackground#262625
- terminal.ansiBlack#000000
- terminal.ansiBlue#2fafff
- terminal.ansiBrightBlack#595959
- terminal.ansiBrightBlue#79a8ff
- terminal.ansiBrightCyan#6ae4b9
- terminal.ansiBrightGreen#00c06f
- terminal.ansiBrightMagenta#b6a0ff
- terminal.ansiBrightRed#ff6b55
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#fec43f
- terminal.ansiCyan#00d3d0
- terminal.ansiGreen#44bc44
- terminal.ansiMagenta#feacd0
- terminal.ansiRed#ff5f59
- terminal.ansiWhite#989898
- terminal.ansiYellow#d0bc00
- terminal.background#000000
- terminal.border#646464
- terminal.foreground#ffffff
- terminal.selectionBackground#5a5a5a
- textBlockQuote.background#1e1e1e
- textBlockQuote.border#646464
- textCodeBlock.background#1e1e1e
- textLink.activeForeground#00bcff
- textLink.foreground#79a8ff
- textPreformat.background#1e1e1e
- textPreformat.foreground#6ae4b9
- textSeparator.foreground#646464
- titleBar.activeBackground#3f3f3f
- titleBar.activeForeground#ffffff
- walkThrough.embeddedEditorBackground#1e1e1e
- walkthrough.stepTitle.foreground#ffffff
- welcomePage.progress.background#303030
- welcomePage.progress.foreground#00bcff
- welcomePage.tileBackground#1e1e1e
- welcomePage.tileBorder#646464
- welcomePage.tileHoverBackground#45605e
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #989898 | italic |
| string, string.quoted, string.template, string.interpolated | #79a8ff | — |
| constant.character.escape, string.regexp | #00c06f | — |
| constant, constant.language, constant.character, support.constant | #00bcff | — |
| constant.numeric, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.numeric.octal, constant.numeric.binary | #ffffff | — |
| constant.language.boolean | #00bcff | — |
| keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.alignof, keyword.operator.typeid, keyword.operator.logical, keyword.operator.wordlike | #b6a0ff | — |
| keyword.operator, keyword.operator.assignment, keyword.operator.arithmetic, keyword.operator.bitwise, keyword.operator.comparison, keyword.operator.relational, keyword.operator.increment, keyword.operator.decrement, keyword.operator.ternary | #ffffff | — |
| storage, storage.modifier | #b6a0ff | — |
| storage.type | #6ae4b9 | — |
| storage.type.namespace.directive.cpp, storage.type.namespace.definition.cpp | #79a8ff | — |
| entity.name.type, entity.name.type.class, entity.name.type.struct, entity.name.type.interface, entity.name.type.enum, entity.name.type.type-parameter, support.type, support.type.primitive, support.type.builtin | #6ae4b9 | — |
| entity.name.type.parameter | #6ae4b9 | — |
| entity.name.function, entity.name.function.member, support.function, meta.function-call entity.name.function | #feacd0 | — |
| entity.name.function.method, meta.method.identifier entity.name.function | #feacd0 | — |
| variable.parameter, meta.parameter | #00d3d0 | — |
| variable, variable.other, variable.other.readwrite, variable.other.object, variable.other.object.access.cpp | #00d3d0 | — |
| variable.other.property, variable.other.object.property, meta.object-literal.key | #00d3d0 | — |
| variable.language | #b6a0ff | italic |
| entity.name.class, support.class | #6ae4b9 | — |
| entity.name.namespace, entity.name.scope-resolution | #00bcff | — |
| support.function.builtin, support.variable, support.type.property-name | #f78fe7 | — |
| meta.decorator, meta.decorator entity.name.function, punctuation.decorator | #b6a0ff | — |
| meta.preprocessor, entity.name.function.preprocessor, keyword.control.directive, keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as | #b6a0ff | — |
| punctuation.definition.directive, punctuation.definition.directive.c, punctuation.definition.directive.cpp | #b6a0ff | — |
| string.quoted.other.lt-gt.include, string.quoted.other.lt-gt.include.c, string.quoted.other.lt-gt.include.cpp | #79a8ff | — |
| punctuation, punctuation.separator, punctuation.terminator, meta.brace | #ffffff | — |
| punctuation.definition.string | #79a8ff | — |
| punctuation.definition.block, punctuation.definition.parameters, punctuation.section, punctuation.definition.begin, punctuation.definition.end | #ffffff | — |
| entity.name.tag, meta.tag | #b6a0ff | — |
| entity.other.attribute-name | #00d3d0 | — |
| support.type.property-name.css | #00d3d0 | — |
| support.constant.property-value.css, support.constant.font-name, meta.property-value | #00bcff | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.id.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css | #feacd0 | — |
| keyword.other.unit | #ffffff | — |
| support.type.property-name.json | #00d3d0 | — |
| entity.name.tag.yaml | #00d3d0 | — |
| support.type.property-name.toml | #00d3d0 | — |
| support.type.property-name.table.toml | #6ae4b9 | — |
| heading.1.markdown, heading.2.markdown, heading.3.markdown, heading.4.markdown, heading.5.markdown, heading.6.markdown, markup.heading | #ffffff | bold |
| markup.bold | #ffffff | bold |
| markup.italic | #ffffff | italic |
| markup.inline.raw, markup.fenced_code.block | #6ae4b9 | — |
| markup.underline.link, string.other.link | #79a8ff | — |
| punctuation.definition.list.begin.markdown, markup.list | #989898 | — |
| markup.quote | #989898 | italic |
| variable.other.normal.shell, variable.other.special.shell, variable.other.positional.shell | #00d3d0 | — |
| string.regexp.group, punctuation.definition.group.regexp, keyword.operator.quantifier.regexp | #00c06f | — |
| constant.other.character-class.regexp, constant.character.escape.backslash.regexp | #feacd0 | — |
| markup.inserted | #a0e0a0 | — |
| markup.deleted | #ffbfbf | — |
| markup.changed | #efef80 | — |
| string.quoted.docstring, comment.block.documentation | #9ac8e0 | italic |
| comment.block.documentation keyword, comment.block.documentation variable, storage.type.class.jsdoc, entity.name.type.instance.jsdoc, variable.other.jsdoc | #caa6df | — |
| variable.other.enummember | #00bcff | — |
| entity.name.label | #feacd0 | — |
| token.info-token | #6ae4b9 | — |
| token.warn-token | #fec43f | — |
| token.error-token | #ff5f59 | — |
| token.debug-token | #b6a0ff | — |