Lume Theme
Publisher: LumeThemes in package: 3
Carefully crafted dark and light themes optimized for readability and long coding sessions
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#06080c
- activityBar.border#21262d
- activityBar.foreground#e6edf3
- activityBar.inactiveForeground#7d8590
- activityBarBadge.background#4ade80
- activityBarBadge.foreground#0a0c10
- badge.background#4ade80
- badge.foreground#0a0c10
- breadcrumb.activeSelectionForeground#4ade80
- breadcrumb.background#0a0c10
- breadcrumb.focusForeground#e6edf3
- breadcrumb.foreground#7d8590
- breadcrumbPicker.background#0d1117
- button.background#4ade80
- button.foreground#0a0c10
- button.hoverBackground#22c55e
- button.secondaryBackground#21262d
- button.secondaryForeground#e6edf3
- button.secondaryHoverBackground#30363d
- diffEditor.insertedLineBackground#4ade8010
- diffEditor.insertedTextBackground#4ade8020
- diffEditor.removedLineBackground#f8717110
- diffEditor.removedTextBackground#f8717120
- dropdown.background#0d1117
- dropdown.border#21262d
- dropdown.foreground#e6edf3
- dropdown.listBackground#0d1117
- editor.background#0a0c10
- editor.findMatchBackground#3d5a8080
- editor.findMatchHighlightBackground#3d5a8050
- editor.findRangeHighlightBackground#1c3a5e30
- editor.foreground#e6edf3
- editor.hoverHighlightBackground#1c3a5e40
- editor.inactiveSelectionBackground#1c3a5e30
- editor.lineHighlightBackground#12141a
- editor.rangeHighlightBackground#12141a
- editor.selectionBackground#1c3a5e80
- editor.selectionHighlightBackground#1c3a5e40
- editor.wordHighlightBackground#1c3a5e50
- editor.wordHighlightStrongBackground#1c3a5e70
- editorBracketMatch.background#1c3a5e40
- editorBracketMatch.border#4ade8060
- editorCodeLens.foreground#7d8590
- editorCursor.foreground#4ade80
- editorHoverWidget.background#0d1117
- editorHoverWidget.border#21262d
- editorIndentGuide.activeBackground#3d4451
- editorIndentGuide.background#21262d
- editorLineNumber.activeForeground#7d8590
- editorLineNumber.foreground#3d4451
- editorRuler.foreground#21262d
- editorSuggestWidget.background#0d1117
- editorSuggestWidget.border#21262d
- editorSuggestWidget.foreground#e6edf3
- editorSuggestWidget.highlightForeground#4ade80
- editorSuggestWidget.selectedBackground#1c3a5e
- editorWhitespace.foreground#2d3139
- editorWidget.background#0d1117
- editorWidget.border#21262d
- gitDecoration.conflictingResourceForeground#fbbf24
- gitDecoration.deletedResourceForeground#f87171
- gitDecoration.ignoredResourceForeground#7d8590
- gitDecoration.modifiedResourceForeground#60a5fa
- gitDecoration.submoduleResourceForeground#c084fc
- gitDecoration.untrackedResourceForeground#4ade80
- input.background#0d1117
- input.border#21262d
- input.foreground#e6edf3
- input.placeholderForeground#7d8590
- inputOption.activeBorder#4ade80
- inputValidation.errorBackground#0d1117
- inputValidation.errorBorder#f87171
- inputValidation.warningBackground#0d1117
- inputValidation.warningBorder#fbbf24
- list.activeSelectionBackground#1c3a5e
- list.activeSelectionForeground#e6edf3
- list.errorForeground#f87171
- list.focusBackground#1c3a5e
- list.focusForeground#e6edf3
- list.highlightForeground#4ade80
- list.hoverBackground#12141a
- list.hoverForeground#e6edf3
- list.inactiveSelectionBackground#1c3a5e80
- list.inactiveSelectionForeground#e6edf3
- list.warningForeground#fbbf24
- merge.border#21262d
- merge.currentHeaderBackground#60a5fa40
- merge.incomingHeaderBackground#4ade8040
- notificationCenter.border#21262d
- notificationCenterHeader.background#0d1117
- notificationLink.foreground#4ade80
- notifications.background#0d1117
- notifications.border#21262d
- notifications.foreground#e6edf3
- panel.background#0a0c10
- panel.border#21262d
- panelTitle.activeBorder#4ade80
- panelTitle.activeForeground#e6edf3
- panelTitle.inactiveForeground#7d8590
- peekView.border#4ade80
- peekViewEditor.background#0d1117
- peekViewEditor.matchHighlightBackground#3d5a8080
- peekViewResult.background#06080c
- peekViewResult.matchHighlightBackground#3d5a8080
- peekViewResult.selectionBackground#1c3a5e
- peekViewTitle.background#06080c
- peekViewTitleDescription.foreground#7d8590
- peekViewTitleLabel.foreground#e6edf3
- progressBar.background#4ade80
- scrollbarSlider.activeBackground#3d445180
- scrollbarSlider.background#21262d80
- scrollbarSlider.hoverBackground#30363d80
- sideBar.background#06080c
- sideBar.border#21262d
- sideBar.foreground#c9d1d9
- sideBarSectionHeader.background#0a0c10
- sideBarSectionHeader.border#21262d
- sideBarSectionHeader.foreground#e6edf3
- sideBarTitle.foreground#e6edf3
- statusBar.background#06080c
- statusBar.border#21262d
- statusBar.debuggingBackground#f87171
- statusBar.debuggingForeground#ffffff
- statusBar.foreground#c9d1d9
- statusBar.noFolderBackground#06080c
- statusBarItem.prominentBackground#1c3a5e
- statusBarItem.remoteBackground#4ade80
- statusBarItem.remoteForeground#0a0c10
- tab.activeBackground#0a0c10
- tab.activeBorder#00000000
- tab.activeBorderTop#00000000
- tab.activeForeground#e6edf3
- tab.border#00000000
- tab.inactiveBackground#06080c
- tab.inactiveForeground#7d8590
- tab.unfocusedActiveBorder#00000000
- tab.unfocusedActiveBorderTop#00000000
- terminal.ansiBlack#21262d
- terminal.ansiBlue#60a5fa
- terminal.ansiBrightBlack#3d4451
- terminal.ansiBrightBlue#93c5fd
- terminal.ansiBrightCyan#67e8f9
- terminal.ansiBrightGreen#86efac
- terminal.ansiBrightMagenta#d8b4fe
- terminal.ansiBrightRed#fca5a5
- terminal.ansiBrightWhite#f0f6fc
- terminal.ansiBrightYellow#fcd34d
- terminal.ansiCyan#22d3ee
- terminal.ansiGreen#4ade80
- terminal.ansiMagenta#c084fc
- terminal.ansiRed#f87171
- terminal.ansiWhite#e6edf3
- terminal.ansiYellow#fbbf24
- terminal.background#0a0c10
- terminal.foreground#e6edf3
- titleBar.activeBackground#06080c
- titleBar.activeForeground#e6edf3
- titleBar.border#21262d
- titleBar.inactiveBackground#06080c
- titleBar.inactiveForeground#7d8590
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #6e7681 | italic |
| string, string.quoted, string.template | #4ade80 | — |
| constant.character.escape, constant.other.placeholder | #86efac | — |
| constant.numeric, constant.language.numeric | #60a5fa | — |
| constant.language, constant.other, variable.language.this, variable.language.super, variable.other.constant | #4ade80 | — |
| keyword, storage.type, storage.modifier | #c9d1d9 | |
| keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical | #b4bac5 | |
| keyword.operator, keyword.operator.arithmetic, keyword.operator.assignment, keyword.operator.comparison | #9ca3af | — |
| entity.name.function, support.function, meta.function-call | #e6edf3 | |
| entity.name.class, entity.name.type.class, support.class, entity.other.inherited-class | #f0f6fc | |
| entity.name.type, support.type, entity.name.type.interface | #e6edf3 | — |
| variable, meta.definition.variable, entity.name.variable | #c9d1d9 | — |
| variable.parameter, meta.parameters | #b4bac5 | — |
| variable.other.property, variable.other.object.property, support.variable.property | #c9d1d9 | — |
| entity.name.tag, meta.tag | #e6edf3 | — |
| entity.other.attribute-name, meta.attribute | #9ca3af | — |
| meta.decorator, punctuation.decorator | #fbbf24 | — |
| punctuation, meta.brace, punctuation.definition.block, punctuation.section | #7d8590 | — |
| punctuation.separator, punctuation.terminator | #6e7681 | — |
| support.type.property-name.json, meta.object-literal.key | #c9d1d9 | — |
| entity.name.tag.css, entity.other.attribute-name.class.css, entity.other.attribute-name.id.css | #e6edf3 | — |
| support.type.property-name.css | #c9d1d9 | — |
| variable.language.special.self.python | #4ade80 | italic |
| entity.name.function.decorator.python | #fbbf24 | — |
| support.function.magic.python | #c084fc | italic |
| keyword.control.import, keyword.control.export, keyword.control.from | #b4bac5 | — |
| entity.name.type.ts, entity.name.type.tsx | #e6edf3 | — |
| support.class.component.tsx, support.class.component.jsx | #f0f6fc | — |
| invalid, invalid.illegal, invalid.deprecated | #f87171 | underline |
| markup.heading, entity.name.section.markdown | #e6edf3 | bold |
| markup.bold | #e6edf3 | bold |
| markup.italic | #e6edf3 | italic |
| markup.underline.link, string.other.link.title.markdown | #4ade80 | — |
| markup.inline.raw, markup.fenced_code.block.markdown | #60a5fa | — |