TypeDark
Publisher: BonnyAD9Themes in package: 4
Dark theme with useful semantic highlighting.
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#181818
- activityBar.border#555555
- activityBar.foreground#11b394
- activityBar.inactiveForeground#555555
- activityBarBadge.background#11b394
- activityBarBadge.foreground#101010
- badge.background#181818
- badge.foreground#555555
- button.background#11b394
- button.foreground#222222
- button.hoverBackground#12cca9
- checkbox.background#181818
- checkbox.border#555555
- checkbox.foreground#eeeeee
- debugExceptionWidget.background#181818
- debugExceptionWidget.border#555555
- dropdown.background#181818
- dropdown.border#555555
- dropdown.foreground#eeeeee
- editor.background#222222
- editor.foreground#eeeeee
- editor.hoverHighlightBackground#3acbaf30
- editor.lineHighlightBackground#1c1c1c
- editor.lineHighlightBorder#333333
- editor.selectionBackground#3acbaf40
- editor.selectionHighlightBackground#12cca910
- editor.selectionHighlightBorder#11b394
- editor.wordHighlightStrongBackground#12cca930
- editorBracketHighlight.foreground1#cccc8e
- editorBracketHighlight.foreground2#8ecccc
- editorBracketHighlight.foreground3#cc8ecc
- editorBracketPairGuide.activeBackground1#cccc8e
- editorBracketPairGuide.activeBackground2#8ecccc
- editorBracketPairGuide.activeBackground3#cc8ecc
- editorGroup.border#555555
- editorGroup.dropBackground#12cca910
- editorGroupHeader.tabsBackground#181818
- editorGroupHeader.tabsBorder#555555
- editorIndentGuide.activeBackground1#11b394
- editorLineNumber.activeForeground#3b9987
- editorLineNumber.foreground#555555
- editorSuggestWidget.background#181818
- editorSuggestWidget.border#555555
- editorSuggestWidget.focusHighlightForeground#11b394
- editorSuggestWidget.foreground#eeeeee
- editorSuggestWidget.highlightForeground#11b394dd
- editorWhitespace.foreground#555555
- focusBorder#11b394
- foreground#eeeeee
- input.background#181818
- input.border#555555
- input.foreground#eeeeee
- input.placeholderForeground#555555
- inputOption.activeBorder#11b394
- keybindingLabel.background#181818
- keybindingLabel.border#555555
- keybindingLabel.bottomBorder#555555
- keybindingLabel.foreground#eeeeee
- list.activeSelectionBackground#12cca910
- list.filterMatchBackground#12cca910
- list.filterMatchBorder#11b394
- list.highlightForeground#11b394
- list.hoverBackground#12cca905
- list.inactiveSelectionBackground#12cca920
- listFilterWidget.background#12cca955
- listFilterWidget.noMatchesOutline#dd7700
- listFilterWidget.outline#11b394
- menu.background#181818
- menu.border#555555
- menu.foreground#eeeeee
- menu.separatorBackground#555555
- menubar.selectionBackground#222222
- menubar.selectionBorder#555555
- minimap.background#181818
- minimap.foregroundOpacity#000000FF
- minimap.selectionHighlight#12cca9FE
- minimapSlider.activeBackground#ffffff1a
- minimapSlider.background#ffffff10
- minimapSlider.hoverBackground#ffffff15
- panel.background#181818
- panel.border#555555
- panel.dropBorder#11b394
- panelTitle.activeBorder#11b394
- panelTitle.activeForeground#eeeeee
- panelTitle.inactiveForeground#555555
- peekView.border#555555
- peekViewEditor.background#181818
- peekViewEditor.matchHighlightBackground#12cca910
- peekViewEditor.matchHighlightBorder#11b39455
- peekViewResult.background#181818
- peekViewResult.matchHighlightBackground#12cca900
- peekViewResult.selectionBackground#12cca910
- peekViewTitle.background#222222
- pickerGroup.border#555555
- pickerGroup.foreground#eeeeee
- progressBar.background#11b394
- quickInput.background#222222
- quickInput.foreground#eeeeee
- scrollbar.shadow#000000
- selection.background#12cca944
- settings.modifiedItemIndicator#11b394
- sideBar.background#181818
- sideBar.border#555555
- sideBar.foreground#eeeeee
- sideBarSectionHeader.background#282828
- sideBarSectionHeader.foreground#eeeeee
- sideBarTitle.foreground#bbbbbb
- statusBar.background#11b394
- statusBar.foreground#101010
- statusBar.noFolderBackground#883388
- statusBar.noFolderForeground#eee
- tab.activeBackground#222222
- tab.activeBorder#222222
- tab.border#555555
- tab.hoverBorder#11b394
- tab.inactiveBackground#1a1a1a
- tab.inactiveForeground#555555
- terminal.ansiBlack#000
- terminal.ansiBlue#56e
- terminal.ansiBrightBlack#777
- terminal.ansiBrightBlue#308eea
- terminal.ansiBrightCyan#6cc
- terminal.ansiBrightGreen#23d16a
- terminal.ansiBrightMagenta#f7f
- terminal.ansiBrightRed#f55
- terminal.ansiBrightWhite#fff
- terminal.ansiBrightYellow#ff5
- terminal.ansiCyan#388
- terminal.ansiGreen#383
- terminal.ansiMagenta#848
- terminal.ansiRed#833
- terminal.ansiWhite#ccc
- terminal.ansiYellow#883
- textLink.foreground#11b394
- titleBar.activeBackground#181818
- titleBar.activeForeground#eeeeee
- titleBar.border#555555
- titleBar.inactiveBackground#222222
- titleBar.inactiveForeground#888888
- toolbar.activeBackground#222222
- toolbar.hoverBackground#444444
- tree.indentGuidesStroke#12cca955
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| meta.preprocessor string, entity.name.namespace, entity.name.section.vhdl, entity.name.type.namespace, support.other.namespace, entity.name.type.package | #19b6ff | — |
| entity.name.function, support.function, entity.name.label.cs | — | italic |
| variable.parameter, variable.other.makefile, meta.property-name.css, variable.other.positional, variable.other.metavariable.name, entity.name.function.io.brainfuck, constant.other.option.dash.shell, constant.other.option | #ffa632 | italic |
| punctuation.definition.directive, copula | #7faeff | — |
| keyword.operator, storage.modifier.pointer.cpp, source.makefile punctuation, storage.type.function.arrow.js, punctuation.separator.key-value.html, punctuation.definition.variable.php, keyword.control.cshtml.transition, source.prolog keyword.control, storage.type.function.arrow.ts, punctuation.separator.statement.background.shell, punctuation.math.operator | #e5dba0 | — |
| comment.block, punctuation.definition.comment, comment.ebnf | #7f7f7f | italic |
| comment.line, comment meta.paragraph, comment.source | #666666 | italic |
| keyword.default, keyword.control.context, keyword.control.flow, keyword.control.conditional, keyword.control.exception, keyword.control.loop, keyword.control.directive, keyword.control.twig, keyword.control.awk, source.cpp keyword.control, source.cpp keyword.other, source.python keyword.control, source.java keyword.control, source.java keyword.other, source.c keyword.control, source.c keyword.other, source.shell keyword.control, source.php keyword.control, source.php keyword.other, source.oraclesql keyword.control, source.zig keyword.control, source.js keyword.control, source.ts keyword.control, source.cs storage.type, source.cs storage.modifier, source.cs keyword.other, source.go keyword, source.tsx keyword, source.haskell keyword, text.tex.latex keyword, source.makefile support.function, source.prolog keyword.other, source.rust keyword.control, source.rust keyword.other, source.sql keyword.other, keyword.operator.conjunction, support.type.property-name.table.toml, variable.language.this, variable.language.base, variable.language.java, variable.parameter.function.language.special.self, entity.name.tag, keyword.mnemonic, storage.modifier, storage.type.struct.cpp, storage.type, keyword.operator.quantifier.regexp, keyword.storage.zig, keyword.structure, keyword.cmake, keyword.type.go, keyword.language, source.rust variable.language, entity.name.function.macro.rules.rust, keyword.other.var.cs | #4c8dff | italic |
| string.quoted.double, string.template.js, string.quoted.single.js, meta.preprocessor.string.cs, source.toml string.quoted.single, string.template.ts, constant.string, string.source.cmake, string.quoted.multi, constant.character.set.regexp, string.regexp.quoted.single.python punctuation.definition.string.begin.python, string.regexp.quoted.single.python punctuation.definition.string.end.python, string.regexp, string.unquoted.heredoc, constant.character.math.tex | #e5a55b | — |
| constant.other.placeholder, punctuation.definition.interpolation, punctuation.definition.template-expression, punctuation.section.embedded.begin.php, string.quoted.double.html punctuation.section.tag.twig | #e0e55b | italic |
| invalid.illegal.placeholder, invalid.illegal.unknown-escape | #ff3232 | bold italic |
| invalid.illegal | #ff3232 | bold |
| string.quoted.double constant.character.escape | #ff8800 | italic |
| string.quoted.single | #e5ce5b | — |
| constant.character.escape | #ffd400 | italic |
| constant.numeric, constant.language, constant.other.color, entity.name.tag.backreference, keyword.constant | #d072e5 | — |
| keyword.other.unit, constant.other.color punctuation.definition.constant.css, punctuation.parenthesis.begin.regexp, punctuation.parenthesis.end.regexp | #c32de5 | — |
| variable.other.enummember, constant.enum, constant.other.class.php, invalid.illegal.exception.oraclesql, entity.source.cmake | #ccc88e | — |
| entity.name.type.class, support.class, support.class punctuation.definition.string, entity.name.type.vhdl, variable.other.metavariable.specifier, source.vhdl support.type, entity.name.type.type.vhdl, entity.name.command.shell, meta.class support.function.constructor, entity.other.inherited-class.php, text.aspnetcorerazor entity.name.type.cs | #28c3cc | — |
| entity.name.type.struct, keyword.operator.adverb, entity.name.type.rust, entity.name.type.architecture, punctuation.character.set.begin.regexp, punctuation.character.set.end.regexp, entity.name.type.go | #28cc92 | — |
| entity.name.type.enum, support.type.property-name.array | #71ce6d | — |
| entity.name.type.interface, text.tex.latex constant.other, entity.other.inherited-class.vhdl, source.vhdl entity.name.type.entity, support.class.mcfunction | #b0cc28 | — |
| meta.interpolation, meta.template.expression.js, meta.template.expression.ts, variable.parameter.label.asm, support.class.math.block, entity.name.type.namespace punctuation.separator.inheritance, meta.use punctuation.separator.inheritance, text.aspnetcorerazor meta.expression | #eeeeee | — |
| entity.name.section | #b2e6ff | bold |
| punctuation.definition.heading | #19b6ff | — |
| markup.inline, markup.fenced_code.block | #e5a55b | — |
| fenced_code.block.language | #e0e55b | italic |
| punctuation.definition.list, punctuation.definition.bold, punctuation.definition.italic | #447fe5 | — |
| markup.italic | — | italic |
| markup.bold markup.italic | — | bold italic |
| markup.bold | — | bold |
| meta.link.inline markup.underline.link, meta.link.reference.markdown constant.other.reference.link.markdown, markup.underline.link.markdown | #447fe5 | — |
| punctuation.definition.link.title, meta.link.inline punctuation.definition.metadata, meta.link.reference.markdown punctuation.definition.constant.end.markdown, meta.link.reference.markdown punctuation.definition.constant.begin.markdown, meta.link.reference.def.markdown | #28c3cc | — |
| punctuation.definition.link.description, meta.image.inline punctuation.definition.metadata, meta.image.reference.markdown punctuation.definition.constant.markdown | #2ecc28 | — |
| string.other.link.title, string.other.link.description, support.type.register | #e5ce5b | — |
| constant.other.reference.link.markdown, constant.other | — | bold |
| markup.underline.link.image, meta.image.reference.markdown constant.other.reference.link.markdown | #28cc92 | — |
| support.type.property-name.json, entity.other.attribute-name, meta.object-literal.key.js string.quoted.double.js, support.type.property-name.toml | #28c3cc | italic |
| entity.name.function.macro.rust, variable.language.makefile, source.css support.constant, entity.name.variable.preprocessor.symbol.cs, source.shell variable.other, text.tex.latex support.function, entity.name.function.preprocessor, storage.source.cmake, support.variable.magic.python, support.function.magic.python, source.oraclesql support.function.builtin, support.function.builtin.zig, variable.source.cmake, variable.language.nawk, variable.language.awk, source.php support.function.construct | #e2ccff | — |
| variable.other.constant, source.css variable | — | bold |
| entity.name.type.numeric, entity.name.type.primitive.rust, storage.type.built-in, keyword.type, support.type.primitive, support.other.match.end.regexp, support.other.match.begin.regexp, storage.type.primitive, support.function.builtin.shell, keyword.other.type, support.type.oraclesql, storage.type.error.go, storage.type.numeric, storage.type.boolean, keyword.map.go, storage.type.haskell | #ed478f | — |
| meta.attribute.rust, meta.function.decorator, storage.type.annotation.java, punctuation.definition.annotation.java, support.other.attribute.cpp, meta.attribute.php, meta.tag.preprocessor.xml | #b4b4b4 | bold |
| meta.preprocessor.macro | #ccc | — |
| source.css variable | #ccdeff | — |
| variable.other.property, variable.other.object.property | #e4ffe7 | — |
| storage.type.class.doxygen, storage.type.class.jsdoc | #355a99 | — |
| comment.block.documentation variable.parameter | #b9833c | — |
| comment markup.inline, punctuation.definition.string.heredoc.shell | #aa7f4f | — |
| comment punctuation.definition.heading | #297ba1 | italic |
| entity.name.type.instance.jsdoc | #337b7f | bold |
| comment entity.name.section | #6c8c9b | bold italic |
| meta.method-call | #e4ffe7 | — |
| meta.tag.template.value.twig, keyword.control.flow.mcfunction | #eee | — |
| keyword.control.at-rule | #4c8dff | — |