Nocturne Panda
Publisher: r-seizeThemes in package: 1
A VS Code light theme — pure white background, crisp black UI, vivid syntax colors. The panda's contrast: monochrome shell, colorful world inside.
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#bbbbbb
- activityBar.border#aaaaaa
- activityBar.foreground#1a1a1a
- activityBar.inactiveForeground#888888
- activityBarBadge.background#000000
- activityBarBadge.foreground#ffffff
- badge.background#000000
- badge.foreground#ffffff
- breadcrumb.activeSelectionForeground#000000
- breadcrumb.background#d4d4d4
- breadcrumb.focusForeground#000000
- breadcrumb.foreground#aaaaaa
- breadcrumbPicker.background#d0d0d0
- button.background#000000
- button.foreground#ffffff
- button.hoverBackground#333333
- button.secondaryBackground#efefef
- button.secondaryForeground#1a1a1a
- descriptionForeground#999999
- diffEditor.insertedLineBackground#05966908
- diffEditor.insertedTextBackground#05966915
- diffEditor.removedLineBackground#dc262608
- diffEditor.removedTextBackground#dc262615
- dropdown.background#d0d0d0
- dropdown.border#c8c8c8
- dropdown.foreground#1e293b
- editor.background#d4d4d4
- editor.findMatchBackground#00000025
- editor.findMatchHighlightBackground#00000015
- editor.foreground#1e293b
- editor.inactiveSelectionBackground#c0c0c0
- editor.lineHighlightBackground#c8c8c8
- editor.lineHighlightBorder#00000000
- editor.rangeHighlightBackground#00000008
- editor.selectionBackground#aaaaaa
- editor.selectionHighlightBackground#b4b4b480
- editor.wordHighlightBackground#c0c0c080
- editor.wordHighlightStrongBackground#aaaaaa80
- editorBracketHighlight.foreground1#000000
- editorBracketHighlight.foreground2#7c3aed
- editorBracketHighlight.foreground3#0ea5e9
- editorBracketHighlight.foreground4#059669
- editorBracketHighlight.foreground5#db2777
- editorBracketHighlight.foreground6#d97706
- editorBracketMatch.background#d8d8d8
- editorBracketMatch.border#555555
- editorCursor.foreground#000000
- editorError.foreground#dc2626
- editorGroupHeader.tabsBackground#c8c8c8
- editorGroupHeader.tabsBorder#bbbbbb
- editorGutter.addedBackground#05966980
- editorGutter.deletedBackground#dc262680
- editorGutter.modifiedBackground#2563eb80
- editorHint.foreground#059669
- editorHoverWidget.background#d0d0d0
- editorHoverWidget.border#b8b8b8
- editorIndentGuide.activeBackground1#aaaaaa
- editorIndentGuide.background1#d8d8d8
- editorInfo.foreground#2563eb
- editorLineNumber.activeForeground#888888
- editorLineNumber.foreground#c4c4c4
- editorRuler.foreground#d4d4d4
- editorSuggestWidget.background#d0d0d0
- editorSuggestWidget.border#b8b8b8
- editorSuggestWidget.foreground#1e293b
- editorSuggestWidget.highlightForeground#000000
- editorSuggestWidget.selectedBackground#c0c0c0
- editorWarning.foreground#d97706
- editorWhitespace.foreground#d0d0d0
- editorWidget.background#d0d0d0
- editorWidget.border#b8b8b8
- errorForeground#dc2626
- focusBorder#000000
- foreground#1e293b
- gitDecoration.addedResourceForeground#059669
- gitDecoration.conflictingResourceForeground#d97706
- gitDecoration.deletedResourceForeground#dc2626
- gitDecoration.ignoredResourceForeground#cccccc
- gitDecoration.modifiedResourceForeground#2563eb
- gitDecoration.untrackedResourceForeground#7c3aed
- icon.foreground#1a1a1a
- input.background#d0d0d0
- input.border#c8c8c8
- input.foreground#1e293b
- input.placeholderForeground#aaaaaa
- inputOption.activeBackground#d4d4d4
- inputOption.activeBorder#000000
- inputValidation.errorBackground#dc262610
- inputValidation.errorBorder#dc2626
- inputValidation.warningBackground#d9770610
- inputValidation.warningBorder#d97706
- list.activeSelectionBackground#d4d4d4
- list.activeSelectionForeground#000000
- list.errorForeground#dc2626
- list.focusBackground#d4d4d4
- list.focusForeground#000000
- list.highlightForeground#000000
- list.hoverBackground#f0f0f0
- list.hoverForeground#1a1a1a
- list.inactiveSelectionBackground#efefef
- list.inactiveSelectionForeground#555555
- list.warningForeground#d97706
- menu.background#d0d0d0
- menu.foreground#1e293b
- menu.selectionBackground#d8d8d8
- menu.selectionForeground#000000
- menu.separatorBackground#d0d0d0
- menubar.selectionBackground#d4d4d4
- menubar.selectionForeground#000000
- minimap.errorHighlight#dc2626
- minimap.selectionHighlight#00000040
- minimap.warningHighlight#d97706
- minimapSlider.activeBackground#00000050
- minimapSlider.background#00000015
- minimapSlider.hoverBackground#00000030
- notificationCenter.border#d4d4d4
- notificationCenterHeader.background#f5f5f5
- notificationCenterHeader.foreground#1a1a1a
- notifications.background#d4d4d4
- notifications.border#d4d4d4
- notifications.foreground#1e293b
- notificationsErrorIcon.foreground#dc2626
- notificationsInfoIcon.foreground#2563eb
- notificationsWarningIcon.foreground#d97706
- panel.background#c8c8c8
- panel.border#bbbbbb
- panelTitle.activeBorder#000000
- panelTitle.activeForeground#000000
- panelTitle.inactiveForeground#999999
- peekView.border#000000
- peekViewEditor.background#d4d4d4
- peekViewEditor.matchHighlightBackground#00000020
- peekViewResult.background#d4d4d4
- peekViewResult.matchHighlightBackground#00000015
- peekViewTitle.background#d4d4d4
- peekViewTitleDescription.foreground#555555
- peekViewTitleLabel.foreground#1a1a1a
- pickerGroup.border#d8d8d8
- pickerGroup.foreground#555555
- progressBar.background#000000
- quickInput.background#d0d0d0
- quickInput.foreground#1e293b
- quickInputHighlightForeground#000000
- quickInputList.focusBackground#d4d4d4
- scrollbar.shadow#00000015
- scrollbarSlider.activeBackground#00000050
- scrollbarSlider.background#00000018
- scrollbarSlider.hoverBackground#00000030
- selection.background#c8c8c8
- sideBar.background#c8c8c8
- sideBar.border#bbbbbb
- sideBar.foreground#444444
- sideBarSectionHeader.background#c0c0c0
- sideBarSectionHeader.border#bbbbbb
- sideBarSectionHeader.foreground#1a1a1a
- sideBarTitle.foreground#1a1a1a
- statusBar.background#000000
- statusBar.border#000000
- statusBar.debuggingBackground#333333
- statusBar.debuggingForeground#ffffff
- statusBar.foreground#ffffff
- statusBar.noFolderBackground#1a1a1a
- statusBarItem.activeBackground#333333
- statusBarItem.hoverBackground#222222
- tab.activeBackground#d4d4d4
- tab.activeBorder#000000
- tab.activeForeground#000000
- tab.border#bbbbbb
- tab.inactiveBackground#c4c4c4
- tab.inactiveForeground#777777
- tab.unfocusedActiveForeground#555555
- tab.unfocusedInactiveForeground#aaaaaa
- terminal.ansiBlack#1a1a1a
- terminal.ansiBlue#2563eb
- terminal.ansiBrightBlack#555555
- terminal.ansiBrightBlue#3b82f6
- terminal.ansiBrightCyan#38bdf8
- terminal.ansiBrightGreen#10b981
- terminal.ansiBrightMagenta#8b5cf6
- terminal.ansiBrightRed#ef4444
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#f59e0b
- terminal.ansiCyan#0ea5e9
- terminal.ansiGreen#059669
- terminal.ansiMagenta#7c3aed
- terminal.ansiRed#dc2626
- terminal.ansiWhite#e5e7eb
- terminal.ansiYellow#d97706
- terminal.background#1a1a1a
- terminal.foreground#f0f0f0
- terminal.selectionBackground#ffffff30
- terminalCursor.background#1a1a1a
- terminalCursor.foreground#ffffff
- textLink.activeForeground#1d4ed8
- textLink.foreground#2563eb
- titleBar.activeBackground#c8c8c8
- titleBar.activeForeground#1a1a1a
- titleBar.border#bbbbbb
- titleBar.inactiveBackground#c0c0c0
- titleBar.inactiveForeground#777777
- widget.shadow#00000018
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #94a3b8 | italic |
| string, string.quoted, string.template | #d97706 | — |
| punctuation.definition.string.begin, punctuation.definition.string.end | #b45309 | — |
| string.regexp | #0ea5e9 | — |
| constant.numeric | #2563eb | — |
| storage.type | #7c3aed | — |
| storage.modifier | #7c3aed | — |
| keyword, keyword.control | #db2777 | — |
| keyword.operator | #0284c7 | — |
| entity.name.function, support.function, support.function.builtin.shell, entity.name.function.shell | #0ea5e9 | — |
| meta.function-call.generic | #0ea5e9 | — |
| entity.name.type, entity.name.class, support.type, support.class | #059669 | — |
| entity.name.type.interface | #059669 | italic |
| constant.language | #dc2626 | — |
| constant.other, variable.other.constant | #dc2626 | — |
| variable.other.enummember | #dc2626 | — |
| variable, variable.other, variable.other.readwrite, variable.other.readwrite.shell | #1e293b | — |
| variable.other.normal.shell, variable.other.special.shell, punctuation.definition.variable.shell | #059669 | — |
| variable.other.property, variable.other.object.property, meta.object-literal.key, support.type.property-name | #6d28d9 | — |
| variable.parameter | #6d28d9 | italic |
| variable.language.this, variable.language.self, variable.parameter.function.language.special.self.python, variable.parameter.function.language.special.cls.python | #0284c7 | italic |
| punctuation | #94a3b8 | — |
| punctuation.definition.block, punctuation.section.block, meta.brace | #64748b | — |
| punctuation.definition.tag | #94a3b8 | — |
| entity.name.tag | #db2777 | — |
| entity.other.attribute-name | #7c3aed | — |
| entity.other.attribute-name.id | #0ea5e9 | — |
| entity.other.attribute-name.class | #059669 | — |
| entity.name.tag.css | #db2777 | — |
| entity.other.attribute-name.class.css | #059669 | — |
| entity.other.attribute-name.id.css | #0ea5e9 | — |
| support.type.property-name.css | #7c3aed | — |
| support.constant.property-value.css, support.constant.color.w3c-standard-color-name.css, keyword.other.unit.css | #d97706 | — |
| constant.numeric.css | #2563eb | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css | #0284c7 | — |
| support.type.property-name.json | #7c3aed | — |
| entity.name.tag.yaml | #7c3aed | — |
| entity.name.type.anchor.yaml, variable.other.alias.yaml | #0284c7 | — |
| entity.name.namespace, entity.name.module | #64748b | — |
| meta.decorator punctuation.decorator, entity.name.function.decorator, punctuation.definition.decorator | #dc2626 | — |
| punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php | #0284c7 | — |
| markup.heading.1, punctuation.definition.heading.markdown | #000000 | bold |
| markup.heading.2, markup.heading.3, markup.heading.4, markup.heading.5, markup.heading.6 | #555555 | bold |
| markup.bold | #000000 | bold |
| markup.italic | #555555 | italic |
| markup.inline.raw, markup.raw.block | #d97706 | — |
| markup.underline.link | #2563eb | underline |
| string.other.link.title.markdown | #0ea5e9 | — |
| markup.quote | #94a3b8 | italic |
| invalid | #dc2626 | underline |
| invalid.deprecated | #d97706 | underline |