Lumex-R — Theme & Icon Customizer

Color themes

• 

  Lumex Dark

• 

  Lumex Light

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#6D5CEC
• activityBar.background#F8FAFC
• activityBar.border#E2E8F0
• activityBar.foreground#1E293B
• activityBar.inactiveForeground#CBD5E1
• activityBarBadge.background#6D5CEC
• activityBarBadge.foreground#FFFFFF
• badge.background#6D5CEC
• badge.foreground#FFFFFF
• breadcrumb.activeSelectionForeground#6D5CEC
• breadcrumb.focusForeground#1E293B
• breadcrumb.foreground#64748B
• button.background#6D5CEC
• button.foreground#FFFFFF
• button.hoverBackground#5B4ADA
• button.secondaryBackground#F1F5F9
• button.secondaryForeground#1E293B
• descriptionForeground#64748B
• diffEditor.insertedLineBackground#16A34A11
• diffEditor.insertedTextBackground#16A34A22
• diffEditor.removedLineBackground#DC262611
• diffEditor.removedTextBackground#DC262622
• disabledForeground#CBD5E1
• dropdown.background#F1F5F9
• dropdown.border#E2E8F0
• dropdown.foreground#1E293B
• editor.background#FFFFFF
• editor.findMatchBackground#D9770644
• editor.findMatchHighlightBackground#D9770622
• editor.foreground#1E293B
• editor.inactiveSelectionBackground#F1F5F9
• editor.lineHighlightBackground#F8FAFC
• editor.selectionBackground#6D5CEC33
• editor.selectionHighlightBackground#6D5CEC18
• editorBracketHighlight.foreground1#6D5CEC
• editorBracketHighlight.foreground2#0EA5E9
• editorBracketHighlight.foreground3#DB2777
• editorBracketHighlight.foreground4#16A34A
• editorBracketHighlight.foreground5#D97706
• editorBracketHighlight.foreground6#2563EB
• editorBracketMatch.background#6D5CEC22
• editorBracketMatch.border#6D5CEC
• editorCursor.foreground#6D5CEC
• editorError.foreground#DC2626
• editorGroupHeader.tabsBackground#F1F5F9
• editorGutter.background#FFFFFF
• editorHint.foreground#16A34A
• editorIndentGuide.activeBackground1#CBD5E1
• editorIndentGuide.background1#E2E8F0
• editorInfo.foreground#2563EB
• editorLineNumber.activeForeground#64748B
• editorLineNumber.foreground#CBD5E1
• editorOverviewRuler.border#E2E8F0
• editorRuler.foreground#E2E8F0
• editorWarning.foreground#D97706
• editorWhitespace.foreground#CBD5E133
• errorForeground#DC2626
• focusBorder#6D5CEC
• foreground#1E293B
• gitDecoration.addedResourceForeground#16A34A
• gitDecoration.conflictingResourceForeground#DB2777
• gitDecoration.deletedResourceForeground#DC2626
• gitDecoration.ignoredResourceForeground#CBD5E1
• gitDecoration.modifiedResourceForeground#D97706
• gitDecoration.untrackedResourceForeground#0891B2
• input.background#F1F5F9
• input.border#E2E8F0
• input.foreground#1E293B
• input.placeholderForeground#CBD5E1
• inputOption.activeBackground#6D5CEC22
• inputOption.activeBorder#6D5CEC
• list.activeSelectionBackground#6D5CEC22
• list.activeSelectionForeground#1E293B
• list.errorForeground#DC2626
• list.focusBackground#6D5CEC18
• list.highlightForeground#6D5CEC
• list.hoverBackground#F1F5F980
• list.inactiveSelectionBackground#F1F5F9
• list.warningForeground#D97706
• menu.background#F1F5F9
• menu.border#E2E8F0
• menu.foreground#1E293B
• menu.selectionBackground#6D5CEC22
• menu.separatorBackground#E2E8F0
• notifications.background#F1F5F9
• notifications.border#E2E8F0
• notifications.foreground#1E293B
• panel.background#FFFFFF
• panel.border#E2E8F0
• panelTitle.activeBorder#6D5CEC
• panelTitle.activeForeground#1E293B
• panelTitle.inactiveForeground#64748B
• peekView.border#6D5CEC
• peekViewEditor.background#F8FAFC
• peekViewResult.background#F1F5F9
• peekViewTitle.background#F1F5F9
• peekViewTitleDescription.foreground#64748B
• peekViewTitleLabel.foreground#1E293B
• scrollbarSlider.activeBackground#6D5CEC88
• scrollbarSlider.background#CBD5E166
• scrollbarSlider.hoverBackground#CBD5E1AA
• sideBar.background#F8FAFC
• sideBar.border#E2E8F0
• sideBar.foreground#1E293B
• sideBarSectionHeader.background#F8FAFC
• sideBarSectionHeader.border#E2E8F0
• sideBarSectionHeader.foreground#64748B
• sideBarTitle.foreground#64748B
• statusBar.background#F8FAFC
• statusBar.border#E2E8F0
• statusBar.foreground#64748B
• statusBarItem.remoteBackground#6D5CEC
• statusBarItem.remoteForeground#FFFFFF
• tab.activeBackground#FFFFFF
• tab.activeBorder#6D5CEC
• tab.activeBorderTop#6D5CEC
• tab.activeForeground#1E293B
• tab.border#E2E8F0
• tab.inactiveBackground#F1F5F9
• tab.inactiveForeground#64748B
• terminal.ansiBlack#64748B
• terminal.ansiBlue#2563EB
• terminal.ansiBrightBlack#94A3B8
• terminal.ansiCyan#0891B2
• terminal.ansiGreen#16A34A
• terminal.ansiMagenta#DB2777
• terminal.ansiRed#DC2626
• terminal.ansiWhite#1E293B
• terminal.ansiYellow#D97706
• terminal.background#FFFFFF
• terminal.foreground#1E293B
• terminalCursor.foreground#6D5CEC
• textBlockQuote.background#F1F5F9
• textBlockQuote.border#6D5CEC
• textCodeBlock.background#F1F5F9
• textLink.activeForeground#0EA5E9
• textLink.foreground#6D5CEC
• titleBar.activeBackground#F8FAFC
• titleBar.activeForeground#1E293B
• titleBar.border#E2E8F0
• titleBar.inactiveBackground#F8FAFC
• titleBar.inactiveForeground#64748B

tokenColors

TextMate scopes and font styles (syntax highlighting rules).