Bag Dark
Publisher: Bag MediaThemes in package: 1
Dark color theme
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#a277ff
- activityBar.background#15141b
- activityBar.border#000000
- activityBar.foreground#61ffca
- activityBar.inactiveForeground#525156
- activityBarBadge.background#a277ff
- activityBarBadge.foreground#15141b
- badge.background#a277ff
- badge.foreground#15141b
- button.background#61ffca
- button.foreground#15141b
- button.hoverBackground#49c29a
- diffEditor.insertedTextBackground#00d89023
- diffEditor.removedTextBackground#ff474720
- dropdown.background#15141b
- dropdown.border#3b334b
- dropdown.foreground#cdccce
- editor.background#15141b
- editor.findMatchBackground#3d375e7f
- editor.findMatchHighlightBackground#3d375e7f
- editor.findRangeHighlightBackground#3d375e7f
- editor.foreground#edecee
- editor.inactiveSelectionBackground#3d375e7f
- editor.lineHighlightBackground#a394f033
- editor.lineHighlightBorder#a394f000
- editor.selectionBackground#e42b2b62
- editor.selectionHighlightBackground#3d375e7f
- editor.wordHighlightBackground#3d375e7f
- editor.wordHighlightStrongBackground#3d375e7f
- editorBracketMatch.border#a277ff
- editorCursor.foreground#a277ff
- editorError.border#ffffff00
- editorError.foreground#ff6767
- editorGroup.border#000000
- editorGroup.dropBackground#3d375e7f
- editorGroupHeader.tabsBackground#15141b
- editorGroupHeader.tabsBorder#000000
- editorGutter.addedBackground#61ffca
- editorGutter.deletedBackground#ff6767
- editorGutter.modifiedBackground#ffca85
- editorHoverWidget.background#121016
- editorHoverWidget.border#2d2d2d
- editorIndentGuide.activeBackground#6d6d6d
- editorIndentGuide.background#2d2d2d
- editorInlayHint.background#2e2b38
- editorInlayHint.foreground#cdccce
- editorLineNumber.foreground#a394f033
- editorLink.activeForeground#a277ff
- editorSuggestWidget.background#121016
- editorSuggestWidget.border#2d2d2d
- editorSuggestWidget.foreground#cdccce
- editorSuggestWidget.highlightForeground#61ffca
- editorSuggestWidget.selectedBackground#4d4d4d
- editorWarning.border#ffffff00
- editorWarning.foreground#ffca85
- editorWhitespace.foreground#2d2d2d
- editorWidget.background#121016
- editorWidget.border#2d2d2d
- errorForeground#ff6767
- focusBorder#a394f033
- foreground#edecee
- gitDecoration.conflictingResourceForeground#a277ff
- gitDecoration.deletedResourceForeground#ff6767
- gitDecoration.ignoredResourceForeground#4d4d4d
- gitDecoration.modifiedResourceForeground#ffca85
- gitDecoration.untrackedResourceForeground#61ffca
- input.background#15141b
- input.border#3b334b
- input.foreground#cdccce
- input.placeholderForeground#af8aff7f
- inputOption.activeBorder#a277ff
- list.activeSelectionBackground#2e2b38
- list.activeSelectionForeground#a277ff
- list.focusBackground#3b334b
- list.focusForeground#a277ff
- list.highlightForeground#ffca85
- list.hoverBackground#3b334b
- list.hoverForeground#edecee
- list.inactiveSelectionBackground#2e2b38
- list.inactiveSelectionForeground#a277ff
- panel.border#000000
- panelTitle.activeBorder#61ffca
- panelTitle.activeForeground#cdccce
- progressBar.background#61ffca
- scrollbar.shadow#15141b
- scrollbarSlider.activeBackground#3d375e7f
- scrollbarSlider.background#a394f033
- scrollbarSlider.hoverBackground#a394f033
- selection.background#3d375e7f
- sideBar.background#110f18
- sideBar.border#000000
- sideBar.foreground#cdccce
- sideBarSectionHeader.background#15141b
- sideBarSectionHeader.foreground#adacae
- sideBarTitle.foreground#adacae
- statusBar.background#121016
- statusBar.border#000000
- statusBar.foreground#adacae
- statusBarItem.activeBackground#a277ff
- tab.activeBackground#00000000
- tab.activeBorderTop#61ffca
- tab.activeForeground#61ffca
- tab.border#000000
- tab.inactiveBackground#15141b
- tab.inactiveForeground#6d6d6d
- terminal.background#15141b
- terminal.foreground#cdccce
- terminal.selectionBackground#3d375e7f
- terminalCursor.background#2d2d2d
- terminalCursor.foreground#adacae
- titleBar.activeBackground#121016
- titleBar.border#000000
- titleBar.inactiveBackground#2d2b38
- tree.indentGuidesStroke#4d4d4d
- widget.shadow#0f0f0f
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| meta.embedded, source.groovy.embedded | #D4D4D4 | — |
| emphasis | — | italic |
| strong | — | bold |
| header | #000080 | — |
| comment | #57A64A | — |
| constant.language | #569CD6 | — |
| constant.numeric | #B5CEA8 | — |
| constant.regexp | #646695 | — |
| entity.name.tag | #569CD6 | — |
| entity.name.tag.css | #D7BA7D | — |
| entity.other.attribute-name | #9CDCFE | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.class.mixin.css, entity.other.attribute-name.id.css, entity.other.attribute-name.parent-selector.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css, source.css.less entity.other.attribute-name.id, entity.other.attribute-name.attribute.scss, entity.other.attribute-name.scss | #D7BA7D | — |
| invalid | #F44747 | — |
| markup.underline | — | underline |
| markup.bold | #569CD6 | bold |
| markup.heading | #569CD6 | bold |
| markup.italic | — | italic |
| markup.inserted | #B5CEA8 | — |
| markup.deleted | #D69D85 | — |
| markup.changed | #569CD6 | — |
| punctuation.definition.quote.begin.markdown | #6A9955 | — |
| punctuation.definition.list.begin.markdown | #6796E6 | — |
| markup.inline.raw | #D69D85 | — |
| punctuation.definition.tag | #808080 | — |
| meta.preprocessor | #569CD6 | — |
| meta.preprocessor.string | #D69D85 | — |
| meta.preprocessor.numeric | #B5CEA8 | — |
| meta.structure.dictionary.key.python | #9CDCFE | — |
| meta.diff.header | #569CD6 | — |
| storage | #569CD6 | — |
| storage.modifier | #569CD6 | — |
| string | #D69D85 | — |
| string.tag | #D69D85 | — |
| string.value | #D69D85 | — |
| string.regexp | #D16969 | — |
| punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded | #569CD6 | — |
| meta.template.expression | #D4D4D4 | — |
| support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less, source.coffee.embedded | #9CDCFE | — |
| keyword | #569CD6 | — |
| keyword.operator | #B4B4B4 | — |
| keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.instanceof, keyword.operator.logical.python | #569CD6 | — |
| keyword.other.unit | #B5CEA8 | — |
| punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php | #569CD6 | — |
| support.function.git-rebase | #9CDCFE | — |
| constant.sha.git-rebase | #B5CEA8 | — |
| storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java | #D4D4D4 | — |
| variable.language | #569CD6 | — |
| entity.name | #C8C8C8 | — |
| keyword.control.directive | #9B9B9B | — |
| variable | #C8C8C8 | — |
| entity.name.function | #C8C8C8 | — |
| entity.name.function.operator | #B4B4B4 | — |
| entity.name.function.preprocessor | #BD63C5 | — |
| entity.name.label | #C8C8C8 | — |
| entity.name.namespace | #FFFFFF | — |
| entity.name.type, entity.name.class | #4EC9B0 | — |
| entity.name.operator.custom-literal | #DADADA | — |
| entity.name.operator.custom-literal.number | #B5CEA8 | — |
| entity.name.operator.custom-literal.string | #D69D85 | — |
| keyword.operator.new, keyword.operator.delete | #569CD6 | — |
| variable.other.enummember | #B8D7A3 | — |
| variable.other.property | #DADADA | — |
| variable.parameter | #7F7F7F | — |
| comment, comment.block | — | italic |
| keyword - keyword.operator | #999999 | — |
| storage | #999999 | — |
| punctuation.separator.pointer-access.c, punctuation.separator.dot-access.c | #D1C452 | — |
| meta.block.c | #D9E289 | — |
| variable.other.property, entity.name.namespace.rust, punctuation.terminator.statement.c | #FFFFFF | — |
| entity.name.function, meta.member.access.python | #80CC00 | — |
| variable.parameter, entity.name.variable.parameter, meta.function-call.arguments.python | #708090 | — |
| variable.other.object.js.jsx, variable.other.object.ts, variable.other.object.tsx | #708090 | — |
| variable.other.constant | #728BA3 | — |
| entity.name.variable.local, variable.other.local, variable.other.rust, string.key.json5, meta.indexed-name.python | #66CDFF | — |
| keyword, punctuation.definition.typeparameters, punctuation.separator.delimiter.c | #676767 | — |
| entity.name.type | #FFAA48 | — |
| entity.name.function.preprocessor, entity.name.function.macro.rust | #DDDD4F | — |
| entity.name.type.class.js.jsx, entity.name.type.class.ts, entity.name.type.class.tsx | #FFAA48 | — |
| support.class.component.js.jsx, support.class.component.ts, support.class.component.tsx | #D68427 | — |
| variable.other.readwrite, meta.use.rust, meta.interpolation.rust | #87AFD4 | — |
| entity.other.inherited-class.js.jsx, entity.other.inherited-class.ts, entity.other.inherited-class.tsx | #FFAA48 | — |
| variable.other.readwrite.alias.js.jsx, variable.other.readwrite.alias.ts, variable.other.readwrite.alias.tsx | #D68427 | — |
| meta.object.member | #DDDDDD | — |
| constant.other.caps.rust, variable.other.global | #E0727B | bold |
| keyword.control.conditional.js, keyword.control.conditional.ts, keyword.control.conditional.tsx, keyword.control.flow.js, keyword.control.flow.ts, keyword.control.flow.tsx, keyword.control.rust | #5F5C57 | bold |
| storage.type.js, storage.type.ts, storage.type.tsx | #446BD6 | bold |
| variable.language.this | #6285E4 | bold italic |
| constant.language.null, constant.other.placeholder | #EED025 | bold italic |
| constant.language.boolean.false, keyword.operator.namespace.rust, constant.other.caps.python | #EE4D25 | bold italic |
| constant.language.boolean.true | #75EE25 | bold italic |
| variable.other.readwrite.js, variable.other.readwrite.ts, variable.other.readwrite.tsx | #87AFD4 | — |
| variable.other.object.js, variable.other.object.ts, variable.other.object.tsx | #87AFD4 | — |
| support.class.builtin.js, support.class.builtin.ts, support.class.builtin.tsx, constant.character.escape, meta.attribute.rust | #C23DA5 | bold italic |
| support.variable.property.js, support.variable.property.ts, support.variable.property.tsx, variable.other.object.property, entity.name.variable.property, punctuation.definition.interpolation, punctuation.parenthesis | #FFFFFF | — |
| support.constant | #C23DA5 | bold italic |
| keyword.operator | #919191 | — |
| support.function, support.type, constant.other.placeholder | #E1FF37 | — |
| token.info-token | #6796E6 | — |
| token.warn-token | #CD9731 | — |
| token.error-token | #F44747 | — |
| token.debug-token | #B267E6 | — |
| storage.modifier | #999999 | — |
| entity.name.namespace | #FFFFFF | — |