IKKI VSCode Dark Theme

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.

• actionBar.toggledBackground#d6d6d622
• activityBar.activeBackground#d6d6d633
• activityBar.activeBorder#00c2d1
• activityBar.activeFocusBorder#00c2d1
• activityBar.background#535353
• activityBar.border#383838
• activityBar.dropBorder#00c2d1
• activityBar.foreground#d6d6d6
• activityBar.inactiveForeground#989898
• activityBarBadge.background#00c2d1
• activityBarBadge.foreground#000000
• activityBarTop.activeBackground#d6d6d633
• activityBarTop.activeBorder#00c2d1
• activityBarTop.background#535353
• activityBarTop.dropBorder#00c2d1
• activityBarTop.foreground#d6d6d6
• activityBarTop.inactiveForeground#989898
• badge.background#00c2d1
• badge.foreground#000000
• banner.background#d6d6d633
• banner.foreground#ffb74d
• banner.iconForeground#d6d6d6
• breadcrumb.activeSelectionForeground#00c2d1
• breadcrumb.background#535353
• breadcrumb.focusForeground#00c2d1
• breadcrumb.foreground#d6d6d6
• breadcrumbPicker.background#424242
• button.background#00c2d1
• button.border#00c2d100
• button.foreground#000000
• button.hoverBackground#23d8de
• button.secondaryBackground#d6d6d633
• button.secondaryForeground#d6d6d6
• button.secondaryHoverBackground#d6d6d644
• button.separator#00000066
• charts.blue#5d9cec
• charts.foreground#d6d6d6
• charts.green#48cfad
• charts.lines#66666688
• charts.orange#ffb74d
• charts.purple#ac92ec
• charts.red#ed5565
• charts.yellow#ffce54
• chat.avatarBackground#00c2d1
• chat.avatarForeground#000000
• chat.requestBackground#454545
• chat.requestBorder#666666
• chat.slashCommandBackground#d6d6d633
• chat.slashCommandForeground#d6d6d6
• checkbox.background#454545
• checkbox.border#666666
• checkbox.foreground#00c2d1
• checkbox.selectBackground#454545
• checkbox.selectBorder#666666
• commandCenter.activeBackground#d6d6d622
• commandCenter.activeBorder#ffb74d
• commandCenter.activeForeground#d6d6d6
• commandCenter.background#d6d6d611
• commandCenter.border#383838
• commandCenter.debuggingBackground#d6d6d611
• commandCenter.foreground#d6d6d6cc
• commandCenter.inactiveBorder#383838cc
• commandCenter.inactiveForeground#989898
• commentsView.resolvedIcon#d6d6d6
• commentsView.unresolvedIcon#989898
• contrastActiveBorder#ffb74d00
• contrastBorder#00c2d100
• debugConsole.errorForeground#ff4d4f
• debugConsole.infoForeground#69c0ff
• debugConsole.sourceForeground#52c41a
• debugConsole.warningForeground#faad14
• debugConsoleInputIcon.foreground#d6d6d6
• debugExceptionWidget.background#660e1b
• debugExceptionWidget.border#b32430
• debugIcon.breakpointCurrentStackframeForeground#ffb74d
• debugIcon.breakpointDisabledForeground#888888
• debugIcon.breakpointForeground#f35800
• debugIcon.breakpointStackframeForeground#a0d468
• debugIcon.breakpointUnverifiedForeground#999999
• debugIcon.continueForeground#69c0ff
• debugIcon.disconnectForeground#ff4d4f
• debugIcon.pauseForeground#69c0ff
• debugIcon.restartForeground#52c41a
• debugIcon.startForeground#52c41a
• debugIcon.stepBackForeground#69c0ff
• debugIcon.stepIntoForeground#69c0ff
• debugIcon.stepOutForeground#69c0ff
• debugIcon.stepOverForeground#69c0ff
• debugIcon.stopForeground#ff4d4f
• debugTokenExpression.boolean#ed5565
• debugTokenExpression.error#fc6e51
• debugTokenExpression.name#d9b6ac
• debugTokenExpression.number#ed5565
• debugTokenExpression.string#ffb74d
• debugTokenExpression.value#ffb74d
• debugToolBar.background#424242
• debugToolBar.border#424242
• debugView.exceptionLabelBackground#fc6e51
• debugView.exceptionLabelForeground#000000
• debugView.stateLabelBackground#00c2d1
• debugView.stateLabelForeground#000000
• debugView.valueChangedHighlight#00b5e9
• descriptionForeground#aaaaaa
• diffEditor.border#383838
• diffEditor.diagonalFill#88888899
• diffEditor.insertedLineBackground#bede0b11
• diffEditor.insertedTextBackground#bede0b33
• diffEditor.insertedTextBorder#bede0b44
• diffEditor.move.border#666666
• diffEditor.moveActive.border#383838
• diffEditor.removedLineBackground#faa68511
• diffEditor.removedTextBackground#faa68533
• diffEditor.removedTextBorder#faa68544
• diffEditor.unchangedCodeBackground#424242
• diffEditor.unchangedRegionBackground#535353
• diffEditor.unchangedRegionForeground#d6d6d6
• diffEditor.unchangedRegionShadow#11111166
• diffEditorGutter.insertedLineBackground#bede0b44
• diffEditorGutter.removedLineBackground#faa68544
• diffEditorOverview.insertedForeground#bede0b
• diffEditorOverview.removedForeground#faa685
• disabledForeground#f0f0f066
• dropdown.background#454545
• dropdown.border#666666
• dropdown.foreground#f0f0f0
• dropdown.listBackground#454545
• editor.background#535353
• editor.findMatchBackground#ffb74d55
• editor.findMatchBorder#ffb74d99
• editor.findMatchHighlightBackground#ffb74d22
• editor.findMatchHighlightBorder#ffb74d66
• editor.findRangeHighlightBackground#ffb74d22
• editor.findRangeHighlightBorder#00000000
• editor.focusedStackFrameHighlightBackground#d6d6d633
• editor.foldBackground#d6d6d622
• editor.foreground#d6d6d6
• editor.hoverHighlightBackground#d6d6d633
• editor.inactiveSelectionBackground#d6d6d622
• editor.inlineValuesBackground#d6d6d666
• editor.inlineValuesForeground#d6d6d6
• editor.lineHighlightBackground#d6d6d622
• editor.lineHighlightBorder#00000000
• editor.linkedEditingBackground#d6d6d622
• editor.rangeHighlightBackground#ffb74d22
• editor.rangeHighlightBorder#00000000
• editor.selectionBackground#d6d6d633
• editor.selectionForeground#d6d6d6
• editor.selectionHighlightBackground#d6d6d622
• editor.selectionHighlightBorder#d6d6d666
• editor.snippetFinalTabstopHighlightBackground#00000000
• editor.snippetFinalTabstopHighlightBorder#00c2d1
• editor.snippetTabstopHighlightBackground#00000000
• editor.snippetTabstopHighlightBorder#00b5e9
• editor.stackFrameHighlightBackground#d6d6d622
• editor.symbolHighlightBackground#ffb74d22
• editor.symbolHighlightBorder#00000000
• editor.wordHighlightBackground#ac92ec33
• editor.wordHighlightBorder#ac92ec66
• editor.wordHighlightStrongBackground#ec87c033
• editor.wordHighlightStrongBorder#ec87c066
• editor.wordHighlightTextBackground#d6d6d633
• editor.wordHighlightTextBorder#d6d6d666
• editorBracketHighlight.foreground1#aaaaaa
• editorBracketHighlight.foreground2#aaaaaa
• editorBracketHighlight.foreground3#aaaaaa
• editorBracketHighlight.foreground4#aaaaaa
• editorBracketHighlight.foreground5#aaaaaa
• editorBracketHighlight.foreground6#aaaaaa
• editorBracketHighlight.unexpectedBracket.foreground#ff4d4f
• editorBracketMatch.background#d6d6d655
• editorBracketMatch.border#d6d6d699
• editorBracketPairGuide.activeBackground1#ffb74d
• editorBracketPairGuide.activeBackground2#ffb74d
• editorBracketPairGuide.activeBackground3#ffb74d
• editorBracketPairGuide.activeBackground4#ffb74d
• editorBracketPairGuide.activeBackground5#ffb74d
• editorBracketPairGuide.activeBackground6#ffb74d
• editorBracketPairGuide.background1#d6d6d699
• editorBracketPairGuide.background2#d6d6d699
• editorBracketPairGuide.background3#d6d6d699
• editorBracketPairGuide.background4#d6d6d699
• editorBracketPairGuide.background5#d6d6d699
• editorBracketPairGuide.background6#d6d6d699
• editorCodeLens.foreground#d6d6d6
• editorCommentsWidget.rangeActiveBackground#d6d6d633
• editorCommentsWidget.rangeBackground#99999966
• editorCommentsWidget.replyInputBackground#454545
• editorCommentsWidget.resolvedBorder#383838
• editorCommentsWidget.unresolvedBorder#666666
• editorCursor.background#000000
• editorCursor.foreground#00c2d1
• editorError.background#a64515cc
• editorError.border#faa685
• editorError.foreground#fddacc
• editorGhostText.background#d6d6d622
• editorGhostText.border#d6d6d600
• editorGhostText.foreground#f0f0f066
• editorGroup.border#383838
• editorGroup.dropBackground#00000099
• editorGroup.dropIntoPromptBackground#00c2d1
• editorGroup.dropIntoPromptBorder#00c2d1
• editorGroup.dropIntoPromptForeground#000000
• editorGroup.emptyBackground#535353
• editorGroup.focusedEmptyBorder#00c2d1
• editorGroupHeader.border#383838
• editorGroupHeader.noTabsBackground#424242
• editorGroupHeader.tabsBackground#424242
• editorGroupHeader.tabsBorder#666666
• editorGutter.addedBackground#bede0b
• editorGutter.background#535353
• editorGutter.commentGlyphForeground#aaaaaa
• editorGutter.commentRangeForeground#888888
• editorGutter.commentUnresolvedGlyphForeground#999999
• editorGutter.deletedBackground#faa685
• editorGutter.foldingControlForeground#d6d6d6
• editorGutter.modifiedBackground#00b5e9
• editorHint.border#bede0b
• editorHint.foreground#e4eeaa
• editorHoverWidget.background#424242
• editorHoverWidget.border#383838
• editorHoverWidget.foreground#d6d6d6
• editorHoverWidget.highlightForeground#ffb74d
• editorHoverWidget.statusBarBackground#535353
• editorIndentGuide.activeBackground1#ffb74d
• editorIndentGuide.activeBackground2#ffb74d
• editorIndentGuide.activeBackground3#ffb74d
• editorIndentGuide.activeBackground4#ffb74d
• editorIndentGuide.activeBackground5#ffb74d
• editorIndentGuide.activeBackground6#ffb74d
• editorIndentGuide.background1#88888899
• editorIndentGuide.background2#88888899
• editorIndentGuide.background3#88888899
• editorIndentGuide.background4#88888899
• editorIndentGuide.background5#88888899
• editorIndentGuide.background6#88888899
• editorInfo.background#458eb8cc
• editorInfo.border#84cef8
• editorInfo.foreground#d9f0fd
• editorInlayHint.background#d6d6d633
• editorInlayHint.foreground#d6d6d699
• editorInlayHint.parameterBackground#ac92ec33
• editorInlayHint.parameterForeground#ac92ec99
• editorInlayHint.typeBackground#ec87c033
• editorInlayHint.typeForeground#ec87c099
• editorLightBulb.foreground#ffb74d
• editorLightBulbAi.foreground#5d9cec
• editorLightBulbAutoFix.foreground#a0d468
• editorLineNumber.activeForeground#d6d6d6
• editorLineNumber.dimmedForeground#99999999
• editorLineNumber.foreground#999999
• editorLink.activeForeground#00c2d1
• editorMarkerNavigation.background#424242
• editorMarkerNavigationError.background#ff4d4f
• editorMarkerNavigationError.headerBackground#ff4d4f88
• editorMarkerNavigationInfo.background#69c0ff
• editorMarkerNavigationInfo.headerBackground#69c0ff88
• editorMarkerNavigationWarning.background#faad14
• editorMarkerNavigationWarning.headerBackground#faad1488
• editorMultiCursor.primary.background#000000
• editorMultiCursor.primary.foreground#00c2d1
• editorMultiCursor.secondary.background#000000
• editorMultiCursor.secondary.foreground#00b5e9
• editorOverviewRuler.addedForeground#bede0b
• editorOverviewRuler.background#424242
• editorOverviewRuler.border#383838
• editorOverviewRuler.bracketMatchForeground#f35800
• editorOverviewRuler.commentForeground#666666
• editorOverviewRuler.commentUnresolvedForeground#66666699
• editorOverviewRuler.commonContentForeground#99999999
• editorOverviewRuler.currentContentForeground#00c2d199
• editorOverviewRuler.deletedForeground#faa685
• editorOverviewRuler.errorForeground#fc6e51
• editorOverviewRuler.findMatchForeground#ffb74d99
• editorOverviewRuler.incomingContentForeground#00b5e999
• editorOverviewRuler.infoForeground#84cef8
• editorOverviewRuler.inlineChatInserted#e4eeaa
• editorOverviewRuler.inlineChatRemoved#fddacc
• editorOverviewRuler.modifiedForeground#00b5e9
• editorOverviewRuler.rangeHighlightForeground#ffb74d66
• editorOverviewRuler.selectionHighlightForeground#d6d6d699
• editorOverviewRuler.warningForeground#f7d82a
• editorOverviewRuler.wordHighlightForeground#ac92ec99
• editorOverviewRuler.wordHighlightStrongForeground#ec87c099
• editorOverviewRuler.wordHighlightTextForeground#d6d6d699
• editorPane.background#535353
• editorRuler.foreground#38383899
• editorStickyScroll.background#424242
• editorStickyScroll.border#383838
• editorStickyScroll.shadow#11111166
• editorStickyScrollHover.background#d6d6d622
• editorSuggestWidget.background#424242
• editorSuggestWidget.border#383838
• editorSuggestWidget.focusHighlightForeground#f35800
• editorSuggestWidget.foreground#d6d6d6
• editorSuggestWidget.highlightForeground#ffb74d
• editorSuggestWidget.selectedBackground#d6d6d633
• editorSuggestWidget.selectedForeground#f0f0f0
• editorSuggestWidget.selectedIconForeground#f0f0f0
• editorSuggestWidgetStatus.foreground#383838
• editorUnicodeHighlight.background#ffffff22
• editorUnicodeHighlight.border#00000000
• editorUnnecessaryCode.border#999999
• editorUnnecessaryCode.opacity#00000099
• editorWarning.background#9e880bcc
• editorWarning.border#f7d82a
• editorWarning.foreground#fdf3bd
• editorWatermark.foreground#d6d6d6cc
• editorWhitespace.foreground#888888
• editorWidget.background#535353
• editorWidget.border#00c2d1
• editorWidget.foreground#d6d6d6
• editorWidget.resizeBorder#00c2d1
• errorForeground#fc6e51
• extensionBadge.remoteBackground#00c2d1
• extensionBadge.remoteForeground#000000
• extensionButton.background#00c2d1
• extensionButton.foreground#000000
• extensionButton.hoverBackground#f35800
• extensionButton.prominentBackground#00c2d1
• extensionButton.prominentForeground#000000
• extensionButton.prominentHoverBackground#f35800
• extensionButton.separator#00000066
• extensionIcon.preReleaseForeground#f35800ee
• extensionIcon.sponsorForeground#00c2d1ee
• extensionIcon.starForeground#f35800ee
• extensionIcon.verifiedForeground#00c2d1ee
• focusBorder#ffb74d
• foreground#f0f0f0
• gitDecoration.addedResourceForeground#52c41a
• gitDecoration.conflictingResourceForeground#ac92ec
• gitDecoration.deletedResourceForeground#ff4d4f
• gitDecoration.ignoredResourceForeground#d6d6d666
• gitDecoration.modifiedResourceForeground#69c0ff
• gitDecoration.renamedResourceForeground#faad14
• gitDecoration.stageDeletedResourceForeground#ff4d4f
• gitDecoration.stageModifiedResourceForeground#69c0ff
• gitDecoration.submoduleResourceForeground#ec87c0
• gitDecoration.untrackedResourceForeground#52c41a
• icon.foreground#d6d6d6
• inlineChat.background#424242
• inlineChat.border#383838
• inlineChat.regionHighlight#53535388
• inlineChat.shadow#11111166
• inlineChatDiff.inserted#bede0b33
• inlineChatDiff.removed#faa68533
• inlineChatInput.background#454545
• inlineChatInput.border#666666
• inlineChatInput.focusBorder#ffb74d
• inlineChatInput.placeholderForeground#666666
• input.background#454545
• input.border#666666
• input.foreground#f0f0f0
• input.placeholderForeground#666666
• inputOption.activeBackground#e4eeaa
• inputOption.activeBorder#bede0b
• inputOption.activeForeground#809507
• inputOption.hoverBackground#d6d6d644
• inputValidation.errorBackground#fddacc
• inputValidation.errorBorder#faa685
• inputValidation.errorForeground#a64515
• inputValidation.infoBackground#d9f0fd
• inputValidation.infoBorder#84cef8
• inputValidation.infoForeground#458eb8
• inputValidation.warningBackground#fdf3bd
• inputValidation.warningBorder#f7d82a
• inputValidation.warningForeground#9e880b
• interactive.activeCodeBorder#383838
• interactive.inactiveCodeBorder#383838cc
• keybindingLabel.background#454545
• keybindingLabel.border#666666
• keybindingLabel.bottomBorder#666666
• keybindingLabel.foreground#f0f0f0
• keybindingTable.headerBackground#ffb74d
• keybindingTable.rowsBackground#d6d6d633
• list.activeSelectionBackground#d6d6d633
• list.activeSelectionForeground#d6d6d6
• list.activeSelectionIconForeground#d6d6d6
• list.deemphasizedForeground#666666
• list.dropBackground#999999cc
• list.dropBetweenBackground#d6d6d633
• list.errorForeground#ff4d4f
• list.filterMatchBackground#99999966
• list.filterMatchBorder#ffb74d
• list.focusAndSelectionOutline#d6d6d633
• list.focusBackground#d6d6d633
• list.focusForeground#d6d6d6
• list.focusHighlightForeground#f35800
• list.focusOutline#d6d6d633
• list.highlightForeground#f35800
• list.hoverBackground#d6d6d622
• list.hoverForeground#d6d6d6
• list.inactiveFocusBackground#d6d6d633
• list.inactiveFocusOutline#d6d6d633
• list.inactiveSelectionBackground#d6d6d633
• list.inactiveSelectionForeground#d6d6d6
• list.inactiveSelectionIconForeground#d6d6d6
• list.invalidItemForeground#fc6e51
• list.warningForeground#faad14
• listFilterWidget.background#535353
• listFilterWidget.noMatchesOutline#fc6e51
• listFilterWidget.outline#ffb74d
• listFilterWidget.shadow#11111166
• menu.background#535353
• menu.border#535353
• menu.foreground#d6d6d6
• menu.selectionBackground#00c2d1
• menu.selectionBorder#00c2d1
• menu.selectionForeground#000000
• menu.separatorBackground#383838
• menubar.selectionBackground#00c2d1
• menubar.selectionBorder#00c2d1
• menubar.selectionForeground#000000
• merge.border#383838
• merge.commonContentBackground#99999933
• merge.commonHeaderBackground#99999966
• merge.currentContentBackground#00c2d133
• merge.currentHeaderBackground#00c2d166
• merge.incomingContentBackground#00b5e933
• merge.incomingHeaderBackground#00b5e966
• mergeEditor.change.background#84cef866
• mergeEditor.change.word.background#84cef888
• mergeEditor.changeBase.background#84cef866
• mergeEditor.changeBase.word.background#84cef888
• mergeEditor.conflict.handled.minimapOverViewRuler#52c41a
• mergeEditor.conflict.handledFocused.border#ffb74d
• mergeEditor.conflict.handledUnfocused.border#52c41a
• mergeEditor.conflict.input1.background#00c2d133
• mergeEditor.conflict.input2.background#00b5e933
• mergeEditor.conflict.unhandled.minimapOverViewRuler#ff4d4f
• mergeEditor.conflict.unhandledFocused.border#ffb74d
• mergeEditor.conflict.unhandledUnfocused.border#ff4d4f
• mergeEditor.conflictingLines.background#f7d82a66
• minimap.background#535353
• minimap.errorHighlight#faa685
• minimap.findMatchHighlight#ffb74dcc
• minimap.foregroundOpacity#000000cc
• minimap.infoHighlight#ec87c0cc
• minimap.selectionHighlight#d6d6d6cc
• minimap.selectionOccurrenceHighlight#ac92eccc
• minimap.warningHighlight#f7d82a
• minimapGutter.addedBackground#bede0b
• minimapGutter.deletedBackground#faa685
• minimapGutter.modifiedBackground#84cef8
• minimapSlider.activeBackground#23d8de99
• minimapSlider.background#66666699
• minimapSlider.hoverBackground#00c2d199
• multiDiffEditor.background#535353
• multiDiffEditor.border#383838
• multiDiffEditor.headerBackground#424242
• notebook.cellBorderColor#383838
• notebook.cellEditorBackground#424242
• notebook.cellHoverBackground#d6d6d622
• notebook.cellInsertionIndicator#00c2d1
• notebook.cellStatusBarItemHoverBackground#d6d6d666
• notebook.cellToolbarSeparator#383838
• notebook.editorBackground#535353
• notebook.focusedCellBackground#d6d6d633
• notebook.focusedCellBorder#ffb74d
• notebook.focusedEditorBorder#ffb74d
• notebook.inactiveFocusedCellBorder#ffb74dcc
• notebook.inactiveSelectedCellBorder#00c2d1cc
• notebook.outputContainerBackgroundColor#424242
• notebook.outputContainerBorderColor#383838
• notebook.selectedCellBackground#d6d6d633
• notebook.selectedCellBorder#00c2d1
• notebook.symbolHighlightBackground#d6d6d655
• notebookEditorOverviewRuler.runningCellForeground#69c0ffcc
• notebookScrollbarSlider.activeBackground#23d8de99
• notebookScrollbarSlider.background#66666699
• notebookScrollbarSlider.hoverBackground#00c2d199
• notebookStatusErrorIcon.foreground#ff4d4f
• notebookStatusRunningIcon.foreground#69c0ff
• notebookStatusSuccessIcon.foreground#52c41a
• notificationCenter.border#383838
• notificationCenterHeader.background#424242
• notificationCenterHeader.foreground#d6d6d6
• notificationLink.foreground#00c2d1
• notifications.background#535353
• notifications.border#383838
• notifications.foreground#d6d6d6
• notificationsErrorIcon.foreground#ff4d4f
• notificationsInfoIcon.foreground#69c0ff
• notificationsWarningIcon.foreground#faad14
• notificationToast.border#383838
• outputView.background#535353
• outputViewStickyScroll.background#424242
• panel.background#424242
• panel.border#383838
• panel.dropBorder#00c2d1
• panelInput.border#666666
• panelSection.border#383838
• panelSection.dropBackground#00000099
• panelSectionHeader.background#424242
• panelSectionHeader.border#383838
• panelSectionHeader.foreground#d6d6d6
• panelTitle.activeBorder#00c2d1
• panelTitle.activeForeground#d6d6d6
• panelTitle.inactiveForeground#989898
• peekView.border#383838
• peekViewEditor.background#434a54
• peekViewEditor.matchHighlightBackground#ffb74d22
• peekViewEditor.matchHighlightBorder#ffb74d66
• peekViewEditorGutter.background#434a54
• peekViewEditorStickyScroll.background#656d78
• peekViewResult.background#434a54
• peekViewResult.fileForeground#d6d6d6
• peekViewResult.lineForeground#d6d6d699
• peekViewResult.matchHighlightBackground#ffb74d22
• peekViewResult.selectionBackground#d6d6d633
• peekViewResult.selectionForeground#d6d6d6
• peekViewTitle.background#38383888
• peekViewTitleDescription.foreground#d6d6d6
• peekViewTitleLabel.foreground#d6d6d6
• pickerGroup.border#383838
• pickerGroup.foreground#d6d6d6
• ports.iconRunningProcessForeground#69c0ff
• problemsErrorIcon.foreground#ff4d4f
• problemsInfoIcon.foreground#69c0ff
• problemsWarningIcon.foreground#faad14
• profileBadge.background#00c2d1
• profileBadge.foreground#000000
• progressBar.background#00c2d1
• quickInput.background#535353
• quickInput.foreground#d6d6d6
• quickInputList.focusBackground#d6d6d633
• quickInputList.focusForeground#d6d6d6
• quickInputList.focusIconForeground#d6d6d6
• quickInputTitle.background#424242
• sash.hoverBorder#666666
• scm.historyItemAdditionsForeground#bede0b
• scm.historyItemDeletionsForeground#faa685
• scm.historyItemSelectedStatisticsBorder#00c2d1
• scm.historyItemStatisticsBorder#383838
• scrollbar.shadow#383838
• scrollbarSlider.activeBackground#23d8de99
• scrollbarSlider.background#66666699
• scrollbarSlider.hoverBackground#00c2d199
• search.resultsInfoForeground#ffffff
• searchEditor.findMatchBackground#00c2d122
• searchEditor.findMatchBorder#00c2d166
• searchEditor.textInputBorder#00c2d1
• selection.background#66666688
• settings.checkboxBackground#454545
• settings.checkboxBorder#666666
• settings.checkboxForeground#00c2d1
• settings.dropdownBackground#454545
• settings.dropdownBorder#666666
• settings.dropdownForeground#f0f0f0
• settings.dropdownListBorder#666666
• settings.focusedRowBackground#d6d6d633
• settings.focusedRowBorder#ffb74d
• settings.headerBorder#383838
• settings.headerForeground#d6d6d6
• settings.modifiedItemIndicator#00b5e9
• settings.numberInputBackground#454545
• settings.numberInputBorder#666666
• settings.numberInputForeground#f0f0f0
• settings.rowHoverBackground#d6d6d622
• settings.sashBorder#383838
• settings.settingsHeaderHoverForeground#00c2d1
• settings.textInputBackground#454545
• settings.textInputBorder#666666
• settings.textInputForeground#f0f0f0
• sideBar.background#424242
• sideBar.border#383838
• sideBar.dropBackground#00000099
• sideBar.foreground#d6d6d6
• sideBarActivityBarTop.border#383838
• sideBarSectionHeader.background#535353
• sideBarSectionHeader.border#383838
• sideBarSectionHeader.foreground#d6d6d6
• sideBarTitle.foreground#d6d6d6
• sideBySideEditor.horizontalBorder#383838
• sideBySideEditor.verticalBorder#383838
• simpleFindWidget.sashBorder#383838
• statusBar.background#00c2d1
• statusBar.border#00c2d100
• statusBar.debuggingBackground#00b5e9
• statusBar.debuggingBorder#00b5e900
• statusBar.debuggingForeground#000000
• statusBar.focusBorder#ff9800
• statusBar.foreground#000000
• statusBar.noFolderBackground#d6d6d6
• statusBar.noFolderBorder#d6d6d600
• statusBar.noFolderForeground#000000
• statusBarItem.activeBackground#00000044
• statusBarItem.compactHoverBackground#00000044
• statusBarItem.errorBackground#ff4d4f
• statusBarItem.errorForeground#000000
• statusBarItem.errorHoverBackground#00000022
• statusBarItem.errorHoverForeground#000000cc
• statusBarItem.focusBorder#ff980000
• statusBarItem.hoverBackground#00000022
• statusBarItem.hoverForeground#000000cc
• statusBarItem.offlineBackground#888888
• statusBarItem.offlineForeground#000000
• statusBarItem.offlineHoverBackground#00000022
• statusBarItem.offlineHoverForeground#000000cc
• statusBarItem.prominentBackground#00000033
• statusBarItem.prominentForeground#000000
• statusBarItem.prominentHoverBackground#00000011
• statusBarItem.prominentHoverForeground#000000cc
• statusBarItem.remoteBackground#00c2d1
• statusBarItem.remoteForeground#000000
• statusBarItem.remoteHoverBackground#00000022
• statusBarItem.remoteHoverForeground#000000cc
• statusBarItem.warningBackground#faad14
• statusBarItem.warningForeground#000000
• statusBarItem.warningHoverBackground#00000022
• statusBarItem.warningHoverForeground#000000cc
• symbolIcon.arrayForeground#ccd1d9
• symbolIcon.booleanForeground#ed5565
• symbolIcon.classForeground#48cfad
• symbolIcon.colorForeground#ed5565
• symbolIcon.constantForeground#ed5565
• symbolIcon.constructorForeground#5d9cec
• symbolIcon.enumeratorForeground#5d9cec
• symbolIcon.enumeratorMemberForeground#5d9cec
• symbolIcon.eventForeground#ac92ec
• symbolIcon.fieldForeground#4fc1e9
• symbolIcon.fileForeground#f5f7fa
• symbolIcon.folderForeground#f5f7fa
• symbolIcon.functionForeground#ac92ec
• symbolIcon.interfaceForeground#ec87c0
• symbolIcon.keyForeground#d9b6ac
• symbolIcon.keywordForeground#a0d468
• symbolIcon.methodForeground#ac92ec
• symbolIcon.moduleForeground#a0d468
• symbolIcon.namespaceForeground#ec87c0
• symbolIcon.nullForeground#ed5565
• symbolIcon.numberForeground#ed5565
• symbolIcon.objectForeground#ccd1d9
• symbolIcon.operatorForeground#ccd1d9
• symbolIcon.packageForeground#a0d468
• symbolIcon.propertyForeground#d9b6ac
• symbolIcon.referenceForeground#ffce54
• symbolIcon.snippetForeground#ffce54
• symbolIcon.stringForeground#ffb74d
• symbolIcon.structForeground#5d9cec
• symbolIcon.textForeground#f5f7fa
• symbolIcon.typeParameterForeground#ec87c0
• symbolIcon.unitForeground#a0d468
• symbolIcon.variableForeground#48cfad
• tab.activeBackground#535353
• tab.activeBorder#535353
• tab.activeBorderTop#00c2d1
• tab.activeForeground#d6d6d6
• tab.activeModifiedBorder#00b5e9
• tab.border#666666
• tab.dragAndDropBorder#00c2d1
• tab.hoverBackground#535353
• tab.hoverBorder#666666
• tab.hoverForeground#d6d6d6
• tab.inactiveBackground#424242
• tab.inactiveForeground#989898
• tab.inactiveModifiedBorder#84cef8
• tab.lastPinnedBorder#383838
• tab.unfocusedActiveBackground#535353
• tab.unfocusedActiveBorder#535353
• tab.unfocusedActiveBorderTop#00c2d199
• tab.unfocusedActiveForeground#d6d6d699
• tab.unfocusedActiveModifiedBorder#00b5e999
• tab.unfocusedHoverBackground#535353
• tab.unfocusedHoverBorder#666666
• tab.unfocusedHoverForeground#d6d6d6
• tab.unfocusedInactiveBackground#424242
• tab.unfocusedInactiveForeground#98989899
• tab.unfocusedInactiveModifiedBorder#84cef899
• terminal.ansiBlack#e6e9ed
• terminal.ansiBlue#4a89dc
• terminal.ansiBrightBlack#f5f7fa
• terminal.ansiBrightBlue#5d9cec
• terminal.ansiBrightCyan#4fc1e9
• terminal.ansiBrightGreen#48cfad
• terminal.ansiBrightMagenta#ec87c0
• terminal.ansiBrightRed#ed5565
• terminal.ansiBrightWhite#a0d468
• terminal.ansiBrightYellow#ffb74d
• terminal.ansiCyan#3bafda
• terminal.ansiGreen#37bc9b
• terminal.ansiMagenta#d770ad
• terminal.ansiRed#da4453
• terminal.ansiWhite#8cc152
• terminal.ansiYellow#ff9800
• terminal.background#535353
• terminal.border#383838
• terminal.dropBackground#00000099
• terminal.findMatchBackground#ffb74d55
• terminal.findMatchBorder#ffb74d99
• terminal.findMatchHighlightBackground#ffb74d22
• terminal.findMatchHighlightBorder#ffb74d66
• terminal.foreground#d6d6d6
• terminal.hoverHighlightBackground#00c2d166
• terminal.inactiveSelectionBackground#ffffff11
• terminal.selectionBackground#ffffff22
• terminal.selectionForeground#ffffff
• terminal.tab.activeBorder#00c2d1
• terminalCommandDecoration.defaultBackground#69c0ff
• terminalCommandDecoration.errorBackground#ff4d4f
• terminalCommandDecoration.successBackground#52c41a
• terminalCursor.background#000000
• terminalCursor.foreground#00c2d1
• terminalOverviewRuler.cursorForeground#d6d6d699
• terminalOverviewRuler.findMatchForeground#ffb74d99
• terminalStickyScroll.background#424242
• terminalStickyScrollHover.background#d6d6d622
• testing.coverCountBadgeBackground#00c2d1
• testing.coverCountBadgeForeground#000000
• testing.coveredBackground#bede0b44
• testing.coveredBorder#bede0b
• testing.coveredGutterBackground#bede0b
• testing.iconErrored#faad14
• testing.iconErrored.retired#faad14cc
• testing.iconFailed#ff4d4f
• testing.iconFailed.retired#ff4d4fcc
• testing.iconPassed#52c41a
• testing.iconPassed.retired#52c41acc
• testing.iconQueued#69c0ff
• testing.iconQueued.retired#69c0ffcc
• testing.iconSkipped#ac92ec
• testing.iconSkipped.retired#ac92eccc
• testing.iconUnset#888888
• testing.iconUnset.retired#888888cc
• testing.message.error.decorationForeground#faa685
• testing.message.error.lineBackground#faa68544
• testing.message.info.decorationForeground#84cef8
• testing.message.info.lineBackground#84cef844
• testing.messagePeekBorder#383838
• testing.messagePeekHeaderBackground#38383888
• testing.peekBorder#383838
• testing.peekHeaderBackground#38383888
• testing.runAction#bede0b
• testing.uncoveredBackground#d6d6d644
• testing.uncoveredBorder#d6d6d6
• testing.uncoveredBranchBackground#38383844
• testing.uncoveredGutterBackground#d6d6d6
• textBlockQuote.background#656d78
• textBlockQuote.border#aab2bd
• textCodeBlock.background#535353
• textLink.activeForeground#23d8de
• textLink.foreground#00c2d1
• textPreformat.background#33333399
• textPreformat.foreground#00b5e9
• textSeparator.foreground#383838
• titleBar.activeBackground#535353
• titleBar.activeForeground#d6d6d6
• titleBar.border#383838
• titleBar.inactiveBackground#424242
• titleBar.inactiveForeground#989898
• toolbar.activeBackground#d6d6d633
• toolbar.hoverBackground#d6d6d633
• toolbar.hoverOutline#d6d6d633
• tree.inactiveIndentGuidesStroke#666666
• tree.indentGuidesStroke#666666
• tree.tableColumnsBorder#66666688
• tree.tableOddRowsBackground#d6d6d622
• walkThrough.embeddedEditorBackground#424242
• walkthrough.stepTitle.foreground#ffb74d
• welcomePage.background#535353
• welcomePage.progress.background#d6d6d633
• welcomePage.progress.foreground#00c2d1
• welcomePage.tileBackground#d6d6d622
• welcomePage.tileBorder#383838
• welcomePage.tileHoverBackground#d6d6d633
• widget.border#666666
• widget.shadow#11111166
• window.activeBorder#383838
• window.inactiveBorder#383838cc

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...