Proper Dark Theme
Publisher: amelinium23Themes in package: 1
A visually appealing and easy-on-the-eyes dark theme for developers, designed to reduce eye strain and improve code readability during long coding sessions.
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#0078d4
- activityBar.background#181818
- activityBar.border#ffffff15
- activityBar.foreground#ffffffc5
- activityBar.inactiveForeground#ffffff80
- activityBarBadge.background#0078d4
- activityBarBadge.foreground#ffffff
- badge.background#0078d4
- badge.foreground#ffffff
- button.background#0078d4
- button.border#ffffff12
- button.foreground#ffffff
- button.hoverBackground#0078d4e6
- button.secondaryBackground#FFFFFF0F
- button.secondaryForeground#ffffffc5
- button.secondaryHoverBackground#ffffff15
- checkbox.background#313131
- checkbox.border#ffffff15
- debugToolBar.background#181818
- descriptionForeground#8b949e
- diffEditor.insertedLineBackground#23863633
- diffEditor.insertedTextBackground#2386364d
- diffEditor.removedLineBackground#da363333
- diffEditor.removedTextBackground#da36334d
- dropdown.background#313131
- dropdown.border#ffffff17
- dropdown.foreground#ffffffc5
- dropdown.listBackground#313131
- editor.background#1f1f1f
- editor.findMatchBackground#9e6a03
- editor.foreground#ffffffd3
- editorGroup.border#ffffff17
- editorGroupHeader.tabsBackground#181818
- editorGroupHeader.tabsBorder#ffffff15
- editorGutter.addedBackground#2ea043
- editorGutter.deletedBackground#f85149
- editorGutter.modifiedBackground#0078d4
- editorInlayHint.background#8b949e33
- editorInlayHint.foreground#8b949e
- editorInlayHint.typeBackground#8b949e33
- editorInlayHint.typeForeground#8b949e
- editorLineNumber.activeForeground#ffffffc5
- editorLineNumber.foreground#6e7681
- editorOverviewRuler.border#010409
- editorWidget.background#1f1f1f
- errorForeground#f85149
- focusBorder#0078d4
- foreground#ffffffc5
- icon.foreground#ffffffc5
- input.background#ffffff0f
- input.border#ffffff17
- input.foreground#ffffffc5
- input.placeholderForeground#ffffff79
- inputOption.activeBackground#2489db82
- inputOption.activeBorder#2488db
- keybindingLabel.foreground#ffffffc5
- list.activeSelectionBackground#ffffff0f
- list.activeSelectionForeground#ffffff
- list.activeSelectionIconForeground#ffffff
- menu.background#1f1f1f
- notificationCenterHeader.background#1f1f1f
- notificationCenterHeader.foreground#ffffffc5
- notifications.background#1f1f1f
- notifications.border#ffffff15
- notifications.foreground#ffffffc5
- panel.background#181818
- panel.border#ffffff15
- panelInput.border#ffffff15
- panelTitle.activeBorder#0078d4
- panelTitle.activeForeground#ffffffc5
- panelTitle.inactiveForeground#8b949e
- peekViewEditor.background#1f1f1f
- peekViewEditor.matchHighlightBackground#bb800966
- peekViewResult.background#1f1f1f
- peekViewResult.matchHighlightBackground#bb800966
- pickerGroup.border#ffffff15
- pickerGroup.foreground#8b949e
- progressBar.background#0078d4
- quickInput.background#1f1f1f
- quickInput.foreground#ffffffc5
- scrollbar.shadow#484f5833
- scrollbarSlider.activeBackground#6e768187
- scrollbarSlider.background#6e768133
- scrollbarSlider.hoverBackground#6e768145
- settings.dropdownBackground#313131
- settings.dropdownBorder#ffffff17
- settings.headerForeground#ffffff
- settings.modifiedItemIndicator#bb800966
- sideBar.background#181818
- sideBar.border#ffffff15
- sideBar.foreground#ffffffc5
- sideBarSectionHeader.background#181818
- sideBarSectionHeader.border#ffffff15
- sideBarSectionHeader.foreground#ffffffc5
- sideBarTitle.foreground#ffffffc5
- statusBar.background#181818
- statusBar.border#ffffff15
- statusBar.debuggingBackground#0078d4
- statusBar.debuggingForeground#ffffff
- statusBar.foreground#ffffffc5
- statusBar.noFolderBackground#1f1f1f
- statusBarItem.focusBorder#0078d4
- statusBarItem.prominentBackground#6e768166
- statusBarItem.remoteBackground#0078d4
- statusBarItem.remoteForeground#ffffff
- tab.activeBackground#1f1f1f
- tab.activeBorder#1f1f1f
- tab.activeBorderTop#0078d4
- tab.activeForeground#ffffffc5
- tab.border#ffffff15
- tab.hoverBackground#1f1f1f
- tab.inactiveBackground#181818
- tab.inactiveForeground#ffffff80
- tab.unfocusedActiveBorder#1f1f1f
- tab.unfocusedActiveBorderTop#ffffff15
- tab.unfocusedHoverBackground#6e76811a
- terminal.foreground#ffffffc5
- terminal.tab.activeBorder#0078d4
- textBlockQuote.background#010409
- textBlockQuote.border#ffffff14
- textCodeBlock.background#6e768166
- textLink.activeForeground#40A6FF
- textLink.foreground#40A6FF
- textPreformat.foreground#8b949e
- textSeparator.foreground#21262d
- titleBar.activeBackground#181818
- titleBar.activeForeground#ffffffc5
- titleBar.border#ffffff15
- titleBar.inactiveBackground#1f1f1f
- titleBar.inactiveForeground#8b949e
- welcomePage.progress.foreground#0078d4
- welcomePage.tileBackground#ffffff0f
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment, string.comment | #8b949e | — |
| constant, entity.name.constant, variable.other.constant, variable.language, entity | #7cb6f8 | — |
| entity.name, meta.export.default, meta.definition.variable, variable.parameter.js, variable.parameter | #ffa657 | — |
| variable.parameter.function, meta.jsx.children, meta.tag.attributes, entity.name.constant, meta.object.member, meta.embedded.expression | #e5e9ed | — |
| entity.name.function | #d2a8ff | — |
| entity.name.tag, support.class.component | #7ee787 | — |
| keyword | #ff7b72 | — |
| storage, storage.type | #ff7b72 | — |
| storage.modifier.package, storage.modifier.import, storage.type.java | #e1e4e8 | — |
| string, punctuation.definition.string, string punctuation.section.embedded source | #a5d6ff | — |
| support | #78b4e9 | — |
| meta.property-name | #b2dbff | — |
| variable.other | #c9d1d9 | — |
| invalid.broken | #ffa198 | italic |
| invalid.deprecated | #ffa198 | italic |
| invalid.illegal | #ffa198 | italic |
| invalid.unimplemented | #ffa198 | italic |
| message.error | #ffa198 | — |
| string source | #c9d1d9 | — |
| string variable | #c7e6ff | — |
| source.regexp, string.regexp | #a5d6ff | — |
| string.regexp.character-class, string.regexp constant.character.escape, string.regexp source.ruby.embedded, string.regexp string.regexp.arbitrary-repitition | #a5d6ff | — |
| string.regexp constant.character.escape | #7ee787 | bold |
| support.constant | #bfdef8 | — |
| support.variable | #79c0ff | — |
| meta.module-reference | #79c0ff | — |
| punctuation.definition.list.begin.markdown | #ffa657 | — |
| markup.heading, markup.heading entity.name | #79c0ff | bold |
| markup.quote | #7ee787 | — |
| markup.italic | #c9d1d9 | italic |
| markup.bold | #c9d1d9 | bold |
| storage.type.java, variable.other.object.java | #28b7ff | — |
| markup.raw | #79c0ff | — |
| markup.deleted, meta.diff.header.from-file, punctuation.definition.deleted | #ffa198 | — |
| markup.inserted, meta.diff.header.to-file, punctuation.definition.inserted | #7ee787 | — |
| markup.changed, punctuation.definition.changed | #ffa657 | — |
| punctuation.definition.comment, comment.block.documentation | #a3a3a3 | — |
| markup.ignored, markup.untracked | #414344 | — |
| meta.diff.range | #d2a8ff | bold |
| meta.diff.header | #79c0ff | — |
| meta.separator | #79c0ff | bold |
| meta.output | #79c0ff | — |
| brackethighlighter.unmatched | #ffa198 | — |
| constant.other.reference.link, string.other.link | #93c5fd | underline |
| variable.object.property | #79c0ff | — |
| string.quoted.double | #90cafa | — |
| entity.other, entity.other.attribute-name, entity.other.attribute-name.js.jsx, entity.other.attribute-name.ts.tsx | #75b1ff | — |
| punctuation.definition.tag | #ebf1f2 | — |
| source.ignore | #d6d6d6 | — |
| support.type.property-name | #6A9FE6 | — |
| text.html.jinja, html.other, meta.tag.metadata.title.start.html, meta.tag.metadata.title.end.html | #ebebeb | — |
| meta.block.js.jsx, meta.block.ts.tsx | #79C0FF | — |
| meta.embedded.expression | #FFA657 | — |
| variable.other.property, variable.other, punctuation.definition.decorator.python | #64b4ff | — |
| string.quoted.docstring.multi.python, source.python | #A5D6FF | — |
| support.type.python, entity.name.type.class | #d2a8ff | — |
| meta.function.parameters.python, punctuation.section.function.begin, punctuation.separator.annotation.result | #FFA657 | — |