Plane
Publisher: Plane themeThemes in package: 3
Plane color theme
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.activeBorder#E6E8EF
- activityBar.background#191919
- activityBar.border#282828
- activityBar.dropBorder#E6E8EF
- activityBar.foreground#E6E8EF
- activityBar.inactiveForeground#E6E8EF66
- activityBarBadge.background#226DFF
- activityBarBadge.foreground#E6E8EF
- badge.background#226DFF
- badge.foreground#E6E8EF
- banner.background#226cff64
- banner.foreground#E6E8EF
- banner.iconForeground#226DFF
- bookmarks.lineBackground#00000000
- bookmarks.lineBorder#00000000
- bookmarks.overviewRuler#157efb88
- breadcrumb.activeSelectionForeground#e0e0e0
- breadcrumb.background#191919
- breadcrumb.focusForeground#e0e0e0
- breadcrumb.foreground#cccccccc
- breadcrumbPicker.background#191919
- button.background#2B2B2B
- button.foreground#E6E8EF
- button.hoverBackground#226DFF
- button.secondaryBackground#3a3d41
- button.secondaryForeground#E6E8EF
- button.secondaryHoverBackground#45494e
- button.separator#FFFFFF10
- charts.blue#226DFF
- charts.foreground#cccccc
- charts.green#22DDCC
- charts.lines#cccccc80
- charts.orange#FF9A78
- charts.purple#b180d7
- charts.red#FF88AA
- charts.yellow#FFF1CC
- chat.requestBorder#E6E8EF1a
- checkbox.background#226DFF
- checkbox.border#226DFF
- checkbox.foreground#f0f0f0
- checkbox.selectBackground#226DFF
- checkbox.selectBorder#226DFF
- commandCenter.activeBackground#00000014
- commandCenter.activeBorder#cccccc4d
- commandCenter.activeForeground#cccccc
- commandCenter.background#0000000d
- commandCenter.border#282828
- commandCenter.foreground#cccccc
- commandCenter.inactiveBorder#282828
- commandCenter.inactiveForeground#ffffff3b
- commentsView.resolvedIcon#cccccc80
- commentsView.unresolvedIcon#007fd4
- debugConsole.errorForeground#FF88AA
- debugConsole.infoForeground#226DFF
- debugConsole.sourceForeground#cccccc
- debugConsole.warningForeground#FFF1CC
- debugConsoleInputIcon.foreground#cccccc
- debugExceptionWidget.background#420b0d
- debugExceptionWidget.border#a31515
- debugIcon.breakpointCurrentStackframeForeground#ffcc00
- debugIcon.breakpointDisabledForeground#848484
- debugIcon.breakpointForeground#e51400
- debugIcon.breakpointStackframeForeground#22DDCC
- debugIcon.breakpointUnverifiedForeground#848484
- debugIcon.continueForeground#75beff
- debugIcon.disconnectForeground#f48771
- debugIcon.pauseForeground#75beff
- debugIcon.restartForeground#22DDCC
- debugIcon.startForeground#22DDCC
- debugIcon.stepBackForeground#75beff
- debugIcon.stepIntoForeground#75beff
- debugIcon.stepOutForeground#75beff
- debugIcon.stepOverForeground#75beff
- debugIcon.stopForeground#f48771
- debugTokenExpression.boolean#4e94ce
- debugTokenExpression.error#FF88AA
- debugTokenExpression.name#c586c0
- debugTokenExpression.number#b5cea8
- debugTokenExpression.string#ce9178
- debugTokenExpression.value#cccccc99
- debugToolBar.background#2B2B2B
- debugView.exceptionLabelBackground#6c2022
- debugView.exceptionLabelForeground#cccccc
- debugView.stateLabelBackground#88888844
- debugView.stateLabelForeground#cccccc
- debugView.valueChangedHighlight#FF88AA
- descriptionForeground#ccccccb3
- diffEditor.diagonalFill#cccccc33
- diffEditor.insertedLineBackground#00aa992a
- diffEditor.insertedTextBackground#00aa992a
- diffEditor.move.border#8b8b8b9c
- diffEditor.removedLineBackground#fd002a2e
- diffEditor.removedTextBackground#fd002a2e
- diffEditor.unchangedCodeBackground#74747429
- diffEditor.unchangedRegionBackground#3e3e3e
- diffEditor.unchangedRegionForeground#a3a2a2
- disabledForeground#cccccc80
- dropdown.background#2b3044
- dropdown.border#3c3c3c
- dropdown.foreground#f0f0f0
- editor.background#191919
- editor.findMatchBackground#fff07c51
- editor.findMatchHighlightBackground#E6E8EF40
- editor.findRangeHighlightBackground#E6E8EF15
- editor.focusedStackFrameHighlightBackground#7abd7a4d
- editor.foldBackground#264f7820
- editor.foreground#E6E8EF
- editor.hoverHighlightBackground#ffffff13
- editor.inactiveSelectionBackground#c7d3ff11
- editor.inlineValuesBackground#ffc80033
- editor.inlineValuesForeground#E6E8EF80
- editor.lineHighlightBackground#ffffff0d
- editor.lineHighlightBorder#00000000
- editor.linkedEditingBackground#8650de3f
- editor.rangeHighlightBackground#E6E8EF0b
- editor.selectionBackground#e8f2f334
- editor.selectionHighlightBackground#ffffff0c
- editor.selectionHighlightBorder#d2c89769
- editor.snippetFinalTabstopHighlightBorder#525252
- editor.snippetTabstopHighlightBackground#7c7c7c4d
- editor.stackFrameHighlightBackground#ffff0033
- editor.symbolHighlightBackground#ea5c0055
- editor.wordHighlightBackground#575757b8
- editor.wordHighlightStrongBackground#004972b8
- editor.wordHighlightTextBackground#575757b8
- editorBracketHighlight.foreground1#E6E8EF
- editorBracketHighlight.foreground2#b486ff
- editorBracketHighlight.foreground3#6BD5FE
- editorBracketHighlight.foreground4#FFF1CC
- editorBracketHighlight.foreground5#22DDCC
- editorBracketHighlight.foreground6#00000000
- editorBracketHighlight.unexpectedBracket.foreground#fb0047
- editorBracketMatch.background#fdf90027
- editorBracketMatch.border#fdf90027
- editorBracketPairGuide.activeBackground1#00000000
- editorBracketPairGuide.activeBackground2#00000000
- editorBracketPairGuide.activeBackground3#00000000
- editorBracketPairGuide.activeBackground4#00000000
- editorBracketPairGuide.activeBackground5#00000000
- editorBracketPairGuide.activeBackground6#00000000
- editorBracketPairGuide.background1#00000000
- editorBracketPairGuide.background2#00000000
- editorBracketPairGuide.background3#00000000
- editorBracketPairGuide.background4#00000000
- editorBracketPairGuide.background5#00000000
- editorBracketPairGuide.background6#00000000
- editorCodeLens.foreground#999999
- editorCommentsWidget.rangeActiveBackground#007fd41a
- editorCommentsWidget.rangeBackground#007fd41a
- editorCommentsWidget.resolvedBorder#cccccc80
- editorCommentsWidget.unresolvedBorder#007fd4
- editorCursor.foreground#aeafad
- editorError.foreground#FF88AA
- editorGhostText.foreground#E6E8EF56
- editorGroup.border#282828
- editorGroup.dropBackground#226cff63
- editorGroup.dropIntoPromptBackground#191919
- editorGroup.dropIntoPromptForeground#cccccc
- editorGroupHeader.noTabsBackground#191919
- editorGroupHeader.tabsBackground#191919
- editorGroupHeader.tabsBorder#282828
- editorGutter.addedBackground#487e02
- editorGutter.background#191919
- editorGutter.commentGlyphForeground#E6E8EF
- editorGutter.commentRangeForeground#37373d
- editorGutter.commentUnresolvedGlyphForeground#E6E8EF
- editorGutter.deletedBackground#FF88AA
- editorGutter.foldingControlForeground#c5c5c5
- editorGutter.modifiedBackground#1b81a8
- editorHint.foreground#eeeeeeb3
- editorHoverWidget.background#2B2B2B
- editorHoverWidget.border#ffffff20
- editorHoverWidget.foreground#cccccc
- editorHoverWidget.highlightForeground#226DFF
- editorHoverWidget.statusBarBackground#ffffff11
- editorIndentGuide.activeBackground1#ffffff18
- editorIndentGuide.background1#ffffff02
- editorInfo.foreground#226DFF
- editorInlayHint.background#E6E8EF00
- editorInlayHint.foreground#cccccc
- editorInlayHint.parameterBackground#E6E8EF00
- editorInlayHint.parameterForeground#cccccc
- editorInlayHint.typeBackground#E6E8EF00
- editorInlayHint.typeForeground#cccccc
- editorLightBulb.foreground#ffcc00
- editorLightBulbAutoFix.foreground#75beff
- editorLineNumber.activeForeground#E6E8EF5e
- editorLineNumber.foreground#E6E8EF1b
- editorLink.activeForeground#6BD5FE
- editorMarkerNavigation.background#191919
- editorMarkerNavigationError.background#f33f5a
- editorMarkerNavigationError.headerBackground#FF88AA1a
- editorMarkerNavigationInfo.background#226DFF
- editorMarkerNavigationInfo.headerBackground#226DFF1a
- editorMarkerNavigationWarning.background#FFF1CC
- editorMarkerNavigationWarning.headerBackground#FFF1CC1a
- editorOverviewRuler.addedForeground#487e0299
- editorOverviewRuler.border#28282800
- editorOverviewRuler.bracketMatchForeground#a0a0a0
- editorOverviewRuler.commentForeground#37373d
- editorOverviewRuler.commentUnresolvedForeground#37373d
- editorOverviewRuler.commonContentForeground#60606066
- editorOverviewRuler.currentContentForeground#22DDCC38
- editorOverviewRuler.deletedForeground#FF88AA99
- editorOverviewRuler.errorForeground#FF88AAb3
- editorOverviewRuler.findMatchForeground#FF9A787e
- editorOverviewRuler.incomingContentForeground#40a6ff80
- editorOverviewRuler.infoForeground#226DFF
- editorOverviewRuler.modifiedForeground#1b81a899
- editorOverviewRuler.rangeHighlightForeground#226DFF99
- editorOverviewRuler.selectionHighlightForeground#a0a0a0cc
- editorOverviewRuler.warningForeground#FFF1CC
- editorOverviewRuler.wordHighlightForeground#a0a0a0cc
- editorOverviewRuler.wordHighlightStrongForeground#c0a0c0cc
- editorOverviewRuler.wordHighlightTextForeground#a0a0a0cc
- editorPane.background#191919
- editorRuler.foreground#5a5a5a
- editorStickyScroll.background#191919
- editorStickyScrollHover.background#2a2d2e
- editorSuggestWidget.background#2B2B2B
- editorSuggestWidget.border#ffffff1b
- editorSuggestWidget.focusHighlightForeground#00D0FF
- editorSuggestWidget.foreground#E6E8EF
- editorSuggestWidget.highlightForeground#00D0FF
- editorSuggestWidget.selectedBackground#226cff63
- editorSuggestWidget.selectedForeground#E6E8EF
- editorSuggestWidget.selectedIconForeground#E6E8EF
- editorSuggestWidgetStatus.foreground#E6E8EF80
- editorUnicodeHighlight.background#bd9b0326
- editorUnicodeHighlight.border#00D0FF
- editorUnnecessaryCode.opacity#000000aa
- editorWarning.foreground#FFF1CC
- editorWhitespace.foreground#191919
- editorWidget.background#2B2B2B
- editorWidget.border#ffffff20
- editorWidget.foreground#ffffff
- errorForeground#FF88AA
- extensionBadge.remoteBackground#226DFF
- extensionBadge.remoteForeground#E6E8EF
- extensionButton.background#226DFF
- extensionButton.foreground#E6E8EF
- extensionButton.hoverBackground#1177bb
- extensionButton.prominentBackground#226DFF
- extensionButton.prominentForeground#E6E8EF
- extensionButton.prominentHoverBackground#1177bb
- extensionButton.separator#E6E8EF66
- extensionIcon.preReleaseForeground#22DDCC
- extensionIcon.sponsorForeground#d758b3
- extensionIcon.starForeground#ff8e00
- extensionIcon.verifiedForeground#226DFF
- focusBorder#226DFF
- foreground#E6E8EF
- gitDecoration.addedResourceForeground#22DDCC
- gitDecoration.conflictingResourceForeground#e4676b
- gitDecoration.deletedResourceForeground#FF88AA
- gitDecoration.ignoredResourceForeground#ffffff2e
- gitDecoration.modifiedResourceForeground#FFF1CC
- gitDecoration.renamedResourceForeground#22DDCC
- gitDecoration.stageDeletedResourceForeground#FF88AA
- gitDecoration.stageModifiedResourceForeground#FFF1CC
- gitDecoration.submoduleResourceForeground#8db9e2
- gitDecoration.untrackedResourceForeground#22DDCC
- gitlens.closedAutolinkedIssueIconColor#a371f7
- gitlens.closedPullRequestIconColor#FF9A78
- gitlens.decorations.addedForegroundColor#22DDCC
- gitlens.decorations.branchAheadForegroundColor#22DDCC
- gitlens.decorations.branchBehindForegroundColor#FF88AA
- gitlens.decorations.branchDivergedForegroundColor#FFF1CC
- gitlens.decorations.branchMissingUpstreamForegroundColor#FF9A78
- gitlens.decorations.branchUnpublishedForegroundColor#22DDCC
- gitlens.decorations.copiedForegroundColor#22DDCC
- gitlens.decorations.deletedForegroundColor#FF88AA
- gitlens.decorations.ignoredForegroundColor#8c8c8c
- gitlens.decorations.modifiedForegroundColor#FFF1CC
- gitlens.decorations.renamedForegroundColor#22DDCC
- gitlens.decorations.untrackedForegroundColor#22DDCC
- gitlens.decorations.workspaceCurrentForegroundColor#22DDCC
- gitlens.decorations.workspaceRepoMissingForegroundColor#909090
- gitlens.decorations.workspaceRepoOpenForegroundColor#22DDCC
- gitlens.decorations.worktreeHasUncommittedChangesForegroundColor#FFF1CC
- gitlens.decorations.worktreeMissingForegroundColor#FF9A78
- gitlens.graphChangesColumnAddedColor#347d39
- gitlens.graphChangesColumnDeletedColor#FF88AA
- gitlens.graphLane10Color#2ece9d
- gitlens.graphLane1Color#15a0bf
- gitlens.graphLane2Color#0669f7
- gitlens.graphLane3Color#8e00c2
- gitlens.graphLane4Color#c517b6
- gitlens.graphLane5Color#d90171
- gitlens.graphLane6Color#cd0101
- gitlens.graphLane7Color#f25d2e
- gitlens.graphLane8Color#f2ca33
- gitlens.graphLane9Color#7bd938
- gitlens.graphMinimapMarkerHeadColor#05e617
- gitlens.graphMinimapMarkerHighlightsColor#fbff0a
- gitlens.graphMinimapMarkerLocalBranchesColor#3087cf
- gitlens.graphMinimapMarkerRemoteBranchesColor#2b5e88
- gitlens.graphMinimapMarkerStashesColor#b34db3
- gitlens.graphMinimapMarkerTagsColor#6b562e
- gitlens.graphMinimapMarkerUpstreamColor#09ae17
- gitlens.graphScrollMarkerHeadColor#05e617
- gitlens.graphScrollMarkerHighlightsColor#fbff0a
- gitlens.graphScrollMarkerLocalBranchesColor#3087cf
- gitlens.graphScrollMarkerRemoteBranchesColor#2b5e88
- gitlens.graphScrollMarkerStashesColor#b34db3
- gitlens.graphScrollMarkerTagsColor#6b562e
- gitlens.graphScrollMarkerUpstreamColor#09ae17
- gitlens.gutterBackgroundColor#E6E8EF13
- gitlens.gutterForegroundColor#bebebe
- gitlens.gutterUncommittedForegroundColor#00bcf299
- gitlens.lineHighlightBackgroundColor#00bcf233
- gitlens.lineHighlightOverviewRulerColor#00bcf299
- gitlens.mergedPullRequestIconColor#a371f7
- gitlens.openAutolinkedIssueIconColor#22DDCC
- gitlens.openPullRequestIconColor#22DDCC
- gitlens.trailingLineBackgroundColor#00000000
- gitlens.trailingLineForegroundColor#99999959
- gitlens.unpublishedChangesIconColor#22DDCC
- gitlens.unpublishedCommitIconColor#22DDCC
- gitlens.unpulledChangesIconColor#FF88AA
- icon.foreground#c5c5c5
- inlineChat.background#191919
- inlineChat.border#282828
- inlineChat.shadow#0000005c
- inlineChatDiff.inserted#9ccc2c1a
- inlineChatDiff.removed#ff00001a
- inlineChatInput.background#3c3c3c
- inlineChatInput.border#282828
- inlineChatInput.focusBorder#007fd4
- inlineChatInput.placeholderForeground#a6a6a6
- input.background#161616
- input.border#ffffff27
- input.foreground#cccccc
- input.placeholderForeground#a6a6a6
- inputOption.activeBackground#00d47c49
- inputOption.activeBorder#226DFF
- inputOption.activeForeground#E6E8EF
- inputOption.hoverBackground#5a5d5e80
- inputValidation.errorBackground#5a1d1d
- inputValidation.errorBorder#FF88AA
- inputValidation.infoBackground#063b49
- inputValidation.infoBorder#226DFF
- inputValidation.warningBackground#352a05
- inputValidation.warningBorder#b89500
- interactive.activeCodeBorder#226DFF
- interactive.inactiveCodeBorder#37373d
- keybindingLabel.background#FFFFFF00
- keybindingLabel.border#ffffff40
- keybindingLabel.bottomBorder#ffffff40
- keybindingLabel.foreground#ffffff
- keybindingTable.headerBackground#cccccc0a
- keybindingTable.rowsBackground#cccccc0a
- list.activeSelectionBackground#226cff63
- list.activeSelectionForeground#E6E8EF
- list.activeSelectionIconForeground#E6E8EF
- list.deemphasizedForeground#8c8c8c
- list.dropBackground#226cff63
- list.errorForeground#FF88AA
- list.filterMatchBackground#ea5c0055
- list.focusHighlightForeground#00D0FF
- list.focusOutline#226DFF
- list.highlightForeground#00D0FF
- list.hoverBackground#ffffff15
- list.inactiveSelectionBackground#ffffff10
- list.invalidItemForeground#FFF1CC
- list.warningForeground#FFF1CC
- listFilterWidget.background#2B2B2B
- listFilterWidget.noMatchesOutline#FF88AA
- listFilterWidget.outline#00000000
- listFilterWidget.shadow#0000005c
- menu.background#2B2B2B
- menu.border#FFFFFF20
- menu.foreground#E6E8EF
- menu.selectionBackground#226cff63
- menu.selectionForeground#E6E8EF
- menu.separatorBackground#282828
- menubar.selectionBackground#5a5d5e50
- menubar.selectionForeground#cccccc
- merge.commonContentBackground#60606029
- merge.commonHeaderBackground#60606066
- merge.currentContentBackground#40c8ae33
- merge.currentHeaderBackground#22DDCC38
- merge.incomingContentBackground#40a6ff20
- merge.incomingHeaderBackground#40a6ff46
- mergeEditor.change.background#9bb95533
- mergeEditor.change.word.background#9ccc2c33
- mergeEditor.changeBase.background#4b1818
- mergeEditor.changeBase.word.background#6f1313
- mergeEditor.conflict.handled.minimapOverViewRuler#adaca8ee
- mergeEditor.conflict.handledFocused.border#c1c1c1cc
- mergeEditor.conflict.handledUnfocused.border#86868649
- mergeEditor.conflict.input1.background#40c8ae33
- mergeEditor.conflict.input2.background#40a6ff33
- mergeEditor.conflict.unhandled.minimapOverViewRuler#FFF1CC57
- mergeEditor.conflict.unhandledFocused.border#FFF1CC57
- mergeEditor.conflict.unhandledUnfocused.border#ffa6007a
- mergeEditor.conflictingLines.background#ffea0047
- minimap.errorHighlight#FF88AAb3
- minimap.findMatchHighlight#ff9a7840
- minimap.foregroundOpacity#000000
- minimap.selectionHighlight#264f7840
- minimap.selectionOccurrenceHighlight#67676740
- minimap.warningHighlight#FFF1CC
- minimapGutter.addedBackground#487e02
- minimapGutter.deletedBackground#FF88AA
- minimapGutter.modifiedBackground#1b81a8
- minimapSlider.activeBackground#bfbfbf33
- minimapSlider.background#79797933
- minimapSlider.hoverBackground#64646459
- notebook.cellBorderColor#37373d
- notebook.cellEditorBackground#191919
- notebook.cellInsertionIndicator#007fd4
- notebook.cellStatusBarItemHoverBackground#E6E8EF26
- notebook.cellToolbarSeparator#2B2B2B
- notebook.editorBackground#191919
- notebook.focusedCellBorder#007fd4
- notebook.focusedEditorBorder#007fd4
- notebook.inactiveFocusedCellBorder#37373d
- notebook.selectedCellBackground#37373d
- notebook.selectedCellBorder#37373d
- notebook.symbolHighlightBackground#E6E8EF0b
- notebookEditorOverviewRuler.runningCellForeground#22DDCC
- notebookScrollbarSlider.activeBackground#bfbfbf66
- notebookScrollbarSlider.background#79797966
- notebookScrollbarSlider.hoverBackground#646464b3
- notebookStatusErrorIcon.foreground#FF88AA
- notebookStatusRunningIcon.foreground#cccccc
- notebookStatusSuccessIcon.foreground#22DDCC
- notificationCenter.border#ffffff10
- notificationCenterHeader.background#2B2B2B
- notificationLink.foreground#4aa5ff
- notifications.background#2B2B2B
- notifications.border#ffffff10
- notifications.foreground#cccccc
- notificationsErrorIcon.foreground#FF88AA
- notificationsInfoIcon.foreground#226DFF
- notificationsWarningIcon.foreground#FFF1CC
- notificationToast.border#2B2B2B
- panel.background#191919
- panel.border#282828
- panel.dropBorder#ffffff36
- panelSection.border#282828
- panelSection.dropBackground#53595d80
- panelSectionHeader.background#80808033
- panelSectionHeader.border#282828
- panelTitle.activeBorder#226DFF
- panelTitle.activeForeground#E6E8EF
- panelTitle.border#ffffff10
- panelTitle.inactiveForeground#c8d1dc
- peekView.border#226DFF
- peekViewEditor.background#2B2B2B
- peekViewEditor.matchHighlightBackground#ff8f0099
- peekViewEditorGutter.background#2B2B2B
- peekViewEditorStickyScroll.background#2B2B2B
- peekViewResult.background#191919
- peekViewResult.fileForeground#E6E8EF
- peekViewResult.lineForeground#bbbbbb
- peekViewResult.matchHighlightBackground#ea5c004d
- peekViewResult.selectionBackground#3399ff33
- peekViewResult.selectionForeground#E6E8EF
- peekViewTitle.background#191919
- peekViewTitleDescription.foreground#ccccccb3
- peekViewTitleLabel.foreground#E6E8EF
- pickerGroup.border#3f3f46
- pickerGroup.foreground#226DFF
- ports.iconRunningProcessForeground#22DDCC
- problemsErrorIcon.foreground#FF88AA
- problemsInfoIcon.foreground#226DFF
- problemsWarningIcon.foreground#FFF1CC
- profileBadge.background#4d4d4d
- profileBadge.foreground#E6E8EF
- progressBar.background#0e70c0
- quickInput.background#2B2B2B
- quickInput.foreground#E6E8EF
- quickInputList.focusBackground#226cff63
- quickInputList.focusForeground#ffffff
- quickInputList.focusIconForeground#ffffff
- quickInputTitle.background#E6E8EF1b
- sash.hoverBorder#007fd4
- scrollbar.shadow#00000086
- scrollbarSlider.activeBackground#fbfdff38
- scrollbarSlider.background#f3f9ff1d
- scrollbarSlider.hoverBackground#ffffff38
- search.resultsInfoForeground#cccccca6
- searchEditor.findMatchBackground#ff9a7835
- selection.background#226DFF
- settings.checkboxBorder#282828
- settings.checkboxForeground#f0f0f0
- settings.dropdownBackground#2B2B2B
- settings.dropdownBorder#2B2B2B
- settings.dropdownForeground#f0f0f0
- settings.dropdownListBorder#282828
- settings.focusedRowBackground#c7d3ff08
- settings.headerBorder#2B2B2B
- settings.headerForeground#ffffff
- settings.modifiedItemIndicator#ffffff10
- settings.numberInputBackground#2B2B2B
- settings.numberInputForeground#cccccc
- settings.rowHoverBackground#c7d3ff0d
- settings.sashBorder#2B2B2B
- settings.settingsHeaderHoverForeground#ffffff
- settings.textInputBackground#2B2B2B
- settings.textInputForeground#cccccc
- sideBar.background#191919
- sideBar.border#282828
- sideBar.dropBackground#226cff63
- sideBar.foreground#ffffffa6
- sideBarSectionHeader.background#ffffff12
- sideBarSectionHeader.border#ffffff12
- sideBarTitle.foreground#bbbbbb
- sideBySideEditor.horizontalBorder#ffffff12
- sideBySideEditor.verticalBorder#ffffff12
- statusBar.background#191919
- statusBar.border#ffffff12
- statusBar.debuggingBackground#ffea4b3c
- statusBar.debuggingForeground#E6E8EF
- statusBar.focusBorder#6cb3ff49
- statusBar.foreground#E6E8EF
- statusBar.noFolderBackground#68217a4b
- statusBar.noFolderForeground#E6E8EF
- statusBarItem.activeBackground#E6E8EF2e
- statusBarItem.compactHoverBackground#E6E8EF33
- statusBarItem.errorBackground#f33f5a
- statusBarItem.errorForeground#E6E8EF
- statusBarItem.focusBorder#E6E8EF
- statusBarItem.hoverBackground#E6E8EF1f
- statusBarItem.prominentBackground#00000080
- statusBarItem.prominentForeground#E6E8EF
- statusBarItem.prominentHoverBackground#0000004d
- statusBarItem.remoteBackground#226DFF
- statusBarItem.remoteForeground#E6E8EF
- statusBarItem.warningBackground#ff9a7876
- statusBarItem.warningForeground#E6E8EF
- symbolIcon.arrayForeground#cccccc
- symbolIcon.booleanForeground#cccccc
- symbolIcon.classForeground#FFF1CC
- symbolIcon.colorForeground#cccccc
- symbolIcon.constantForeground#cccccc
- symbolIcon.constructorForeground#b180d7
- symbolIcon.enumeratorForeground#FFF1CC
- symbolIcon.enumeratorMemberForeground#75beff
- symbolIcon.eventForeground#FFF1CC
- symbolIcon.fieldForeground#75beff
- symbolIcon.fileForeground#cccccc
- symbolIcon.folderForeground#cccccc
- symbolIcon.functionForeground#b180d7
- symbolIcon.interfaceForeground#75beff
- symbolIcon.keyForeground#cccccc
- symbolIcon.keywordForeground#cccccc
- symbolIcon.methodForeground#b180d7
- symbolIcon.moduleForeground#cccccc
- symbolIcon.namespaceForeground#cccccc
- symbolIcon.nullForeground#cccccc
- symbolIcon.numberForeground#cccccc
- symbolIcon.objectForeground#cccccc
- symbolIcon.operatorForeground#cccccc
- symbolIcon.packageForeground#cccccc
- symbolIcon.propertyForeground#cccccc
- symbolIcon.referenceForeground#cccccc
- symbolIcon.snippetForeground#cccccc
- symbolIcon.stringForeground#cccccc
- symbolIcon.structForeground#cccccc
- symbolIcon.textForeground#cccccc
- symbolIcon.typeParameterForeground#cccccc
- symbolIcon.unitForeground#cccccc
- symbolIcon.variableForeground#75beff
- tab.activeBackground#ffffff07
- tab.activeBorder#226DFF
- tab.activeForeground#FFFFFF
- tab.activeModifiedBorder#ffffff11
- tab.border#ffffff00
- tab.dragAndDropBorder#226DFF
- tab.hoverBackground#ffffff0c
- tab.hoverForeground#FFFFFF
- tab.inactiveBackground#E6E8EF00
- tab.inactiveForeground#E6E8EF80
- tab.inactiveModifiedBorder#3399cc80
- tab.lastPinnedBorder#cccccc33
- tab.unfocusedActiveBackground#191919
- tab.unfocusedActiveForeground#E6E8EF80
- tab.unfocusedActiveModifiedBorder#3399cc80
- tab.unfocusedInactiveBackground#E6E8EF00
- tab.unfocusedInactiveForeground#E6E8EF40
- tab.unfocusedInactiveModifiedBorder#3399cc40
- terminal.ansiBlack#2B2B2B
- terminal.ansiBlue#66DDFF
- terminal.ansiBrightBlack#666666
- terminal.ansiBrightBlue#B5E8FD
- terminal.ansiBrightCyan#B2FDFE
- terminal.ansiBrightGreen#96F3EC
- terminal.ansiBrightMagenta#CFBAF1
- terminal.ansiBrightRed#F8BDCF
- terminal.ansiBrightWhite#C4C4C4
- terminal.ansiBrightYellow#FFF9CF
- terminal.ansiCyan#88FFFF
- terminal.ansiGreen#22DDCC
- terminal.ansiMagenta#BBAAEE
- terminal.ansiRed#FF88AA
- terminal.ansiWhite#ffffff
- terminal.ansiYellow#FFEEBB
- terminal.background#191919
- terminal.border#2B2B2B
- terminal.dropBackground#226cff63
- terminal.findMatchBackground#515c6a40
- terminal.findMatchHighlightBackground#ea5c0055
- terminal.foreground#E6E8EF
- terminal.hoverHighlightBackground#264f7820
- terminal.inactiveSelectionBackground#ffffff2c
- terminal.selectionBackground#264f78
- terminal.tab.activeBorder#226DFF
- terminalCommandDecoration.defaultBackground#E6E8EF40
- terminalCommandDecoration.errorBackground#f33f5a
- terminalCommandDecoration.successBackground#1b81a8
- terminalOverviewRuler.cursorForeground#a0a0a0cc
- terminalOverviewRuler.findMatchForeground#FF9A787e
- testing.iconErrored#FF88AA
- testing.iconFailed#FF88AA
- testing.iconPassed#22DDCC
- testing.iconQueued#FFF1CC
- testing.iconSkipped#848484
- testing.iconUnset#848484
- testing.message.error.lineBackground#ff000033
- testing.message.info.decorationForeground#E6E8EF80
- testing.peekBorder#FF88AA
- testing.peekHeaderBackground#FF88AA1a
- testing.runAction#22DDCC
- textBlockQuote.background#7f7f7f1a
- textBlockQuote.border#226DFF80
- textCodeBlock.background#0a0a0a66
- textLink.activeForeground#b191e5
- textLink.foreground#BDA2E8
- textPreformat.foreground#FFF1CC
- textSeparator.foreground#E6E8EF2e
- titleBar.activeBackground#191919
- titleBar.activeForeground#ffffff87
- titleBar.border#ffffff10
- titleBar.inactiveBackground#191919
- titleBar.inactiveForeground#ffffff30
- toolbar.activeBackground#63666750
- toolbar.hoverBackground#5a5d5e50
- tree.inactiveIndentGuidesStroke#f8ffc011
- tree.indentGuidesStroke#c0ccff2d
- tree.tableColumnsBorder#cccccc20
- tree.tableOddRowsBackground#cccccc0a
- walkThrough.embeddedEditorBackground#00000066
- walkthrough.stepTitle.foreground#E6E8EF
- welcomePage.progress.background#3c3c3c
- welcomePage.progress.foreground#226DFF
- welcomePage.tileBackground#191919
- welcomePage.tileBorder#E6E8EF1a
- welcomePage.tileHoverBackground#ffffff11
- widget.border#2B2B2B
- widget.shadow#0000005c
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| meta.embedded, source.groovy.embedded, string meta.image.inline.markdown | #E6E8EF | — |
| emphasis | — | italic |
| strong | — | bold |
| header | #6BD5FE | — |
| comment | #D8E4FC75 | italic |
| constant.language | #E6E8EF | — |
| constant.numeric, variable.other.enummember, keyword.operator.plus.exponent, keyword.operator.minus.exponent | #E6E8EF | — |
| source.css.scss | #6BD5FE | — |
| constant.regexp | #646695 | — |
| entity.name.tag | #B486FF | — |
| entity.other.attribute-name | #22DDCC | — |
| invalid | #F44747 | — |
| markup.underline | — | underline |
| markup.bold | #FF88AA | bold |
| markup.heading | #FF88AA | bold |
| markup.italic | — | italic |
| markup.strikethrough | — | strikethrough |
| markup.inserted | #B5CEA8 | — |
| markup.deleted | #CE9178 | — |
| markup.changed | #FF88AA | — |
| punctuation.definition.quote.begin.markdown | #22DDCC | — |
| punctuation.definition.list.begin.markdown | #6BD5FE | — |
| markup.inline.raw | #CE9178 | — |
| punctuation.definition.tag | #B486FF | — |
| meta.preprocessor, entity.name.function.preprocessor | #B486FF | — |
| meta.preprocessor.string | #E6E8EF | — |
| meta.preprocessor.numeric | #B5CEA8 | — |
| meta.structure.dictionary.key.python | #9CDCFE | — |
| meta.diff.header | #FF88AA | — |
| storage | #B486FF | — |
| storage.type | #B486FF | — |
| storage.modifier, keyword.operator.noexcept | #B486FF | — |
| string | #FFF1CC | — |
| string.tag | #E6E8EF | — |
| string.value | #E6E8EF | — |
| string.regexp | #E6E8EF | — |
| punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded | #FFF1CC | — |
| meta.template.expression | #E6E8EF | — |
| keyword | #B486FF | — |
| keyword.control | #B486FF | italic |
| keyword.operator | #B486FF | — |
| keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.alignof, keyword.operator.typeid, keyword.operator.alignas, keyword.operator.instanceof, keyword.operator.logical.python, keyword.operator.wordlike | #FF88AA | — |
| keyword.other.unit | #E6E8EF | — |
| punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php | #FF88AA | — |
| support.function.git-rebase | #9CDCFE | — |
| constant.sha.git-rebase | #B5CEA8 | — |
| storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java | #E6E8EF | — |
| variable.language | #B486FF | italic |
| token.info-token | #6BD5FE | — |
| token.warn-token | #CD9731 | — |
| token.error-token | #F44747 | — |
| token.debug-token | #B486FF | — |
| entity.name.type, keyword.primitive-datatypes.swift, keyword.type.cs, meta.protocol-list.objc, meta.return-type.objc, source.go storage.type, source.groovy storage.type, source.java storage.type, source.powershell entity.other.attribute-name, storage.class.std.rust, storage.type.attribute.swift, storage.type.c, storage.type.core.rust, storage.type.cs, storage.type.groovy, storage.type.objc, storage.type.php, storage.type.haskell, storage.type.ocaml | #6BD5FE | italic |
| entity.name.function.target.makefile, entity.name.section.toml, entity.name.tag.yaml, variable.other.key.toml | #22DDCC | — |
| entity.name.function, meta.function-call.generic, meta.function-call.object, meta.function-call.php, meta.function-call.static, meta.method-call.java meta.method, meta.method.groovy, support.function.any-method.lua, keyword.operator.function.infix | #6BD5FE | — |
| entity.name.variable.parameter, meta.at-rule.function variable, meta.at-rule.mixin variable, meta.function.arguments variable.other.php, meta.selectionset.graphql meta.arguments.graphql variable.arguments.graphql, variable.parameter | #22DDCC | italic |
| keyword.control.trycatch.ts | #B486FF | — |
| support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less, source.coffee.embedded, meta.property-list.scss, variable.parameter.keyframe-list.css | #E6E8EF | — |
| support.type.property-name.css, meta.property-name.scss, source.css.scss, variable.css | #22DDCC | — |
| variable.argument.css, variable.scss | #6BD5FE | — |
| entity.name.tag.css | #E6E8EF | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.class.mixin.css, entity.other.attribute-name.id.css, entity.other.attribute-name.parent-selector.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css, source.css.less entity.other.attribute-name.id, entity.other.attribute-name.scss | #E6E8EF | — |
| entity.name.tag.reference.scss, entity.name.tag.custom.scss, keyword.operator.css | #B486FF | — |
| keyword.other.important.scss | #FF88AA | — |
| entity.name.type.type-parameter, meta.indexer.mappedtype.declaration entity.name.type, meta.type.parameters entity.name.type | #B486FF | — |
| meta.object-literal.key, support.type.property-name.json | #22DDCC | — |
| string.quoted.double.json | #E6E8EF | — |
| string.quoted.double.html | #E6E8EF | — |
| heading.1.markdown, heading.2.markdown, heading.3.markdown, heading.4.markdown, heading.5.markdown, heading.6.markdown | #E6E8EF | bold |
| markup.inline.raw.string.markdown | #FFF1CC | — |
| markup.bold.markdown | #FFFFFF | — |
| string.other.link.title.markdown, meta.link.inline.markdown | #B486FF | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...