Modern Themes
Publisher: Hüsamettin UlutaşThemes in package: 24
24 handcrafted modern color themes plus a coding font picker that can install bundled open-source fonts for you. Every color is solved for WCAG contrast.
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.activeBackground#3584de1a
- activityBar.activeBorder#3584de
- activityBar.background#0d0f14
- activityBar.border#252b3700
- activityBar.foreground#c1c5cd
- activityBar.inactiveForeground#59647b
- activityBarBadge.background#3584de
- activityBarBadge.foreground#14181f
- activityBarTop.activeBorder#3584de
- activityBarTop.foreground#c1c5cd
- activityBarTop.inactiveForeground#59647b
- badge.background#3584de
- badge.foreground#14181f
- banner.background#232834
- banner.foreground#c1c5cd
- banner.iconForeground#3785df
- breadcrumb.activeSelectionForeground#3785df
- breadcrumb.background#161a22
- breadcrumb.focusForeground#c1c5cd
- breadcrumb.foreground#5e6a82
- breadcrumbPicker.background#1e232c
- button.background#3584de
- button.border#3584de00
- button.foreground#14181f
- button.hoverBackground#5094e2
- button.secondaryBackground#232834
- button.secondaryForeground#c1c5cd
- button.secondaryHoverBackground#2b3240
- charts.blue#4386d3
- charts.foreground#c1c5cd
- charts.green#27a562
- charts.lines#5e6a82
- charts.orange#b8892b
- charts.purple#dc68b5
- charts.red#db646c
- charts.yellow#ab8428
- checkbox.background#1e232c
- checkbox.border#353e50
- checkbox.foreground#c1c5cd
- debugConsole.errorForeground#db646c
- debugConsole.infoForeground#428ce0
- debugConsole.sourceForeground#838ea2
- debugConsole.warningForeground#ab8428
- debugConsoleInputIcon.foreground#3785df
- debugExceptionWidget.background#32242c
- debugExceptionWidget.border#db646c
- debugIcon.breakpointDisabledForeground#db646c80
- debugIcon.breakpointForeground#db646c
- debugIcon.continueForeground#27a562
- debugIcon.pauseForeground#428ce0
- debugIcon.restartForeground#27a562
- debugIcon.startForeground#27a562
- debugIcon.stepIntoForeground#428ce0
- debugIcon.stepOutForeground#428ce0
- debugIcon.stepOverForeground#428ce0
- debugIcon.stopForeground#db646c
- debugTokenExpression.boolean#dc68b5
- debugTokenExpression.error#db646c
- debugTokenExpression.name#6794c8
- debugTokenExpression.number#b8892b
- debugTokenExpression.string#27a566
- debugTokenExpression.value#27a566
- debugToolBar.background#1e232c
- debugToolBar.border#252b37
- descriptionForeground#838ea2
- diffEditor.diagonalFill#252b37
- diffEditor.insertedLineBackground#2aa25c17
- diffEditor.insertedTextBackground#2aa25c24
- diffEditor.removedLineBackground#d45f5717
- diffEditor.removedTextBackground#d45f5724
- diffEditorOverview.insertedForeground#2aa25c99
- diffEditorOverview.removedForeground#d45f5799
- dropdown.background#1e232c
- dropdown.border#252b37
- dropdown.foreground#c1c5cd
- dropdown.listBackground#1e232c
- editor.background#161a22
- editor.findMatchBackground#cf9a3052
- editor.findMatchBorder#d3a445b3
- editor.findMatchHighlightBackground#cf9a302e
- editor.findRangeHighlightBackground#3584de21
- editor.focusedStackFrameHighlightBackground#27a5622e
- editor.foldBackground#3584de14
- editor.foreground#c1c5cd
- editor.hoverHighlightBackground#3584de24
- editor.inactiveSelectionBackground#3584de21
- editor.lineHighlightBackground#ffffff0b
- editor.lineHighlightBorder#3584de00
- editor.rangeHighlightBackground#3584de21
- editor.selectionBackground#3584de3d
- editor.selectionHighlightBackground#3584de21
- editor.selectionHighlightBorder#3584de00
- editor.stackFrameHighlightBackground#ab842829
- editor.wordHighlightBackground#3584de24
- editor.wordHighlightStrongBackground#3584de38
- editorBracketHighlight.foreground1#4386d3
- editorBracketHighlight.foreground2#a77d27
- editorBracketHighlight.foreground3#27a5a1
- editorBracketHighlight.foreground4#d64fa9
- editorBracketHighlight.foreground5#27a566
- editorBracketHighlight.foreground6#d65d51
- editorBracketHighlight.unexpectedBracket.foreground#db646c
- editorBracketMatch.background#3584de29
- editorBracketMatch.border#3584de8c
- editorCodeLens.foreground#5e6a82
- editorCursor.background#161a22
- editorCursor.foreground#3785df
- editorError.foreground#db646c
- editorGhostText.foreground#566176
- editorGroup.border#252b37
- editorGroup.dropBackground#3584de29
- editorGroupHeader.border#252b3700
- editorGroupHeader.noTabsBackground#0d0f14
- editorGroupHeader.tabsBackground#0d0f14
- editorGroupHeader.tabsBorder#252b3700
- editorGutter.addedBackground#2aa25c
- editorGutter.background#161a22
- editorGutter.deletedBackground#d45f57
- editorGutter.foldingControlForeground#838ea2
- editorGutter.modifiedBackground#a67d2b
- editorHint.foreground#5e6a82
- editorHoverWidget.background#1e232c
- editorHoverWidget.border#252b37
- editorHoverWidget.foreground#c1c5cd
- editorHoverWidget.statusBarBackground#232834
- editorIndentGuide.activeBackground1#3d475c
- editorIndentGuide.background1#232834
- editorInfo.foreground#428ce0
- editorInlayHint.background#3584de1a
- editorInlayHint.foreground#5e6a82
- editorLineNumber.activeForeground#3785df
- editorLineNumber.foreground#566176
- editorLink.activeForeground#3785df
- editorOverviewRuler.addedForeground#2aa25c
- editorOverviewRuler.border#252b3700
- editorOverviewRuler.bracketMatchForeground#3584de66
- editorOverviewRuler.deletedForeground#d45f57
- editorOverviewRuler.errorForeground#db646c
- editorOverviewRuler.findMatchForeground#d3a445b3
- editorOverviewRuler.infoForeground#428ce0
- editorOverviewRuler.modifiedForeground#a67d2b
- editorOverviewRuler.selectionHighlightForeground#3584de66
- editorOverviewRuler.warningForeground#ab8428
- editorRuler.foreground#212631
- editorStickyScroll.background#11141a
- editorStickyScrollHover.background#232834
- editorSuggestWidget.background#1e232c
- editorSuggestWidget.border#252b37
- editorSuggestWidget.focusHighlightForeground#5094e2
- editorSuggestWidget.foreground#c1c5cd
- editorSuggestWidget.highlightForeground#3785df
- editorSuggestWidget.selectedBackground#3584de2e
- editorSuggestWidget.selectedForeground#c1c5cd
- editorWarning.foreground#ab8428
- editorWhitespace.foreground#56617680
- editorWidget.background#1e232c
- editorWidget.border#252b37
- editorWidget.foreground#c1c5cd
- errorForeground#db646c
- extensionBadge.remoteBackground#3584de
- extensionBadge.remoteForeground#14181f
- extensionButton.prominentBackground#3584de
- extensionButton.prominentForeground#14181f
- extensionButton.prominentHoverBackground#5094e2
- extensionIcon.preReleaseForeground#dc68b5
- extensionIcon.starForeground#b8892b
- extensionIcon.verifiedForeground#27a562
- focusBorder#3584de99
- foreground#c1c5cd
- gitDecoration.addedResourceForeground#2aa25c
- gitDecoration.conflictingResourceForeground#cd4ecd
- gitDecoration.deletedResourceForeground#d45f57
- gitDecoration.ignoredResourceForeground#5e6a82
- gitDecoration.modifiedResourceForeground#a67d2b
- gitDecoration.renamedResourceForeground#339933
- gitDecoration.stageDeletedResourceForeground#d45f57
- gitDecoration.stageModifiedResourceForeground#a67d2b
- gitDecoration.submoduleResourceForeground#9e6ecf
- gitDecoration.untrackedResourceForeground#339933
- icon.foreground#838ea2
- input.background#1d212b
- input.border#252b37
- input.foreground#c1c5cd
- input.placeholderForeground#5e6a82
- inputOption.activeBackground#3584de3d
- inputOption.activeBorder#3584de80
- inputOption.activeForeground#c1c5cd
- inputValidation.errorBackground#36262e
- inputValidation.errorBorder#db646c
- inputValidation.errorForeground#c1c5cd
- inputValidation.infoBackground#1d2c40
- inputValidation.infoBorder#428ce0
- inputValidation.infoForeground#c1c5cd
- inputValidation.warningBackground#2e2b23
- inputValidation.warningBorder#ab8428
- inputValidation.warningForeground#c1c5cd
- keybindingLabel.background#5e6a8224
- keybindingLabel.border#5e6a8229
- keybindingLabel.bottomBorder#5e6a8238
- keybindingLabel.foreground#c1c5cd
- list.activeSelectionBackground#3584de33
- list.activeSelectionForeground#c1c5cd
- list.activeSelectionIconForeground#3785df
- list.dropBackground#3584de29
- list.errorForeground#db646c
- list.focusBackground#3584de33
- list.focusForeground#c1c5cd
- list.focusHighlightForeground#5094e2
- list.focusOutline#3584de00
- list.highlightForeground#3785df
- list.hoverBackground#5e6a821a
- list.hoverForeground#c1c5cd
- list.inactiveSelectionBackground#3584de1c
- list.inactiveSelectionForeground#c1c5cd
- list.warningForeground#ab8428
- listFilterWidget.background#1e232c
- listFilterWidget.noMatchesOutline#db646c
- listFilterWidget.outline#3584de
- menu.background#1e232c
- menu.border#252b37
- menu.foreground#c1c5cd
- menu.selectionBackground#3584de33
- menu.selectionForeground#c1c5cd
- menu.separatorBackground#252b37
- menubar.selectionBackground#5e6a8224
- menubar.selectionForeground#c1c5cd
- merge.border#252b3700
- merge.commonContentBackground#5e6a821f
- merge.commonHeaderBackground#5e6a8240
- merge.currentContentBackground#2aa25c24
- merge.currentHeaderBackground#2aa25c4d
- merge.incomingContentBackground#428ce024
- merge.incomingHeaderBackground#428ce04d
- minimap.background#161a22
- minimap.errorHighlight#db646c
- minimap.findMatchHighlight#cf9a30b3
- minimap.selectionHighlight#3584de80
- minimap.warningHighlight#ab8428
- minimapGutter.addedBackground#2aa25c
- minimapGutter.deletedBackground#d45f57
- minimapGutter.modifiedBackground#a67d2b
- minimapSlider.activeBackground#5e6a8242
- minimapSlider.background#5e6a821a
- minimapSlider.hoverBackground#5e6a822e
- notificationCenter.border#252b37
- notificationCenterHeader.background#232834
- notificationCenterHeader.foreground#c1c5cd
- notificationLink.foreground#3785df
- notifications.background#1e232c
- notifications.border#252b37
- notifications.foreground#c1c5cd
- notificationsErrorIcon.foreground#db646c
- notificationsInfoIcon.foreground#428ce0
- notificationsWarningIcon.foreground#ab8428
- notificationToast.border#252b37
- panel.background#11141a
- panel.border#252b37
- panel.dropBorder#3584de
- panelInput.border#252b37
- panelSection.border#252b37
- panelSectionHeader.background#11141a
- panelSectionHeader.foreground#c1c5cd
- panelTitle.activeBorder#3584de
- panelTitle.activeForeground#c1c5cd
- panelTitle.inactiveForeground#5b677e
- peekView.border#3584de8c
- peekViewEditor.background#12151c
- peekViewEditor.matchHighlightBackground#cf9a3052
- peekViewResult.background#11141a
- peekViewResult.fileForeground#c1c5cd
- peekViewResult.foreground#c1c5cd
- peekViewResult.lineForeground#838ea2
- peekViewResult.matchHighlightBackground#cf9a3052
- peekViewResult.selectionBackground#3584de2e
- peekViewResult.selectionForeground#c1c5cd
- peekViewTitle.background#11141a
- peekViewTitleDescription.foreground#838ea2
- peekViewTitleLabel.foreground#c1c5cd
- pickerGroup.border#252b37
- pickerGroup.foreground#3785df
- ports.iconRunningProcessForeground#27a562
- problemsErrorIcon.foreground#db646c
- problemsInfoIcon.foreground#428ce0
- problemsWarningIcon.foreground#ab8428
- progressBar.background#3584de
- quickInput.background#1e232c
- quickInput.foreground#c1c5cd
- quickInputList.focusBackground#3584de33
- quickInputList.focusForeground#c1c5cd
- quickInputList.focusIconForeground#3785df
- quickInputTitle.background#232834
- sash.hoverBorder#3584de80
- scrollbar.shadow#0607094d
- scrollbarSlider.activeBackground#5e6a8273
- scrollbarSlider.background#5e6a8233
- scrollbarSlider.hoverBackground#5e6a8252
- search.resultsInfoForeground#838ea2
- searchEditor.findMatchBackground#cf9a302e
- selection.background#3584de3d
- settings.checkboxBackground#1e232c
- settings.checkboxBorder#353e50
- settings.dropdownBackground#1e232c
- settings.dropdownBorder#252b37
- settings.focusedRowBackground#3584de12
- settings.headerForeground#c1c5cd
- settings.modifiedItemIndicator#3584de
- settings.numberInputBackground#1d212b
- settings.numberInputBorder#252b37
- settings.rowHoverBackground#5e6a820f
- settings.textInputBackground#1d212b
- settings.textInputBorder#252b37
- sideBar.background#11141a
- sideBar.border#252b3700
- sideBar.foreground#7f8a9f
- sideBarSectionHeader.background#11141a
- sideBarSectionHeader.border#252b3700
- sideBarSectionHeader.foreground#c1c5cd
- sideBarStickyScroll.background#11141a
- sideBarTitle.foreground#c1c5cd
- statusBar.background#0d0f14
- statusBar.border#252b3700
- statusBar.debuggingBackground#3584de
- statusBar.debuggingBorder#252b3700
- statusBar.debuggingForeground#14181f
- statusBar.foreground#7b869b
- statusBar.noFolderBackground#0d0f14
- statusBar.noFolderForeground#7b869b
- statusBarItem.activeBackground#5e6a8238
- statusBarItem.hoverBackground#5e6a8224
- statusBarItem.prominentBackground#3584de3d
- statusBarItem.prominentForeground#c1c5cd
- statusBarItem.prominentHoverBackground#3584de57
- statusBarItem.remoteBackground#3584de
- statusBarItem.remoteForeground#14181f
- symbolIcon.booleanForeground#dc68b5
- symbolIcon.classForeground#27a5a1
- symbolIcon.colorForeground#b58c38
- symbolIcon.constantForeground#b8892b
- symbolIcon.constructorForeground#5a95d8
- symbolIcon.enumeratorForeground#27a5a1
- symbolIcon.enumeratorMemberForeground#b8892b
- symbolIcon.fieldForeground#6794c8
- symbolIcon.fileForeground#838ea2
- symbolIcon.folderForeground#838ea2
- symbolIcon.functionForeground#5a95d8
- symbolIcon.interfaceForeground#27a5a1
- symbolIcon.keywordForeground#dc68b5
- symbolIcon.methodForeground#5a95d8
- symbolIcon.moduleForeground#dc7268
- symbolIcon.namespaceForeground#dc7268
- symbolIcon.numberForeground#b8892b
- symbolIcon.propertyForeground#6794c8
- symbolIcon.snippetForeground#b58c38
- symbolIcon.stringForeground#27a566
- symbolIcon.textForeground#838ea2
- symbolIcon.variableForeground#c1c5cd
- tab.activeBackground#161a22
- tab.activeBorder#161a2200
- tab.activeBorderTop#3584de
- tab.activeForeground#c1c5cd
- tab.activeModifiedBorder#a67d2b
- tab.border#252b3700
- tab.hoverBackground#11141a
- tab.hoverForeground#c1c5cd
- tab.inactiveBackground#0d0f14
- tab.inactiveForeground#59647b
- tab.inactiveModifiedBorder#a67d2b80
- tab.lastPinnedBorder#252b37
- tab.unfocusedActiveBackground#11141a
- tab.unfocusedActiveBorderTop#3584de59
- tab.unfocusedActiveForeground#838ea2
- tab.unfocusedInactiveForeground#566176
- terminal.ansiBlack#29303d
- terminal.ansiBlue#4386d3
- terminal.ansiBrightBlack#455168
- terminal.ansiBrightBlue#6ca1dd
- terminal.ansiBrightCyan#57b9b6
- terminal.ansiBrightGreen#57b988
- terminal.ansiBrightMagenta#df76bc
- terminal.ansiBrightRed#e17e85
- terminal.ansiBrightWhite#c1c5cd
- terminal.ansiBrightYellow#ba9a57
- terminal.ansiCyan#27a5a1
- terminal.ansiGreen#27a566
- terminal.ansiMagenta#d64fa9
- terminal.ansiRed#d85a62
- terminal.ansiWhite#7f8a9f
- terminal.ansiYellow#a77d27
- terminal.background#11141a
- terminal.border#252b37
- terminal.findMatchBackground#cf9a3052
- terminal.findMatchHighlightBackground#cf9a302e
- terminal.foreground#bbc0c9
- terminal.inactiveSelectionBackground#3584de21
- terminal.selectionBackground#3584de3d
- terminalCursor.background#11141a
- terminalCursor.foreground#3785df
- testing.iconErrored#db646c
- testing.iconFailed#db646c
- testing.iconPassed#27a562
- testing.iconQueued#ab8428
- testing.iconSkipped#5e6a82
- testing.iconUnset#5e6a82
- testing.message.error.decorationForeground#db646c
- testing.runAction#27a562
- textBlockQuote.background#11141a
- textBlockQuote.border#3584de80
- textCodeBlock.background#11141a
- textLink.activeForeground#5094e2
- textLink.foreground#3785df
- textPreformat.background#3584de1a
- textPreformat.foreground#27a566
- textSeparator.foreground#252b37
- titleBar.activeBackground#0d0f14
- titleBar.activeForeground#7b869b
- titleBar.border#252b3700
- titleBar.inactiveBackground#0d0f14
- titleBar.inactiveForeground#566176
- tree.inactiveIndentGuidesStroke#1f242e
- tree.indentGuidesStroke#272d3a
- walkThrough.embeddedEditorBackground#11141a
- welcomePage.background#161a22
- welcomePage.progress.background#252b37
- welcomePage.progress.foreground#3584de
- welcomePage.tileBackground#11141a
- welcomePage.tileHoverBackground#232834
- widget.border#252b37
- widget.shadow#06070970
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment, string.comment | #7684a0 | italic |
| comment.block.documentation storage.type, comment keyword | #7684a0 | italic bold |
| punctuation, meta.brace, punctuation.definition.parameters, punctuation.separator, punctuation.terminator | #838ea2 | — |
| variable, variable.other.readwrite, meta.definition.variable.name, support.variable, entity.name.variable | #c1c5cd | — |
| variable.parameter, meta.function.parameters variable | #caa8aa | italic |
| variable.language, variable.language.this, variable.other.constant | #dc7268 | italic |
| variable.other.property, meta.object-literal.key, support.type.property-name, variable.other.object.property | #6794c8 | — |
| keyword, keyword.control, keyword.other, storage, storage.type, storage.modifier, keyword.type | #dc68b5 | — |
| keyword.operator, punctuation.accessor, storage.type.function.arrow | #ba699f | — |
| keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.default | #dc68b5 | italic |
| string, string.quoted, punctuation.definition.string, string.template | #27a566 | — |
| punctuation.definition.template-expression, punctuation.section.embedded | #ba699f | — |
| string.regexp, constant.other.character-class.regexp, keyword.operator.quantifier.regexp | #21aba7 | — |
| constant.character.escape, constant.character | #dc7268 | — |
| constant.numeric, constant.language.numeric | #b8892b | — |
| constant, constant.language, constant.language.boolean, constant.language.null, constant.language.undefined, support.constant | #b8892b | — |
| entity.name.function, support.function, meta.function-call.generic, variable.function | #5a95d8 | — |
| entity.name.method, meta.method entity.name.function | #5a95d8 | — |
| entity.name.type, entity.name.class, entity.other.inherited-class, support.class, support.type, meta.type.annotation, entity.name.namespace | #27a5a1 | — |
| meta.decorator, entity.name.function.decorator, punctuation.decorator | #b58c38 | italic |
| entity.name.tag, punctuation.definition.tag, meta.tag | #dc7268 | — |
| support.class.component, entity.name.tag.custom | #27a5a1 | — |
| entity.other.attribute-name, meta.attribute | #b58c38 | italic |
| entity.name.selector, entity.other.attribute-name.class, entity.other.attribute-name.id | #27a5a1 | — |
| support.type.property-name.css, support.type.property-name.scss | #6794c8 | — |
| keyword.other.unit, constant.numeric.css | #b8892b | — |
| support.type.property-name.json, meta.structure.dictionary.json string.quoted.double | #6794c8 | — |
| entity.name.tag.yaml | #6794c8 | — |
| markup.heading, entity.name.section.markdown, punctuation.definition.heading | #5a95d8 | bold |
| markup.bold | #b8892b | bold |
| markup.italic | #dc68b5 | italic |
| markup.strikethrough | #7684a0 | strikethrough |
| markup.underline.link, string.other.link | #3785df | underline |
| markup.quote | #7684a0 | italic |
| markup.inline.raw, markup.fenced_code, markup.raw | #27a566 | — |
| markup.list punctuation.definition.list, beginning.punctuation.definition.list | #dc7268 | — |
| markup.inserted | #2aa25c | — |
| markup.deleted | #d45f57 | — |
| markup.changed | #a67d2b | — |
| invalid, invalid.illegal | #db646c | — |
| invalid.deprecated | #ab8428 | strikethrough |
| variable.other.normal.shell, string.interpolated.dollar.shell | #6794c8 | — |
| keyword.other.definition.ini, entity.name.section.ini | #6794c8 | — |
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.activeBackground#3f99ab1a
- activityBar.activeBorder#3f99ab
- activityBar.background#eceeef
- activityBar.border#dbdfe100
- activityBar.foreground#3b4042
- activityBar.inactiveForeground#7b868c
- activityBarBadge.background#3f99ab
- activityBarBadge.foreground#171a1c
- activityBarTop.activeBorder#3f99ab
- activityBarTop.foreground#3b4042
- activityBarTop.inactiveForeground#7b868c
- badge.background#3f99ab
- badge.foreground#171a1c
- banner.background#f5f6f7
- banner.foreground#3b4042
- banner.iconForeground#337b8a
- breadcrumb.activeSelectionForeground#337b8a
- breadcrumb.background#fbfbfc
- breadcrumb.focusForeground#3b4042
- breadcrumb.foreground#848f94
- breadcrumbPicker.background#fdfdfd
- button.background#3f99ab
- button.border#3f99ab00
- button.foreground#171a1c
- button.hoverBackground#378595
- button.secondaryBackground#f5f6f7
- button.secondaryForeground#3b4042
- button.secondaryHoverBackground#eceeef
- charts.blue#1d78b4
- charts.foreground#3b4042
- charts.green#147d45
- charts.lines#848f94
- charts.orange#915818
- charts.purple#b81e99
- charts.red#d3222e
- charts.yellow#8a6716
- checkbox.background#fdfdfd
- checkbox.border#c2c9cc
- checkbox.foreground#3b4042
- debugConsole.errorForeground#d3222e
- debugConsole.infoForeground#317684
- debugConsole.sourceForeground#626b6f
- debugConsole.warningForeground#8a6716
- debugConsoleInputIcon.foreground#337b8a
- debugExceptionWidget.background#f5dddf
- debugExceptionWidget.border#d3222e
- debugIcon.breakpointDisabledForeground#d3222e80
- debugIcon.breakpointForeground#d3222e
- debugIcon.continueForeground#147d45
- debugIcon.pauseForeground#317684
- debugIcon.restartForeground#147d45
- debugIcon.startForeground#147d45
- debugIcon.stepIntoForeground#317684
- debugIcon.stepOutForeground#317684
- debugIcon.stepOverForeground#317684
- debugIcon.stopForeground#d3222e
- debugTokenExpression.boolean#b81e99
- debugTokenExpression.error#d3222e
- debugTokenExpression.name#2d6b95
- debugTokenExpression.number#915818
- debugTokenExpression.string#137638
- debugTokenExpression.value#137638
- debugToolBar.background#fdfdfd
- debugToolBar.border#dbdfe1
- descriptionForeground#626b6f
- diffEditor.diagonalFill#dbdfe1
- diffEditor.insertedLineBackground#19834514
- diffEditor.insertedTextBackground#1983451f
- diffEditor.removedLineBackground#d6342914
- diffEditor.removedTextBackground#d634291f
- diffEditorOverview.insertedForeground#19834599
- diffEditorOverview.removedForeground#d6342999
- dropdown.background#fdfdfd
- dropdown.border#dbdfe1
- dropdown.foreground#3b4042
- dropdown.listBackground#fdfdfd
- editor.background#fbfbfc
- editor.findMatchBackground#db862447
- editor.findMatchBorder#df923ab3
- editor.findMatchHighlightBackground#db862429
- editor.findRangeHighlightBackground#3f99ab1c
- editor.focusedStackFrameHighlightBackground#147d452e
- editor.foldBackground#3f99ab14
- editor.foreground#3b4042
- editor.hoverHighlightBackground#3f99ab24
- editor.inactiveSelectionBackground#3f99ab1c
- editor.lineHighlightBackground#00000009
- editor.lineHighlightBorder#3f99ab00
- editor.rangeHighlightBackground#3f99ab1c
- editor.selectionBackground#3f99ab33
- editor.selectionHighlightBackground#3f99ab1c
- editor.selectionHighlightBorder#3f99ab00
- editor.stackFrameHighlightBackground#8a671629
- editor.wordHighlightBackground#3f99ab24
- editor.wordHighlightStrongBackground#3f99ab38
- editorBracketHighlight.foreground1#1d78b4
- editorBracketHighlight.foreground2#a2631a
- editorBracketHighlight.foreground3#15816f
- editorBracketHighlight.foreground4#cc21aa
- editorBracketHighlight.foreground5#15843e
- editorBracketHighlight.foreground6#dc2831
- editorBracketHighlight.unexpectedBracket.foreground#d3222e
- editorBracketMatch.background#3f99ab29
- editorBracketMatch.border#3f99ab8c
- editorCodeLens.foreground#848f94
- editorCursor.background#fbfbfc
- editorCursor.foreground#337b8a
- editorError.foreground#d3222e
- editorGhostText.foreground#929ba0
- editorGroup.border#dbdfe1
- editorGroup.dropBackground#3f99ab29
- editorGroupHeader.border#dbdfe100
- editorGroupHeader.noTabsBackground#eceeef
- editorGroupHeader.tabsBackground#eceeef
- editorGroupHeader.tabsBorder#dbdfe100
- editorGutter.addedBackground#198345
- editorGutter.background#fbfbfc
- editorGutter.deletedBackground#d63429
- editorGutter.foldingControlForeground#626b6f
- editorGutter.modifiedBackground#926a1c
- editorHint.foreground#848f94
- editorHoverWidget.background#fdfdfd
- editorHoverWidget.border#dbdfe1
- editorHoverWidget.foreground#3b4042
- editorHoverWidget.statusBarBackground#f5f6f7
- editorIndentGuide.activeBackground1#bcc4c7
- editorIndentGuide.background1#e3e6e8
- editorInfo.foreground#317684
- editorInlayHint.background#3f99ab1a
- editorInlayHint.foreground#848f94
- editorLineNumber.activeForeground#337b8a
- editorLineNumber.foreground#929ba0
- editorLink.activeForeground#337b8a
- editorOverviewRuler.addedForeground#198345
- editorOverviewRuler.border#dbdfe100
- editorOverviewRuler.bracketMatchForeground#3f99ab66
- editorOverviewRuler.deletedForeground#d63429
- editorOverviewRuler.errorForeground#d3222e
- editorOverviewRuler.findMatchForeground#df923ab3
- editorOverviewRuler.infoForeground#317684
- editorOverviewRuler.modifiedForeground#926a1c
- editorOverviewRuler.selectionHighlightForeground#3f99ab66
- editorOverviewRuler.warningForeground#8a6716
- editorRuler.foreground#e6e9ea
- editorStickyScroll.background#f2f4f5
- editorStickyScrollHover.background#f5f6f7
- editorSuggestWidget.background#fdfdfd
- editorSuggestWidget.border#dbdfe1
- editorSuggestWidget.focusHighlightForeground#378595
- editorSuggestWidget.foreground#3b4042
- editorSuggestWidget.highlightForeground#337b8a
- editorSuggestWidget.selectedBackground#3f99ab2e
- editorSuggestWidget.selectedForeground#3b4042
- editorWarning.foreground#8a6716
- editorWhitespace.foreground#929ba080
- editorWidget.background#fdfdfd
- editorWidget.border#dbdfe1
- editorWidget.foreground#3b4042
- errorForeground#d3222e
- extensionBadge.remoteBackground#3f99ab
- extensionBadge.remoteForeground#171a1c
- extensionButton.prominentBackground#3f99ab
- extensionButton.prominentForeground#171a1c
- extensionButton.prominentHoverBackground#378595
- extensionIcon.preReleaseForeground#b81e99
- extensionIcon.starForeground#915818
- extensionIcon.verifiedForeground#147d45
- focusBorder#3f99ab99
- foreground#3b4042
- gitDecoration.addedResourceForeground#198345
- gitDecoration.conflictingResourceForeground#c229c2
- gitDecoration.deletedResourceForeground#d63429
- gitDecoration.ignoredResourceForeground#848f94
- gitDecoration.modifiedResourceForeground#926a1c
- gitDecoration.renamedResourceForeground#238323
- gitDecoration.stageDeletedResourceForeground#d63429
- gitDecoration.stageModifiedResourceForeground#926a1c
- gitDecoration.submoduleResourceForeground#9152d1
- gitDecoration.untrackedResourceForeground#238323
- icon.foreground#626b6f
- input.background#f7f8f8
- input.border#dbdfe1
- input.foreground#3b4042
- input.placeholderForeground#848f94
- inputOption.activeBackground#3f99ab3d
- inputOption.activeBorder#3f99ab80
- inputOption.activeForeground#3b4042
- inputValidation.errorBackground#f5d8db
- inputValidation.errorBorder#d3222e
- inputValidation.errorForeground#3b4042
- inputValidation.infoBackground#dbe6e9
- inputValidation.infoBorder#317684
- inputValidation.infoForeground#3b4042
- inputValidation.warningBackground#e9e3d7
- inputValidation.warningBorder#8a6716
- inputValidation.warningForeground#3b4042
- keybindingLabel.background#848f9424
- keybindingLabel.border#848f9429
- keybindingLabel.bottomBorder#848f9438
- keybindingLabel.foreground#3b4042
- list.activeSelectionBackground#3f99ab33
- list.activeSelectionForeground#3b4042
- list.activeSelectionIconForeground#337b8a
- list.dropBackground#3f99ab29
- list.errorForeground#d3222e
- list.focusBackground#3f99ab33
- list.focusForeground#3b4042
- list.focusHighlightForeground#378595
- list.focusOutline#3f99ab00
- list.highlightForeground#337b8a
- list.hoverBackground#848f941a
- list.hoverForeground#3b4042
- list.inactiveSelectionBackground#3f99ab1c
- list.inactiveSelectionForeground#3b4042
- list.warningForeground#8a6716
- listFilterWidget.background#fdfdfd
- listFilterWidget.noMatchesOutline#d3222e
- listFilterWidget.outline#3f99ab
- menu.background#fdfdfd
- menu.border#dbdfe1
- menu.foreground#3b4042
- menu.selectionBackground#3f99ab33
- menu.selectionForeground#3b4042
- menu.separatorBackground#dbdfe1
- menubar.selectionBackground#848f9424
- menubar.selectionForeground#3b4042
- merge.border#dbdfe100
- merge.commonContentBackground#848f941f
- merge.commonHeaderBackground#848f9440
- merge.currentContentBackground#19834524
- merge.currentHeaderBackground#1983454d
- merge.incomingContentBackground#31768424
- merge.incomingHeaderBackground#3176844d
- minimap.background#fbfbfc
- minimap.errorHighlight#d3222e
- minimap.findMatchHighlight#db8624b3
- minimap.selectionHighlight#3f99ab80
- minimap.warningHighlight#8a6716
- minimapGutter.addedBackground#198345
- minimapGutter.deletedBackground#d63429
- minimapGutter.modifiedBackground#926a1c
- minimapSlider.activeBackground#848f9442
- minimapSlider.background#848f941a
- minimapSlider.hoverBackground#848f942e
- notificationCenter.border#dbdfe1
- notificationCenterHeader.background#f5f6f7
- notificationCenterHeader.foreground#3b4042
- notificationLink.foreground#337b8a
- notifications.background#fdfdfd
- notifications.border#dbdfe1
- notifications.foreground#3b4042
- notificationsErrorIcon.foreground#d3222e
- notificationsInfoIcon.foreground#317684
- notificationsWarningIcon.foreground#8a6716
- notificationToast.border#dbdfe1
- panel.background#f2f4f5
- panel.border#dbdfe1
- panel.dropBorder#3f99ab
- panelInput.border#dbdfe1
- panelSection.border#dbdfe1
- panelSectionHeader.background#f2f4f5
- panelSectionHeader.foreground#3b4042
- panelTitle.activeBorder#3f99ab
- panelTitle.activeForeground#3b4042
- panelTitle.inactiveForeground#7f8a90
- peekView.border#3f99ab8c
- peekViewEditor.background#f7f8f8
- peekViewEditor.matchHighlightBackground#db862447
- peekViewResult.background#f2f4f5
- peekViewResult.fileForeground#3b4042
- peekViewResult.foreground#3b4042
- peekViewResult.lineForeground#626b6f
- peekViewResult.matchHighlightBackground#db862447
- peekViewResult.selectionBackground#3f99ab2e
- peekViewResult.selectionForeground#3b4042
- peekViewTitle.background#f2f4f5
- peekViewTitleDescription.foreground#626b6f
- peekViewTitleLabel.foreground#3b4042
- pickerGroup.border#dbdfe1
- pickerGroup.foreground#337b8a
- ports.iconRunningProcessForeground#147d45
- problemsErrorIcon.foreground#d3222e
- problemsInfoIcon.foreground#317684
- problemsWarningIcon.foreground#8a6716
- progressBar.background#3f99ab
- quickInput.background#fdfdfd
- quickInput.foreground#3b4042
- quickInputList.focusBackground#3f99ab33
- quickInputList.focusForeground#3b4042
- quickInputList.focusIconForeground#337b8a
- quickInputTitle.background#f5f6f7
- sash.hoverBorder#3f99ab80
- scrollbar.shadow#74838b14
- scrollbarSlider.activeBackground#848f9473
- scrollbarSlider.background#848f9433
- scrollbarSlider.hoverBackground#848f9452
- search.resultsInfoForeground#626b6f
- searchEditor.findMatchBackground#db862429
- selection.background#3f99ab33
- settings.checkboxBackground#fdfdfd
- settings.checkboxBorder#c2c9cc
- settings.dropdownBackground#fdfdfd
- settings.dropdownBorder#dbdfe1
- settings.focusedRowBackground#3f99ab12
- settings.headerForeground#3b4042
- settings.modifiedItemIndicator#3f99ab
- settings.numberInputBackground#f7f8f8
- settings.numberInputBorder#dbdfe1
- settings.rowHoverBackground#848f940f
- settings.textInputBackground#f7f8f8
- settings.textInputBorder#dbdfe1
- sideBar.background#f2f4f5
- sideBar.border#dbdfe100
- sideBar.foreground#5f676b
- sideBarSectionHeader.background#f2f4f5
- sideBarSectionHeader.border#dbdfe100
- sideBarSectionHeader.foreground#3b4042
- sideBarStickyScroll.background#f2f4f5
- sideBarTitle.foreground#3b4042
- statusBar.background#eceeef
- statusBar.border#dbdfe100
- statusBar.debuggingBackground#3f99ab
- statusBar.debuggingBorder#dbdfe100
- statusBar.debuggingForeground#171a1c
- statusBar.foreground#5b6367
- statusBar.noFolderBackground#eceeef
- statusBar.noFolderForeground#5b6367
- statusBarItem.activeBackground#848f9438
- statusBarItem.hoverBackground#848f9424
- statusBarItem.prominentBackground#3f99ab3d
- statusBarItem.prominentForeground#3b4042
- statusBarItem.prominentHoverBackground#3f99ab57
- statusBarItem.remoteBackground#3f99ab
- statusBarItem.remoteForeground#171a1c
- symbolIcon.booleanForeground#b81e99
- symbolIcon.classForeground#137262
- symbolIcon.colorForeground#8c5a22
- symbolIcon.constantForeground#915818
- symbolIcon.constructorForeground#1a6aa0
- symbolIcon.enumeratorForeground#137262
- symbolIcon.enumeratorMemberForeground#915818
- symbolIcon.fieldForeground#2d6b95
- symbolIcon.fileForeground#626b6f
- symbolIcon.folderForeground#626b6f
- symbolIcon.functionForeground#1a6aa0
- symbolIcon.interfaceForeground#137262
- symbolIcon.keywordForeground#b81e99
- symbolIcon.methodForeground#1a6aa0
- symbolIcon.moduleForeground#c52028
- symbolIcon.namespaceForeground#c52028
- symbolIcon.numberForeground#915818
- symbolIcon.propertyForeground#2d6b95
- symbolIcon.snippetForeground#8c5a22
- symbolIcon.stringForeground#137638
- symbolIcon.textForeground#626b6f
- symbolIcon.variableForeground#3b4042
- tab.activeBackground#fbfbfc
- tab.activeBorder#fbfbfc00
- tab.activeBorderTop#3f99ab
- tab.activeForeground#3b4042
- tab.activeModifiedBorder#926a1c
- tab.border#dbdfe100
- tab.hoverBackground#f2f4f5
- tab.hoverForeground#3b4042
- tab.inactiveBackground#eceeef
- tab.inactiveForeground#7b868c
- tab.inactiveModifiedBorder#926a1c80
- tab.lastPinnedBorder#dbdfe1
- tab.unfocusedActiveBackground#f2f4f5
- tab.unfocusedActiveBorderTop#3f99ab59
- tab.unfocusedActiveForeground#626b6f
- tab.unfocusedInactiveForeground#929ba0
- terminal.ansiBlack#acb5b9
- terminal.ansiBlue#1d78b4
- terminal.ansiBrightBlack#8a979e
- terminal.ansiBrightBlue#186294
- terminal.ansiBrightCyan#116a5b
- terminal.ansiBrightGreen#116c33
- terminal.ansiBrightMagenta#a71b8b
- terminal.ansiBrightRed#b4212b
- terminal.ansiBrightWhite#3b4042
- terminal.ansiBrightYellow#855115
- terminal.ansiCyan#15816f
- terminal.ansiGreen#15843e
- terminal.ansiMagenta#cc21aa
- terminal.ansiRed#dc2834
- terminal.ansiWhite#5f676b
- terminal.ansiYellow#a2631a
- terminal.background#f2f4f5
- terminal.border#dbdfe1
- terminal.findMatchBackground#db862447
- terminal.findMatchHighlightBackground#db862429
- terminal.foreground#383c3e
- terminal.inactiveSelectionBackground#3f99ab1c
- terminal.selectionBackground#3f99ab33
- terminalCursor.background#f2f4f5
- terminalCursor.foreground#337b8a
- testing.iconErrored#d3222e
- testing.iconFailed#d3222e
- testing.iconPassed#147d45
- testing.iconQueued#8a6716
- testing.iconSkipped#848f94
- testing.iconUnset#848f94
- testing.message.error.decorationForeground#d3222e
- testing.runAction#147d45
- textBlockQuote.background#f2f4f5
- textBlockQuote.border#3f99ab80
- textCodeBlock.background#f2f4f5
- textLink.activeForeground#378595
- textLink.foreground#337b8a
- textPreformat.background#3f99ab1a
- textPreformat.foreground#137638
- textSeparator.foreground#dbdfe1
- titleBar.activeBackground#eceeef
- titleBar.activeForeground#5b6367
- titleBar.border#dbdfe100
- titleBar.inactiveBackground#eceeef
- titleBar.inactiveForeground#929ba0
- tree.inactiveIndentGuidesStroke#e9ebec
- tree.indentGuidesStroke#e0e4e5
- walkThrough.embeddedEditorBackground#f2f4f5
- welcomePage.background#fbfbfc
- welcomePage.progress.background#e3e6e8
- welcomePage.progress.foreground#3f99ab
- welcomePage.tileBackground#f2f4f5
- welcomePage.tileHoverBackground#f5f6f7
- widget.border#dbdfe1
- widget.shadow#82909724
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment, string.comment | #677379 | italic |
| comment.block.documentation storage.type, comment keyword | #677379 | italic bold |
| punctuation, meta.brace, punctuation.definition.parameters, punctuation.separator, punctuation.terminator | #626b6f | — |
| variable, variable.other.readwrite, meta.definition.variable.name, support.variable, entity.name.variable | #3b4042 | — |
| variable.parameter, meta.function.parameters variable | #6b3539 | italic |
| variable.language, variable.language.this, variable.other.constant | #c52028 | italic |
| variable.other.property, meta.object-literal.key, support.type.property-name, variable.other.object.property | #2d6b95 | — |
| keyword, keyword.control, keyword.other, storage, storage.type, storage.modifier, keyword.type | #b81e99 | — |
| keyword.operator, punctuation.accessor, storage.type.function.arrow | #b5489f | — |
| keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.default | #b81e99 | italic |
| string, string.quoted, punctuation.definition.string, string.template | #137638 | — |
| punctuation.definition.template-expression, punctuation.section.embedded | #b5489f | — |
| string.regexp, constant.other.character-class.regexp, keyword.operator.quantifier.regexp | #0d7261 | — |
| constant.character.escape, constant.character | #c52028 | — |
| constant.numeric, constant.language.numeric | #915818 | — |
| constant, constant.language, constant.language.boolean, constant.language.null, constant.language.undefined, support.constant | #915818 | — |
| entity.name.function, support.function, meta.function-call.generic, variable.function | #1a6aa0 | — |
| entity.name.method, meta.method entity.name.function | #1a6aa0 | — |
| entity.name.type, entity.name.class, entity.other.inherited-class, support.class, support.type, meta.type.annotation, entity.name.namespace | #137262 | — |
| meta.decorator, entity.name.function.decorator, punctuation.decorator | #8c5a22 | italic |
| entity.name.tag, punctuation.definition.tag, meta.tag | #c52028 | — |
| support.class.component, entity.name.tag.custom | #137262 | — |
| entity.other.attribute-name, meta.attribute | #8c5a22 | italic |
| entity.name.selector, entity.other.attribute-name.class, entity.other.attribute-name.id | #137262 | — |
| support.type.property-name.css, support.type.property-name.scss | #2d6b95 | — |
| keyword.other.unit, constant.numeric.css | #915818 | — |
| support.type.property-name.json, meta.structure.dictionary.json string.quoted.double | #2d6b95 | — |
| entity.name.tag.yaml | #2d6b95 | — |
| markup.heading, entity.name.section.markdown, punctuation.definition.heading | #1a6aa0 | bold |
| markup.bold | #915818 | bold |
| markup.italic | #b81e99 | italic |
| markup.strikethrough | #677379 | strikethrough |
| markup.underline.link, string.other.link | #337b8a | underline |
| markup.quote | #677379 | italic |
| markup.inline.raw, markup.fenced_code, markup.raw | #137638 | — |
| markup.list punctuation.definition.list, beginning.punctuation.definition.list | #c52028 | — |
| markup.inserted | #198345 | — |
| markup.deleted | #d63429 | — |
| markup.changed | #926a1c | — |
| invalid, invalid.illegal | #d3222e | — |
| invalid.deprecated | #8a6716 | strikethrough |
| variable.other.normal.shell, string.interpolated.dollar.shell | #2d6b95 | — |
| keyword.other.definition.ini, entity.name.section.ini | #2d6b95 | — |
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.activeBackground#61ba4f1a
- activityBar.activeBorder#61ba4f
- activityBar.background#10130f
- activityBar.border#2c332800
- activityBar.foreground#c4cac2
- activityBar.inactiveForeground#63705c
- activityBarBadge.background#61ba4f
- activityBarBadge.foreground#181d16
- activityBarTop.activeBorder#61ba4f
- activityBarTop.foreground#c4cac2
- activityBarTop.inactiveForeground#63705c
- badge.background#61ba4f
- badge.foreground#181d16
- banner.background#2a3126
- banner.foreground#c4cac2
- banner.iconForeground#4a973b
- breadcrumb.activeSelectionForeground#4a973b
- breadcrumb.background#1b1f19
- breadcrumb.focusForeground#c4cac2
- breadcrumb.foreground#64725d
- breadcrumbPicker.background#232921
- button.background#61ba4f
- button.border#61ba4f00
- button.foreground#181d16
- button.hoverBackground#74c365
- button.secondaryBackground#2a3126
- button.secondaryForeground#c4cac2
- button.secondaryHoverBackground#333c2f
- charts.blue#3890b0
- charts.foreground#c4cac2
- charts.green#33a166
- charts.lines#64725d
- charts.orange#ca8556
- charts.purple#d270cb
- charts.red#d27076
- charts.yellow#ab8836
- checkbox.background#232921
- checkbox.border#404a3a
- checkbox.foreground#c4cac2
- debugConsole.errorForeground#d27076
- debugConsole.infoForeground#4ea03e
- debugConsole.sourceForeground#889482
- debugConsole.warningForeground#ab8836
- debugConsoleInputIcon.foreground#4a973b
- debugExceptionWidget.background#352a26
- debugExceptionWidget.border#d27076
- debugIcon.breakpointDisabledForeground#d2707680
- debugIcon.breakpointForeground#d27076
- debugIcon.continueForeground#33a166
- debugIcon.pauseForeground#4ea03e
- debugIcon.restartForeground#33a166
- debugIcon.startForeground#33a166
- debugIcon.stepIntoForeground#4ea03e
- debugIcon.stepOutForeground#4ea03e
- debugIcon.stepOverForeground#4ea03e
- debugIcon.stopForeground#d27076
- debugTokenExpression.boolean#d270cb
- debugTokenExpression.error#d27076
- debugTokenExpression.name#589db6
- debugTokenExpression.number#ca8556
- debugTokenExpression.string#35a950
- debugTokenExpression.value#35a950
- debugToolBar.background#232921
- debugToolBar.border#2c3328
- descriptionForeground#889482
- diffEditor.diagonalFill#2c3328
- diffEditor.insertedLineBackground#34985e17
- diffEditor.insertedTextBackground#34985e24
- diffEditor.removedLineBackground#ca6c6517
- diffEditor.removedTextBackground#ca6c6524
- diffEditorOverview.insertedForeground#34985e99
- diffEditorOverview.removedForeground#ca6c6599
- dropdown.background#232921
- dropdown.border#2c3328
- dropdown.foreground#c4cac2
- dropdown.listBackground#232921
- editor.background#1b1f19
- editor.findMatchBackground#c2723d52
- editor.findMatchBorder#c88051b3
- editor.findMatchHighlightBackground#c2723d2e
- editor.findRangeHighlightBackground#61ba4f21
- editor.focusedStackFrameHighlightBackground#33a1662e
- editor.foldBackground#61ba4f14
- editor.foreground#c4cac2
- editor.hoverHighlightBackground#61ba4f24
- editor.inactiveSelectionBackground#61ba4f21
- editor.lineHighlightBackground#ffffff0b
- editor.lineHighlightBorder#61ba4f00
- editor.rangeHighlightBackground#61ba4f21
- editor.selectionBackground#61ba4f3d
- editor.selectionHighlightBackground#61ba4f21
- editor.selectionHighlightBorder#61ba4f00
- editor.stackFrameHighlightBackground#ab883629
- editor.wordHighlightBackground#61ba4f24
- editor.wordHighlightStrongBackground#61ba4f38
- editorBracketHighlight.foreground1#3890b0
- editorBracketHighlight.foreground2#c2743f
- editorBracketHighlight.foreground3#319b7b
- editorBracketHighlight.foreground4#cb5ac3
- editorBracketHighlight.foreground5#319b4a
- editorBracketHighlight.foreground6#cf6679
- editorBracketHighlight.unexpectedBracket.foreground#d27076
- editorBracketMatch.background#61ba4f29
- editorBracketMatch.border#61ba4f8c
- editorCodeLens.foreground#64725d
- editorCursor.background#1b1f19
- editorCursor.foreground#4a973b
- editorError.foreground#d27076
- editorGhostText.foreground#63705c
- editorGroup.border#2c3328
- editorGroup.dropBackground#61ba4f29
- editorGroupHeader.border#2c332800
- editorGroupHeader.noTabsBackground#10130f
- editorGroupHeader.tabsBackground#10130f
- editorGroupHeader.tabsBorder#2c332800
- editorGutter.addedBackground#34985e
- editorGutter.background#1b1f19
- editorGutter.deletedBackground#ca6c65
- editorGutter.foldingControlForeground#889482
- editorGutter.modifiedBackground#a58139
- editorHint.foreground#64725d
- editorHoverWidget.background#232921
- editorHoverWidget.border#2c3328
- editorHoverWidget.foreground#c4cac2
- editorHoverWidget.statusBarBackground#2a3126
- editorIndentGuide.activeBackground1#495643
- editorIndentGuide.background1#2a3126
- editorInfo.foreground#4ea03e
- editorInlayHint.background#61ba4f1a
- editorInlayHint.foreground#64725d
- editorLineNumber.activeForeground#4a973b
- editorLineNumber.foreground#63705c
- editorLink.activeForeground#4a973b
- editorOverviewRuler.addedForeground#34985e
- editorOverviewRuler.border#2c332800
- editorOverviewRuler.bracketMatchForeground#61ba4f66
- editorOverviewRuler.deletedForeground#ca6c65
- editorOverviewRuler.errorForeground#d27076
- editorOverviewRuler.findMatchForeground#c88051b3
- editorOverviewRuler.infoForeground#4ea03e
- editorOverviewRuler.modifiedForeground#a58139
- editorOverviewRuler.selectionHighlightForeground#61ba4f66
- editorOverviewRuler.warningForeground#ab8836
- editorRuler.foreground#272e24
- editorStickyScroll.background#151813
- editorStickyScrollHover.background#2a3126
- editorSuggestWidget.background#232921
- editorSuggestWidget.border#2c3328
- editorSuggestWidget.focusHighlightForeground#74c365
- editorSuggestWidget.foreground#c4cac2
- editorSuggestWidget.highlightForeground#4a973b
- editorSuggestWidget.selectedBackground#61ba4f2e
- editorSuggestWidget.selectedForeground#c4cac2
- editorWarning.foreground#ab8836
- editorWhitespace.foreground#63705c80
- editorWidget.background#232921
- editorWidget.border#2c3328
- editorWidget.foreground#c4cac2
- errorForeground#d27076
- extensionBadge.remoteBackground#61ba4f
- extensionBadge.remoteForeground#181d16
- extensionButton.prominentBackground#61ba4f
- extensionButton.prominentForeground#181d16
- extensionButton.prominentHoverBackground#74c365
- extensionIcon.preReleaseForeground#d270cb
- extensionIcon.starForeground#ca8556
- extensionIcon.verifiedForeground#33a166
- focusBorder#61ba4f99
- foreground#c4cac2
- gitDecoration.addedResourceForeground#34985e
- gitDecoration.conflictingResourceForeground#c55ec5
- gitDecoration.deletedResourceForeground#ca6c65
- gitDecoration.ignoredResourceForeground#64725d
- gitDecoration.modifiedResourceForeground#a58139
- gitDecoration.renamedResourceForeground#3f9a3f
- gitDecoration.stageDeletedResourceForeground#ca6c65
- gitDecoration.stageModifiedResourceForeground#a58139
- gitDecoration.submoduleResourceForeground#9e75c7
- gitDecoration.untrackedResourceForeground#3f9a3f
- icon.foreground#889482
- input.background#22281f
- input.border#2c3328
- input.foreground#c4cac2
- input.placeholderForeground#64725d
- inputOption.activeBackground#61ba4f3d
- inputOption.activeBorder#61ba4f80
- inputOption.activeForeground#c4cac2
- inputValidation.errorBackground#382c28
- inputValidation.errorBorder#d27076
- inputValidation.errorForeground#c4cac2
- inputValidation.infoBackground#23341f
- inputValidation.infoBorder#4ea03e
- inputValidation.infoForeground#c4cac2
- inputValidation.warningBackground#32301e
- inputValidation.warningBorder#ab8836
- inputValidation.warningForeground#c4cac2
- keybindingLabel.background#64725d24
- keybindingLabel.border#64725d29
- keybindingLabel.bottomBorder#64725d38
- keybindingLabel.foreground#c4cac2
- list.activeSelectionBackground#61ba4f33
- list.activeSelectionForeground#c4cac2
- list.activeSelectionIconForeground#4a973b
- list.dropBackground#61ba4f29
- list.errorForeground#d27076
- list.focusBackground#61ba4f33
- list.focusForeground#c4cac2
- list.focusHighlightForeground#74c365
- list.focusOutline#61ba4f00
- list.highlightForeground#4a973b
- list.hoverBackground#64725d1a
- list.hoverForeground#c4cac2
- list.inactiveSelectionBackground#61ba4f1c
- list.inactiveSelectionForeground#c4cac2
- list.warningForeground#ab8836
- listFilterWidget.background#232921
- listFilterWidget.noMatchesOutline#d27076
- listFilterWidget.outline#61ba4f
- menu.background#232921
- menu.border#2c3328
- menu.foreground#c4cac2
- menu.selectionBackground#61ba4f33
- menu.selectionForeground#c4cac2
- menu.separatorBackground#2c3328
- menubar.selectionBackground#64725d24
- menubar.selectionForeground#c4cac2
- merge.border#2c332800
- merge.commonContentBackground#64725d1f
- merge.commonHeaderBackground#64725d40
- merge.currentContentBackground#34985e24
- merge.currentHeaderBackground#34985e4d
- merge.incomingContentBackground#4ea03e24
- merge.incomingHeaderBackground#4ea03e4d
- minimap.background#1b1f19
- minimap.errorHighlight#d27076
- minimap.findMatchHighlight#c2723db3
- minimap.selectionHighlight#61ba4f80
- minimap.warningHighlight#ab8836
- minimapGutter.addedBackground#34985e
- minimapGutter.deletedBackground#ca6c65
- minimapGutter.modifiedBackground#a58139
- minimapSlider.activeBackground#64725d42
- minimapSlider.background#64725d1a
- minimapSlider.hoverBackground#64725d2e
- notificationCenter.border#2c3328
- notificationCenterHeader.background#2a3126
- notificationCenterHeader.foreground#c4cac2
- notificationLink.foreground#4a973b
- notifications.background#232921
- notifications.border#2c3328
- notifications.foreground#c4cac2
- notificationsErrorIcon.foreground#d27076
- notificationsInfoIcon.foreground#4ea03e
- notificationsWarningIcon.foreground#ab8836
- notificationToast.border#2c3328
- panel.background#151813
- panel.border#2c3328
- panel.dropBorder#61ba4f
- panelInput.border#2c3328
- panelSection.border#2c3328
- panelSectionHeader.background#151813
- panelSectionHeader.foreground#c4cac2
- panelTitle.activeBorder#61ba4f
- panelTitle.activeForeground#c4cac2
- panelTitle.inactiveForeground#63705c
- peekView.border#61ba4f8c
- peekViewEditor.background#161a14
- peekViewEditor.matchHighlightBackground#c2723d52
- peekViewResult.background#151813
- peekViewResult.fileForeground#c4cac2
- peekViewResult.foreground#c4cac2
- peekViewResult.lineForeground#889482
- peekViewResult.matchHighlightBackground#c2723d52
- peekViewResult.selectionBackground#61ba4f2e
- peekViewResult.selectionForeground#c4cac2
- peekViewTitle.background#151813
- peekViewTitleDescription.foreground#889482
- peekViewTitleLabel.foreground#c4cac2
- pickerGroup.border#2c3328
- pickerGroup.foreground#4a973b
- ports.iconRunningProcessForeground#33a166
- problemsErrorIcon.foreground#d27076
- problemsInfoIcon.foreground#4ea03e
- problemsWarningIcon.foreground#ab8836
- progressBar.background#61ba4f
- quickInput.background#232921
- quickInput.foreground#c4cac2
- quickInputList.focusBackground#61ba4f33
- quickInputList.focusForeground#c4cac2
- quickInputList.focusIconForeground#4a973b
- quickInputTitle.background#2a3126
- sash.hoverBorder#61ba4f80
- scrollbar.shadow#0709074d
- scrollbarSlider.activeBackground#64725d73
- scrollbarSlider.background#64725d33
- scrollbarSlider.hoverBackground#64725d52
- search.resultsInfoForeground#889482
- searchEditor.findMatchBackground#c2723d2e
- selection.background#61ba4f3d
- settings.checkboxBackground#232921
- settings.checkboxBorder#404a3a
- settings.dropdownBackground#232921
- settings.dropdownBorder#2c3328
- settings.focusedRowBackground#61ba4f12
- settings.headerForeground#c4cac2
- settings.modifiedItemIndicator#61ba4f
- settings.numberInputBackground#22281f
- settings.numberInputBorder#2c3328
- settings.rowHoverBackground#64725d0f
- settings.textInputBackground#22281f
- settings.textInputBorder#2c3328
- sideBar.background#151813
- sideBar.border#2c332800
- sideBar.foreground#83907c
- sideBarSectionHeader.background#151813
- sideBarSectionHeader.border#2c332800
- sideBarSectionHeader.foreground#c4cac2
- sideBarStickyScroll.background#151813
- sideBarTitle.foreground#c4cac2
- statusBar.background#10130f
- statusBar.border#2c332800
- statusBar.debuggingBackground#61ba4f
- statusBar.debuggingBorder#2c332800
- statusBar.debuggingForeground#181d16
- statusBar.foreground#7f8c78
- statusBar.noFolderBackground#10130f
- statusBar.noFolderForeground#7f8c78
- statusBarItem.activeBackground#64725d38
- statusBarItem.hoverBackground#64725d24
- statusBarItem.prominentBackground#61ba4f3d
- statusBarItem.prominentForeground#c4cac2
- statusBarItem.prominentHoverBackground#61ba4f57
- statusBarItem.remoteBackground#61ba4f
- statusBarItem.remoteForeground#181d16
- symbolIcon.booleanForeground#d270cb
- symbolIcon.classForeground#35a784
- symbolIcon.colorForeground#c28861
- symbolIcon.constantForeground#ca8556
- symbolIcon.constructorForeground#3f9fc2
- symbolIcon.enumeratorForeground#35a784
- symbolIcon.enumeratorMemberForeground#ca8556
- symbolIcon.fieldForeground#589db6
- symbolIcon.fileForeground#889482
- symbolIcon.folderForeground#889482
- symbolIcon.functionForeground#3f9fc2
- symbolIcon.interfaceForeground#35a784
- symbolIcon.keywordForeground#d270cb
- symbolIcon.methodForeground#3f9fc2
- symbolIcon.moduleForeground#d5798a
- symbolIcon.namespaceForeground#d5798a
- symbolIcon.numberForeground#ca8556
- symbolIcon.propertyForeground#589db6
- symbolIcon.snippetForeground#c28861
- symbolIcon.stringForeground#35a950
- symbolIcon.textForeground#889482
- symbolIcon.variableForeground#c4cac2
- tab.activeBackground#1b1f19
- tab.activeBorder#1b1f1900
- tab.activeBorderTop#61ba4f
- tab.activeForeground#c4cac2
- tab.activeModifiedBorder#a58139
- tab.border#2c332800
- tab.hoverBackground#151813
- tab.hoverForeground#c4cac2
- tab.inactiveBackground#10130f
- tab.inactiveForeground#63705c
- tab.inactiveModifiedBorder#a5813980
- tab.lastPinnedBorder#2c3328
- tab.unfocusedActiveBackground#151813
- tab.unfocusedActiveBorderTop#61ba4f59
- tab.unfocusedActiveForeground#889482
- tab.unfocusedInactiveForeground#63705c
- terminal.ansiBlack#31392d
- terminal.ansiBlue#3890b0
- terminal.ansiBrightBlack#53614c
- terminal.ansiBrightBlue#64a8c1
- terminal.ansiBrightCyan#5eb198
- terminal.ansiBrightGreen#5eb172
- terminal.ansiBrightMagenta#d67ed0
- terminal.ansiBrightRed#da898f
- terminal.ansiBrightWhite#c4cac2
- terminal.ansiBrightYellow#cf9369
- terminal.ansiCyan#319b7b
- terminal.ansiGreen#319b4a
- terminal.ansiMagenta#cb5ac3
- terminal.ansiRed#cf686f
- terminal.ansiWhite#83907c
- terminal.ansiYellow#c2743f
- terminal.background#151813
- terminal.border#2c3328
- terminal.findMatchBackground#c2723d52
- terminal.findMatchHighlightBackground#c2723d2e
- terminal.foreground#bec4bb
- terminal.inactiveSelectionBackground#61ba4f21
- terminal.selectionBackground#61ba4f3d
- terminalCursor.background#151813
- terminalCursor.foreground#4a973b
- testing.iconErrored#d27076
- testing.iconFailed#d27076
- testing.iconPassed#33a166
- testing.iconQueued#ab8836
- testing.iconSkipped#64725d
- testing.iconUnset#64725d
- testing.message.error.decorationForeground#d27076
- testing.runAction#33a166
- textBlockQuote.background#151813
- textBlockQuote.border#61ba4f80
- textCodeBlock.background#151813
- textLink.activeForeground#74c365
- textLink.foreground#4a973b
- textPreformat.background#61ba4f1a
- textPreformat.foreground#35a950
- textSeparator.foreground#2c3328
- titleBar.activeBackground#10130f
- titleBar.activeForeground#7f8c78
- titleBar.border#2c332800
- titleBar.inactiveBackground#10130f
- titleBar.inactiveForeground#63705c
- tree.inactiveIndentGuidesStroke#252b22
- tree.indentGuidesStroke#2f362b
- walkThrough.embeddedEditorBackground#151813
- welcomePage.background#1b1f19
- welcomePage.progress.background#2c3328
- welcomePage.progress.foreground#61ba4f
- welcomePage.tileBackground#151813
- welcomePage.tileHoverBackground#2a3126
- widget.border#2c3328
- widget.shadow#07090770
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment, string.comment | #7a8c70 | italic |
| comment.block.documentation storage.type, comment keyword | #7a8c70 | italic bold |
| punctuation, meta.brace, punctuation.definition.parameters, punctuation.separator, punctuation.terminator | #889482 | — |
| variable, variable.other.readwrite, meta.definition.variable.name, support.variable, entity.name.variable | #c4cac2 | — |
| variable.parameter, meta.function.parameters variable | #caaeae | italic |
| variable.language, variable.language.this, variable.other.constant | #d5798a | italic |
| variable.other.property, meta.object-literal.key, support.type.property-name, variable.other.object.property | #589db6 | — |
| keyword, keyword.control, keyword.other, storage, storage.type, storage.modifier, keyword.type | #d270cb | — |
| keyword.operator, punctuation.accessor, storage.type.function.arrow | #b36faf | — |
| keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.default | #d270cb | italic |
| string, string.quoted, punctuation.definition.string, string.template | #35a950 | — |
| punctuation.definition.template-expression, punctuation.section.embedded | #b36faf | — |
| string.regexp, constant.other.character-class.regexp, keyword.operator.quantifier.regexp | #2ea884 | — |
| constant.character.escape, constant.character | #d5798a | — |
| constant.numeric, constant.language.numeric | #ca8556 | — |
| constant, constant.language, constant.language.boolean, constant.language.null, constant.language.undefined, support.constant | #ca8556 | — |
| entity.name.function, support.function, meta.function-call.generic, variable.function | #3f9fc2 | — |
| entity.name.method, meta.method entity.name.function | #3f9fc2 | — |
| entity.name.type, entity.name.class, entity.other.inherited-class, support.class, support.type, meta.type.annotation, entity.name.namespace | #35a784 | — |
| meta.decorator, entity.name.function.decorator, punctuation.decorator | #c28861 | italic |
| entity.name.tag, punctuation.definition.tag, meta.tag | #d5798a | — |
| support.class.component, entity.name.tag.custom | #35a784 | — |
| entity.other.attribute-name, meta.attribute | #c28861 | italic |
| entity.name.selector, entity.other.attribute-name.class, entity.other.attribute-name.id | #35a784 | — |
| support.type.property-name.css, support.type.property-name.scss | #589db6 | — |
| keyword.other.unit, constant.numeric.css | #ca8556 | — |
| support.type.property-name.json, meta.structure.dictionary.json string.quoted.double | #589db6 | — |
| entity.name.tag.yaml | #589db6 | — |
| markup.heading, entity.name.section.markdown, punctuation.definition.heading | #3f9fc2 | bold |
| markup.bold | #ca8556 | bold |
| markup.italic | #d270cb | italic |
| markup.strikethrough | #7a8c70 | strikethrough |
| markup.underline.link, string.other.link | #4a973b | underline |
| markup.quote | #7a8c70 | italic |
| markup.inline.raw, markup.fenced_code, markup.raw | #35a950 | — |
| markup.list punctuation.definition.list, beginning.punctuation.definition.list | #d5798a | — |
| markup.inserted | #34985e | — |
| markup.deleted | #ca6c65 | — |
| markup.changed | #a58139 | — |
| invalid, invalid.illegal | #d27076 | — |
| invalid.deprecated | #ab8836 | strikethrough |
| variable.other.normal.shell, string.interpolated.dollar.shell | #589db6 | — |
| keyword.other.definition.ini, entity.name.section.ini | #589db6 | — |
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.activeBackground#983bce1a
- activityBar.activeBorder#983bce
- activityBar.background#110d14
- activityBar.border#2f253700
- activityBar.foreground#c7c1cd
- activityBar.inactiveForeground#6f5c7f
- activityBarBadge.background#983bce
- activityBarBadge.foreground#f5f3f7
- activityBarTop.activeBorder#983bce
- activityBarTop.foreground#c7c1cd
- activityBarTop.inactiveForeground#6f5c7f
- badge.background#983bce
- badge.foreground#f5f3f7
- banner.background#2c2334
- banner.foreground#c7c1cd
- banner.iconForeground#ad62d8
- breadcrumb.activeSelectionForeground#ad62d8
- breadcrumb.background#1c1622
- breadcrumb.focusForeground#c7c1cd
- breadcrumb.foreground#756187
- breadcrumbPicker.background#251e2c
- button.background#983bce
- button.border#983bce00
- button.foreground#f5f3f7
- button.hoverBackground#a554d4
- button.secondaryBackground#2c2334
- button.secondaryForeground#c7c1cd
- button.secondaryHoverBackground#362b40
- charts.blue#607ddc
- charts.foreground#c7c1cd
- charts.green#25a762
- charts.lines#756187
- charts.orange#a79a25
- charts.purple#de689b
- charts.red#dd626a
- charts.yellow#ab8326
- checkbox.background#251e2c
- checkbox.border#433550
- checkbox.foreground#c7c1cd
- debugConsole.errorForeground#dd626a
- debugConsole.infoForeground#b16ada
- debugConsole.sourceForeground#9686a4
- debugConsole.warningForeground#ab8326
- debugConsoleInputIcon.foreground#ad62d8
- debugExceptionWidget.background#37212c
- debugExceptionWidget.border#dd626a
- debugIcon.breakpointDisabledForeground#dd626a80
- debugIcon.breakpointForeground#dd626a
- debugIcon.continueForeground#25a762
- debugIcon.pauseForeground#b16ada
- debugIcon.restartForeground#25a762
- debugIcon.startForeground#25a762
- debugIcon.stepIntoForeground#b16ada
- debugIcon.stepOutForeground#b16ada
- debugIcon.stepOverForeground#b16ada
- debugIcon.stopForeground#dd626a
- debugTokenExpression.boolean#de689b
- debugTokenExpression.error#dd626a
- debugTokenExpression.name#798dd0
- debugTokenExpression.number#a79a25
- debugTokenExpression.string#25a784
- debugTokenExpression.value#25a784
- debugToolBar.background#251e2c
- debugToolBar.border#2f2537
- descriptionForeground#9686a4
- diffEditor.diagonalFill#2f2537
- diffEditor.insertedLineBackground#28a45c17
- diffEditor.insertedTextBackground#28a45c24
- diffEditor.removedLineBackground#d65d5517
- diffEditor.removedTextBackground#d65d5524
- diffEditorOverview.insertedForeground#28a45c99
- diffEditorOverview.removedForeground#d65d5599
- dropdown.background#251e2c
- dropdown.border#2f2537
- dropdown.foreground#c7c1cd
- dropdown.listBackground#251e2c
- editor.background#1c1622
- editor.findMatchBackground#d1c12e52
- editor.findMatchBorder#d6c743b3
- editor.findMatchHighlightBackground#d1c12e2e
- editor.findRangeHighlightBackground#983bce21
- editor.focusedStackFrameHighlightBackground#25a7622e
- editor.foldBackground#983bce14
- editor.foreground#c7c1cd
- editor.hoverHighlightBackground#983bce24
- editor.inactiveSelectionBackground#983bce21
- editor.lineHighlightBackground#ffffff0b
- editor.lineHighlightBorder#983bce00
- editor.rangeHighlightBackground#983bce21
- editor.selectionBackground#983bce3d
- editor.selectionHighlightBackground#983bce21
- editor.selectionHighlightBorder#983bce00
- editor.stackFrameHighlightBackground#ab832629
- editor.wordHighlightBackground#983bce24
- editor.wordHighlightStrongBackground#983bce38
- editorBracketHighlight.foreground1#607ddc
- editorBracketHighlight.foreground2#a79a25
- editorBracketHighlight.foreground3#258fa9
- editorBracketHighlight.foreground4#d9518c
- editorBracketHighlight.foreground5#25a784
- editorBracketHighlight.foreground6#d1622e
- editorBracketHighlight.unexpectedBracket.foreground#dd626a
- editorBracketMatch.background#983bce29
- editorBracketMatch.border#983bce8c
- editorCodeLens.foreground#756187
- editorCursor.background#1c1622
- editorCursor.foreground#ad62d8
- editorError.foreground#dd626a
- editorGhostText.foreground#675676
- editorGroup.border#2f2537
- editorGroup.dropBackground#983bce29
- editorGroupHeader.border#2f253700
- editorGroupHeader.noTabsBackground#110d14
- editorGroupHeader.tabsBackground#110d14
- editorGroupHeader.tabsBorder#2f253700
- editorGutter.addedBackground#28a45c
- editorGutter.background#1c1622
- editorGutter.deletedBackground#d65d55
- editorGutter.foldingControlForeground#9686a4
- editorGutter.modifiedBackground#a67c28
- editorHint.foreground#756187
- editorHoverWidget.background#251e2c
- editorHoverWidget.border#2f2537
- editorHoverWidget.foreground#c7c1cd
- editorHoverWidget.statusBarBackground#2c2334
- editorIndentGuide.activeBackground1#4e3d5c
- editorIndentGuide.background1#2c2334
- editorInfo.foreground#b16ada
- editorInlayHint.background#983bce1a
- editorInlayHint.foreground#756187
- editorLineNumber.activeForeground#ad62d8
- editorLineNumber.foreground#675676
- editorLink.activeForeground#ad62d8
- editorOverviewRuler.addedForeground#28a45c
- editorOverviewRuler.border#2f253700
- editorOverviewRuler.bracketMatchForeground#983bce66
- editorOverviewRuler.deletedForeground#d65d55
- editorOverviewRuler.errorForeground#dd626a
- editorOverviewRuler.findMatchForeground#d6c743b3
- editorOverviewRuler.infoForeground#b16ada
- editorOverviewRuler.modifiedForeground#a67c28
- editorOverviewRuler.selectionHighlightForeground#983bce66
- editorOverviewRuler.warningForeground#ab8326
- editorRuler.foreground#292131
- editorStickyScroll.background#16111a
- editorStickyScrollHover.background#2c2334
- editorSuggestWidget.background#251e2c
- editorSuggestWidget.border#2f2537
- editorSuggestWidget.focusHighlightForeground#a554d4
- editorSuggestWidget.foreground#c7c1cd
- editorSuggestWidget.highlightForeground#ad62d8
- editorSuggestWidget.selectedBackground#983bce2e
- editorSuggestWidget.selectedForeground#c7c1cd
- editorWarning.foreground#ab8326
- editorWhitespace.foreground#67567680
- editorWidget.background#251e2c
- editorWidget.border#2f2537
- editorWidget.foreground#c7c1cd
- errorForeground#dd626a
- extensionBadge.remoteBackground#983bce
- extensionBadge.remoteForeground#f5f3f7
- extensionButton.prominentBackground#983bce
- extensionButton.prominentForeground#f5f3f7
- extensionButton.prominentHoverBackground#a554d4
- extensionIcon.preReleaseForeground#de689b
- extensionIcon.starForeground#a79a25
- extensionIcon.verifiedForeground#25a762
- focusBorder#983bce99
- foreground#c7c1cd
- gitDecoration.addedResourceForeground#28a45c
- gitDecoration.conflictingResourceForeground#cf4acf
- gitDecoration.deletedResourceForeground#d65d55
- gitDecoration.ignoredResourceForeground#756187
- gitDecoration.modifiedResourceForeground#a67c28
- gitDecoration.renamedResourceForeground#329a32
- gitDecoration.stageDeletedResourceForeground#d65d55
- gitDecoration.stageModifiedResourceForeground#a67c28
- gitDecoration.submoduleResourceForeground#9e6dd0
- gitDecoration.untrackedResourceForeground#329a32
- icon.foreground#9686a4
- input.background#241d2b
- input.border#2f2537
- input.foreground#c7c1cd
- input.placeholderForeground#756187
- inputOption.activeBackground#983bce3d
- inputOption.activeBorder#983bce80
- inputOption.activeForeground#c7c1cd
- inputValidation.errorBackground#3b222e
- inputValidation.errorBorder#dd626a
- inputValidation.errorForeground#c7c1cd
- inputValidation.infoBackground#34233f
- inputValidation.infoBorder#b16ada
- inputValidation.infoForeground#c7c1cd
- inputValidation.warningBackground#332723
- inputValidation.warningBorder#ab8326
- inputValidation.warningForeground#c7c1cd
- keybindingLabel.background#75618724
- keybindingLabel.border#75618729
- keybindingLabel.bottomBorder#75618738
- keybindingLabel.foreground#c7c1cd
- list.activeSelectionBackground#983bce33
- list.activeSelectionForeground#c7c1cd
- list.activeSelectionIconForeground#ad62d8
- list.dropBackground#983bce29
- list.errorForeground#dd626a
- list.focusBackground#983bce33
- list.focusForeground#c7c1cd
- list.focusHighlightForeground#a554d4
- list.focusOutline#983bce00
- list.highlightForeground#ad62d8
- list.hoverBackground#7561871a
- list.hoverForeground#c7c1cd
- list.inactiveSelectionBackground#983bce1c
- list.inactiveSelectionForeground#c7c1cd
- list.warningForeground#ab8326
- listFilterWidget.background#251e2c
- listFilterWidget.noMatchesOutline#dd626a
- listFilterWidget.outline#983bce
- menu.background#251e2c
- menu.border#2f2537
- menu.foreground#c7c1cd
- menu.selectionBackground#983bce33
- menu.selectionForeground#c7c1cd
- menu.separatorBackground#2f2537
- menubar.selectionBackground#75618724
- menubar.selectionForeground#c7c1cd
- merge.border#2f253700
- merge.commonContentBackground#7561871f
- merge.commonHeaderBackground#75618740
- merge.currentContentBackground#28a45c24
- merge.currentHeaderBackground#28a45c4d
- merge.incomingContentBackground#b16ada24
- merge.incomingHeaderBackground#b16ada4d
- minimap.background#1c1622
- minimap.errorHighlight#dd626a
- minimap.findMatchHighlight#d1c12eb3
- minimap.selectionHighlight#983bce80
- minimap.warningHighlight#ab8326
- minimapGutter.addedBackground#28a45c
- minimapGutter.deletedBackground#d65d55
- minimapGutter.modifiedBackground#a67c28
- minimapSlider.activeBackground#75618742
- minimapSlider.background#7561871a
- minimapSlider.hoverBackground#7561872e
- notificationCenter.border#2f2537
- notificationCenterHeader.background#2c2334
- notificationCenterHeader.foreground#c7c1cd
- notificationLink.foreground#ad62d8
- notifications.background#251e2c
- notifications.border#2f2537
- notifications.foreground#c7c1cd
- notificationsErrorIcon.foreground#dd626a
- notificationsInfoIcon.foreground#b16ada
- notificationsWarningIcon.foreground#ab8326
- notificationToast.border#2f2537
- panel.background#16111a
- panel.border#2f2537
- panel.dropBorder#983bce
- panelInput.border#2f2537
- panelSection.border#2f2537
- panelSectionHeader.background#16111a
- panelSectionHeader.foreground#c7c1cd
- panelTitle.activeBorder#983bce
- panelTitle.activeForeground#c7c1cd
- panelTitle.inactiveForeground#715e82
- peekView.border#983bce8c
- peekViewEditor.background#17121c
- peekViewEditor.matchHighlightBackground#d1c12e52
- peekViewResult.background#16111a
- peekViewResult.fileForeground#c7c1cd
- peekViewResult.foreground#c7c1cd
- peekViewResult.lineForeground#9686a4
- peekViewResult.matchHighlightBackground#d1c12e52
- peekViewResult.selectionBackground#983bce2e
- peekViewResult.selectionForeground#c7c1cd
- peekViewTitle.background#16111a
- peekViewTitleDescription.foreground#9686a4
- peekViewTitleLabel.foreground#c7c1cd
- pickerGroup.border#2f2537
- pickerGroup.foreground#ad62d8
- ports.iconRunningProcessForeground#25a762
- problemsErrorIcon.foreground#dd626a
- problemsInfoIcon.foreground#b16ada
- problemsWarningIcon.foreground#ab8326
- progressBar.background#983bce
- quickInput.background#251e2c
- quickInput.foreground#c7c1cd
- quickInputList.focusBackground#983bce33
- quickInputList.focusForeground#c7c1cd
- quickInputList.focusIconForeground#ad62d8
- quickInputTitle.background#2c2334
- sash.hoverBorder#983bce80
- scrollbar.shadow#0806094d
- scrollbarSlider.activeBackground#75618773
- scrollbarSlider.background#75618733
- scrollbarSlider.hoverBackground#75618752
- search.resultsInfoForeground#9686a4
- searchEditor.findMatchBackground#d1c12e2e
- selection.background#983bce3d
- settings.checkboxBackground#251e2c
- settings.checkboxBorder#433550
- settings.dropdownBackground#251e2c
- settings.dropdownBorder#2f2537
- settings.focusedRowBackground#983bce12
- settings.headerForeground#c7c1cd
- settings.modifiedItemIndicator#983bce
- settings.numberInputBackground#241d2b
- settings.numberInputBorder#2f2537
- settings.rowHoverBackground#7561870f
- settings.textInputBackground#241d2b
- settings.textInputBorder#2f2537
- sideBar.background#16111a
- sideBar.border#2f253700
- sideBar.foreground#9282a1
- sideBarSectionHeader.background#16111a
- sideBarSectionHeader.border#2f253700
- sideBarSectionHeader.foreground#c7c1cd
- sideBarStickyScroll.background#16111a
- sideBarTitle.foreground#c7c1cd
- statusBar.background#110d14
- statusBar.border#2f253700
- statusBar.debuggingBackground#983bce
- statusBar.debuggingBorder#2f253700
- statusBar.debuggingForeground#f5f3f7
- statusBar.foreground#907f9f
- statusBar.noFolderBackground#110d14
- statusBar.noFolderForeground#907f9f
- statusBarItem.activeBackground#75618738
- statusBarItem.hoverBackground#75618724
- statusBarItem.prominentBackground#983bce3d
- statusBarItem.prominentForeground#c7c1cd
- statusBarItem.prominentHoverBackground#983bce57
- statusBarItem.remoteBackground#983bce
- statusBarItem.remoteForeground#f5f3f7
- symbolIcon.booleanForeground#de689b
- symbolIcon.classForeground#299dba
- symbolIcon.colorForeground#9d922f
- symbolIcon.constantForeground#a79a25
- symbolIcon.constructorForeground#738ce0
- symbolIcon.enumeratorForeground#299dba
- symbolIcon.enumeratorMemberForeground#a79a25
- symbolIcon.fieldForeground#798dd0
- symbolIcon.fileForeground#9686a4
- symbolIcon.folderForeground#9686a4
- symbolIcon.functionForeground#738ce0
- symbolIcon.interfaceForeground#299dba
- symbolIcon.keywordForeground#de689b
- symbolIcon.methodForeground#738ce0
- symbolIcon.moduleForeground#d77649
- symbolIcon.namespaceForeground#d77649
- symbolIcon.numberForeground#a79a25
- symbolIcon.propertyForeground#798dd0
- symbolIcon.snippetForeground#9d922f
- symbolIcon.stringForeground#25a784
- symbolIcon.textForeground#9686a4
- symbolIcon.variableForeground#c7c1cd
- tab.activeBackground#1c1622
- tab.activeBorder#1c162200
- tab.activeBorderTop#983bce
- tab.activeForeground#c7c1cd
- tab.activeModifiedBorder#a67c28
- tab.border#2f253700
- tab.hoverBackground#16111a
- tab.hoverForeground#c7c1cd
- tab.inactiveBackground#110d14
- tab.inactiveForeground#6f5c7f
- tab.inactiveModifiedBorder#a67c2880
- tab.lastPinnedBorder#2f2537
- tab.unfocusedActiveBackground#16111a
- tab.unfocusedActiveBorderTop#983bce59
- tab.unfocusedActiveForeground#9686a4
- tab.unfocusedInactiveForeground#675676
- terminal.ansiBlack#34293d
- terminal.ansiBlue#607ddc
- terminal.ansiBrightBlack#584568
- terminal.ansiBrightBlue#839ae4
- terminal.ansiBrightCyan#55a8bc
- terminal.ansiBrightGreen#55ba9f
- terminal.ansiBrightMagenta#e177a5
- terminal.ansiBrightRed#e27b81
- terminal.ansiBrightWhite#c7c1cd
- terminal.ansiBrightYellow#bab055
- terminal.ansiCyan#258fa9
- terminal.ansiGreen#25a784
- terminal.ansiMagenta#d9518c
- terminal.ansiRed#da565e
- terminal.ansiWhite#9282a1
- terminal.ansiYellow#a79a25
- terminal.background#16111a
- terminal.border#2f2537
- terminal.findMatchBackground#d1c12e52
- terminal.findMatchHighlightBackground#d1c12e2e
- terminal.foreground#c4bcca
- terminal.inactiveSelectionBackground#983bce21
- terminal.selectionBackground#983bce3d
- terminalCursor.background#16111a
- terminalCursor.foreground#ad62d8
- testing.iconErrored#dd626a
- testing.iconFailed#dd626a
- testing.iconPassed#25a762
- testing.iconQueued#ab8326
- testing.iconSkipped#756187
- testing.iconUnset#756187
- testing.message.error.decorationForeground#dd626a
- testing.runAction#25a762
- textBlockQuote.background#16111a
- textBlockQuote.border#983bce80
- textCodeBlock.background#16111a
- textLink.activeForeground#a554d4
- textLink.foreground#ad62d8
- textPreformat.background#983bce1a
- textPreformat.foreground#25a784
- textSeparator.foreground#2f2537
- titleBar.activeBackground#110d14
- titleBar.activeForeground#907f9f
- titleBar.border#2f253700
- titleBar.inactiveBackground#110d14
- titleBar.inactiveForeground#675676
- tree.inactiveIndentGuidesStroke#271f2e
- tree.indentGuidesStroke#31273a
- walkThrough.embeddedEditorBackground#16111a
- welcomePage.background#1c1622
- welcomePage.progress.background#2f2537
- welcomePage.progress.foreground#983bce
- welcomePage.tileBackground#16111a
- welcomePage.tileHoverBackground#2c2334
- widget.border#2f2537
- widget.shadow#08060970
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment, string.comment | #907ba3 | italic |
| comment.block.documentation storage.type, comment keyword | #907ba3 | italic bold |
| punctuation, meta.brace, punctuation.definition.parameters, punctuation.separator, punctuation.terminator | #9686a4 | — |
| variable, variable.other.readwrite, meta.definition.variable.name, support.variable, entity.name.variable | #c7c1cd | — |
| variable.parameter, meta.function.parameters variable | #cda79f | italic |
| variable.language, variable.language.this, variable.other.constant | #d77649 | italic |
| variable.other.property, meta.object-literal.key, support.type.property-name, variable.other.object.property | #798dd0 | — |
| keyword, keyword.control, keyword.other, storage, storage.type, storage.modifier, keyword.type | #de689b | — |
| keyword.operator, punctuation.accessor, storage.type.function.arrow | #bb688c | — |
| keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.default | #de689b | italic |
| string, string.quoted, punctuation.definition.string, string.template | #25a784 | — |
| punctuation.definition.template-expression, punctuation.section.embedded | #bb688c | — |
| string.regexp, constant.other.character-class.regexp, keyword.operator.quantifier.regexp | #219ebd | — |
| constant.character.escape, constant.character | #d77649 | — |
| constant.numeric, constant.language.numeric | #a79a25 | — |
| constant, constant.language, constant.language.boolean, constant.language.null, constant.language.undefined, support.constant | #a79a25 | — |
| entity.name.function, support.function, meta.function-call.generic, variable.function | #738ce0 | — |
| entity.name.method, meta.method entity.name.function | #738ce0 | — |
| entity.name.type, entity.name.class, entity.other.inherited-class, support.class, support.type, meta.type.annotation, entity.name.namespace | #299dba | — |
| meta.decorator, entity.name.function.decorator, punctuation.decorator | #9d922f | italic |
| entity.name.tag, punctuation.definition.tag, meta.tag | #d77649 | — |
| support.class.component, entity.name.tag.custom | #299dba | — |
| entity.other.attribute-name, meta.attribute | #9d922f | italic |
| entity.name.selector, entity.other.attribute-name.class, entity.other.attribute-name.id | #299dba | — |
| support.type.property-name.css, support.type.property-name.scss | #798dd0 | — |
| keyword.other.unit, constant.numeric.css | #a79a25 | — |
| support.type.property-name.json, meta.structure.dictionary.json string.quoted.double | #798dd0 | — |
| entity.name.tag.yaml | #798dd0 | — |
| markup.heading, entity.name.section.markdown, punctuation.definition.heading | #738ce0 | bold |
| markup.bold | #a79a25 | bold |
| markup.italic | #de689b | italic |
| markup.strikethrough | #907ba3 | strikethrough |
| markup.underline.link, string.other.link | #ad62d8 | underline |
| markup.quote | #907ba3 | italic |
| markup.inline.raw, markup.fenced_code, markup.raw | #25a784 | — |
| markup.list punctuation.definition.list, beginning.punctuation.definition.list | #d77649 | — |
| markup.inserted | #28a45c | — |
| markup.deleted | #d65d55 | — |
| markup.changed | #a67c28 | — |
| invalid, invalid.illegal | #dd626a | — |
| invalid.deprecated | #ab8326 | strikethrough |
| variable.other.normal.shell, string.interpolated.dollar.shell | #798dd0 | — |
| keyword.other.definition.ini, entity.name.section.ini | #798dd0 | — |