Skip to main content
Coding Theme

Monokai Pro

Publisher: monokaiThemes in package: 8

✨ Professional dark & light theme + icon pack, from the author of the original Monokai color scheme.

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.activeFocusBorder#ce4770
  • activityBar.background#ded5d0
  • activityBar.border#ded5d0
  • activityBar.foreground#72696d
  • activityBar.inactiveForeground#a59c9c
  • activityBarBadge.background#ce4770
  • activityBarBadge.foreground#f8efe7
  • activityBarTop.background#eee5de
  • activityBarTop.foreground#2c232e
  • activityBarTop.inactiveForeground#a59c9c
  • activityErrorBadge.background#ce4770
  • activityErrorBadge.foreground#f8efe7
  • activityWarningBadge.background#d4572b
  • activityWarningBadge.foreground#f8efe7
  • badge.background#d2c9c4
  • badge.foreground#92898a
  • banner.background#d2c9c4
  • banner.foreground#72696d
  • banner.iconForeground#72696d
  • breadcrumb.activeSelectionForeground#2c232e
  • breadcrumb.focusForeground#72696d
  • breadcrumb.foreground#92898a
  • breadcrumbPicker.background#f8efe7
  • button.background#ded5d0
  • button.foreground#2c232e
  • button.hoverBackground#d2c9c4
  • button.secondaryBackground#ded5d0
  • button.secondaryForeground#72696d
  • button.secondaryHoverBackground#d2c9c4
  • button.separator#f8efe7
  • charts.blue#2473b6
  • charts.foreground#2c232e
  • charts.green#218871
  • charts.lines#a59c9c
  • charts.orange#d4572b
  • charts.purple#6851a2
  • charts.red#ce4770
  • charts.yellow#b16803
  • chat.avatarBackground#f8efe7
  • chat.avatarForeground#6851a2
  • chat.linesAddedForeground#218871
  • chat.linesRemovedForeground#ce4770
  • chat.requestBackground#d2c9c4
  • chat.requestBorder#beb5b3
  • chat.requestBubbleBackground#f8efe7
  • chat.requestBubbleHoverBackground#d2c9c4
  • chat.requestCodeBorder#d2c9c4
  • chat.slashCommandBackground#00000000
  • chat.slashCommandForeground#ce4770
  • chat.thinkingShimmer#218871
  • checkbox.background#fdf7f3
  • checkbox.border#d2c9c4
  • checkbox.foreground#ce4770
  • commandCenter.activeBackground#f8efe7
  • commandCenter.activeForeground#72696d
  • commandCenter.background#eee5de
  • commandCenter.border#f8efe7
  • commandCenter.debuggingBackground#eee5de
  • commandCenter.foreground#92898a
  • debugConsole.errorForeground#ce4770
  • debugConsole.infoForeground#2473b6
  • debugConsole.sourceForeground#2c232e
  • debugConsole.warningForeground#d4572b
  • debugConsoleInputIcon.foreground#ce4770
  • debugExceptionWidget.background#fdf7f3
  • debugExceptionWidget.border#ded5d0
  • debugIcon.breakpointCurrentStackframeForeground#ce4770
  • debugIcon.breakpointDisabledForeground#72696d
  • debugIcon.breakpointForeground#ce4770
  • debugIcon.breakpointStackframeForeground#2c232e
  • debugIcon.breakpointUnverifiedForeground#d4572b
  • debugIcon.continueForeground#2c232e
  • debugIcon.disconnectForeground#2c232e
  • debugIcon.pauseForeground#2c232e
  • debugIcon.restartForeground#218871
  • debugIcon.startForeground#218871
  • debugIcon.stepBackForeground#2c232e
  • debugIcon.stepIntoForeground#2c232e
  • debugIcon.stepOutForeground#2c232e
  • debugIcon.stepOverForeground#2c232e
  • debugIcon.stopForeground#ce4770
  • debugTokenExpression.boolean#d4572b
  • debugTokenExpression.error#ce4770
  • debugTokenExpression.name#2473b6
  • debugTokenExpression.number#6851a2
  • debugTokenExpression.string#b16803
  • debugTokenExpression.value#2c232e
  • debugToolBar.background#d2c9c4
  • debugView.exceptionLabelBackground#ce4770
  • debugView.exceptionLabelForeground#f8efe7
  • debugView.stateLabelBackground#218871
  • debugView.stateLabelForeground#f8efe7
  • debugView.valueChangedHighlight#ce4770
  • descriptionForeground#92898a
  • diffEditor.diagonalFill#d2c9c4
  • diffEditor.insertedLineBackground#21887119
  • diffEditor.insertedTextBackground#21887119
  • diffEditor.move.border
  • diffEditor.moveActive.border
  • diffEditor.removedLineBackground#ce477019
  • diffEditor.removedTextBackground#ce477019
  • diffEditor.unchangedCodeBackground#eee5de
  • diffEditor.unchangedRegionBackground#eee5de
  • diffEditor.unchangedRegionForeground#72696d
  • diffEditor.unchangedRegionShadow#ded5d0
  • diffEditorGutter.insertedLineBackground#21887119
  • diffEditorGutter.removedLineBackground#ce477019
  • diffEditorOverview.insertedForeground#218871a5
  • diffEditorOverview.removedForeground#ce4770a5
  • disabledForeground#2c232e26
  • dropdown.background#fdf7f3
  • dropdown.border#d2c9c4
  • dropdown.foreground#92898a
  • dropdown.listBackground#fdf7f3
  • editor.background#f8efe7
  • editor.findMatchBackground#2c232e26
  • editor.findMatchBorder#b16803
  • editor.findMatchHighlightBackground#2c232e26
  • editor.findMatchHighlightBorder#00000000
  • editor.findRangeHighlightBackground#2c232e0c
  • editor.findRangeHighlightBorder#00000000
  • editor.focusedStackFrameHighlightBackground#72696d26
  • editor.foldBackground#2c232e0c
  • editor.foreground#2c232e
  • editor.hoverHighlightBackground#2c232e0c
  • editor.inactiveSelectionBackground#2c232e0c
  • editor.inlineValuesBackground#beb5b3
  • editor.inlineValuesForeground#72696d
  • editor.lineHighlightBackground#2c232e0c
  • editor.lineHighlightBorder#00000000
  • editor.linkedEditingBackground#d2c9c4
  • editor.rangeHighlightBackground#d2c9c4
  • editor.rangeHighlightBorder#d2c9c4
  • editor.selectionBackground#72696d26
  • editor.selectionHighlightBackground#2c232e26
  • editor.selectionHighlightBorder#00000000
  • editor.stackFrameHighlightBackground#72696d26
  • editor.wordHighlightBackground#2c232e26
  • editor.wordHighlightBorder#00000000
  • editor.wordHighlightStrongBackground#2c232e26
  • editor.wordHighlightStrongBorder#00000000
  • editorBracketHighlight.foreground1#ce4770
  • editorBracketHighlight.foreground2#d4572b
  • editorBracketHighlight.foreground3#b16803
  • editorBracketHighlight.foreground4#218871
  • editorBracketHighlight.foreground5#2473b6
  • editorBracketHighlight.foreground6#6851a2
  • editorBracketMatch.background#f8efe7
  • editorBracketMatch.border#a59c9c
  • editorCodeLens.foreground#a59c9c
  • editorCursor.background#f8efe7
  • editorCursor.foreground#2c232e
  • editorError.background#00000000
  • editorError.border#00000000
  • editorError.foreground#ce4770
  • editorGhostText.foreground#a59c9c
  • editorGroup.border#eee5de
  • editorGroup.dropBackground#eee5debf
  • editorGroup.emptyBackground#ded5d0
  • editorGroup.focusedEmptyBorder#eee5de
  • editorGroupHeader.noTabsBackground#f8efe7
  • editorGroupHeader.tabsBackground#f8efe7
  • editorGroupHeader.tabsBorder#f8efe7
  • editorGutter.addedBackground#218871
  • editorGutter.background#f8efe7
  • editorGutter.deletedBackground#ce4770
  • editorGutter.foldingControlForeground#72696d
  • editorGutter.modifiedBackground#d4572b
  • editorHint.border#f8efe7
  • editorHint.foreground#6851a2
  • editorHoverWidget.background#fdf7f3
  • editorHoverWidget.border#ded5d0
  • editorIndentGuide.background#d2c9c4
  • editorInfo.background#00000000
  • editorInfo.border#f8efe7
  • editorInfo.foreground#2473b6
  • editorInlayHint.background#d2c9c4
  • editorInlayHint.foreground#92898a
  • editorInlayHint.parameterBackground#d4572b0c
  • editorInlayHint.parameterForeground#d4572b7f
  • editorInlayHint.typeBackground#6851a20c
  • editorInlayHint.typeForeground#6851a27f
  • editorLightBulb.foreground#ce4770
  • editorLightBulbAi.foreground#ce4770
  • editorLightBulbAutoFix.foreground#218871
  • editorLineNumber.activeForeground#72696d
  • editorLineNumber.foreground#beb5b3
  • editorLink.activeForeground#2473b6
  • editorMarkerNavigation.background#d2c9c4
  • editorMarkerNavigationError.background#ce4770
  • editorMarkerNavigationInfo.background#2473b6
  • editorMarkerNavigationWarning.background#d4572b
  • editorOverviewRuler.addedForeground#218871
  • editorOverviewRuler.border#f8efe7
  • editorOverviewRuler.currentContentForeground#d2c9c4
  • editorOverviewRuler.deletedForeground#ce4770
  • editorOverviewRuler.errorForeground#ce4770
  • editorOverviewRuler.findMatchForeground#2c232e26
  • editorOverviewRuler.incomingContentForeground#d2c9c4
  • editorOverviewRuler.infoForeground#2473b6
  • editorOverviewRuler.modifiedForeground#d4572b
  • editorOverviewRuler.rangeHighlightForeground#2c232e26
  • editorOverviewRuler.selectionHighlightForeground#2c232e26
  • editorOverviewRuler.warningForeground#d4572b
  • editorOverviewRuler.wordHighlightForeground#2c232e26
  • editorOverviewRuler.wordHighlightStrongForeground#2c232e26
  • editorPane.background#f8efe7
  • editorRuler.foreground#beb5b3
  • editorStickyScroll.background#f8efe7
  • editorStickyScroll.border#d2c9c4
  • editorStickyScroll.shadow#f8efe7
  • editorStickyScrollHover.background#2c232e0c
  • editorSuggestWidget.background#fdf7f3
  • editorSuggestWidget.border#ded5d0
  • editorSuggestWidget.foreground#72696d
  • editorSuggestWidget.highlightForeground#2c232e
  • editorSuggestWidget.selectedBackground#eee5de
  • editorUnnecessaryCode.opacity#000000a5
  • editorWarning.background#00000000
  • editorWarning.border#00000000
  • editorWarning.foreground#d4572b
  • editorWhitespace.foreground#beb5b3
  • editorWidget.background#fdf7f3
  • editorWidget.border#ded5d0
  • errorForeground#ce4770
  • extensionBadge.remoteBackground#218871
  • extensionBadge.remoteForeground#2c232e
  • extensionButton.background#ded5d0
  • extensionButton.foreground#72696d
  • extensionButton.hoverBackground#d2c9c4
  • extensionButton.prominentBackground#ded5d0
  • extensionButton.prominentForeground#2c232e
  • extensionButton.prominentHoverBackground#d2c9c4
  • extensionIcon.preReleaseForeground#6851a2
  • extensionIcon.sponsorForeground#2473b6
  • extensionIcon.starForeground#ce4770
  • extensionIcon.verifiedForeground#218871
  • focusBorder#a59c9c
  • foreground#2c232e
  • gitDecoration.addedResourceForeground#218871
  • gitDecoration.conflictingResourceForeground#d4572b
  • gitDecoration.deletedResourceForeground#ce4770
  • gitDecoration.ignoredResourceForeground#a59c9c
  • gitDecoration.modifiedResourceForeground#b16803
  • gitDecoration.stageDeletedResourceForeground#ce4770
  • gitDecoration.stageModifiedResourceForeground#b16803
  • gitDecoration.untrackedResourceForeground#72696d
  • icon.foreground#92898a
  • inlineChat.background#f8efe7
  • inlineChat.border#eee5de
  • inlineChat.shadow#ded5d0
  • inlineChatDiff.inserted#21887119
  • inlineChatDiff.removed#21887119
  • inlineEdit.gutterIndicator.background#d2c9c4
  • inlineEdit.gutterIndicator.primaryBackground#d2c9c4
  • inlineEdit.gutterIndicator.primaryBorder#d2c9c4
  • inlineEdit.gutterIndicator.primaryForeground#6851a2
  • inlineEdit.gutterIndicator.secondaryBackground#d2c9c4
  • inlineEdit.gutterIndicator.secondaryBorder#d2c9c4
  • inlineEdit.gutterIndicator.secondaryForeground#b16803
  • inlineEdit.gutterIndicator.successfulBackground#d2c9c4
  • inlineEdit.gutterIndicator.successfulBorder#d2c9c4
  • inlineEdit.gutterIndicator.successfulForeground#218871
  • inlineEdit.modifiedBackground#21887119
  • inlineEdit.modifiedBorder#21887119
  • inlineEdit.modifiedChangedLineBackground#21887119
  • inlineEdit.modifiedChangedTextBackground#21887119
  • inlineEdit.originalBackground#ce477019
  • inlineEdit.originalBorder#ce477019
  • inlineEdit.originalChangedLineBackground#ce477019
  • inlineEdit.originalChangedTextBackground#ce477019
  • inlineEdit.tabWillAcceptModifiedBorder#21887119
  • inlineEdit.tabWillAcceptOriginalBorder#ce477019
  • input.background#f8efe7
  • input.border#d2c9c4
  • input.foreground#2c232e
  • input.placeholderForeground#beb5b3
  • inputOption.activeBackground#beb5b3
  • inputOption.activeBorder#beb5b3
  • inputOption.activeForeground#2c232e
  • inputOption.hoverBackground#beb5b3
  • inputValidation.errorBackground#d2c9c4
  • inputValidation.errorBorder#ce4770
  • inputValidation.errorForeground#ce4770
  • inputValidation.infoBackground#d2c9c4
  • inputValidation.infoBorder#2473b6
  • inputValidation.infoForeground#2473b6
  • inputValidation.warningBackground#d2c9c4
  • inputValidation.warningBorder#d4572b
  • inputValidation.warningForeground#d4572b
  • interactive.activeCodeBorder#a59c9c
  • interactive.inactiveCodeBorder#d2c9c4
  • keybindingLabel.background#eee5de
  • keybindingLabel.border#eee5de
  • keybindingLabel.bottomBorder#eee5de
  • keybindingLabel.foreground#72696d
  • list.activeSelectionBackground#2c232e0c
  • list.activeSelectionForeground#ce4770
  • list.dropBackground#ded5d0bf
  • list.errorForeground#ce4770
  • list.focusBackground#f8efe7
  • list.focusForeground#2c232e
  • list.highlightForeground#2c232e
  • list.hoverBackground#2c232e0c
  • list.hoverForeground#2c232e
  • list.inactiveFocusBackground#f8efe7
  • list.inactiveSelectionBackground#72696d0c
  • list.inactiveSelectionForeground#ce4770
  • list.invalidItemForeground#ce4770
  • list.warningForeground#d4572b
  • listFilterWidget.background#f8efe7
  • listFilterWidget.noMatchesOutline#ce4770
  • listFilterWidget.outline#f8efe7
  • listFilterWidget.shadow#ded5d0
  • menu.background#f8efe7
  • menu.border#eee5de
  • menu.foreground#2c232e
  • menu.selectionForeground#ce4770
  • menu.separatorBackground#d2c9c4
  • menubar.selectionForeground#2c232e
  • merge.border#f8efe7
  • merge.commonContentBackground#2c232e19
  • merge.commonHeaderBackground#2c232e26
  • merge.currentContentBackground#ce477019
  • merge.currentHeaderBackground#ce477026
  • merge.incomingContentBackground#21887119
  • merge.incomingHeaderBackground#21887126
  • mergeEditor.change.background#2c232e19
  • mergeEditor.change.word.background#2c232e19
  • mergeEditor.conflict.handled.minimapOverViewRuler#218871
  • mergeEditor.conflict.handledFocused.border#218871
  • mergeEditor.conflict.handledUnfocused.border#218871
  • mergeEditor.conflict.unhandled.minimapOverViewRuler#ce4770
  • mergeEditor.conflict.unhandledFocused.border#ce4770
  • mergeEditor.conflict.unhandledUnfocused.border#ce4770
  • minimap.chatEditHighlight#6851a2a5
  • minimap.errorHighlight#ce4770a5
  • minimap.findMatchHighlight#92898aa5
  • minimap.infoHighlight#2473b6a5
  • minimap.selectionHighlight#72696d26
  • minimap.selectionOccurrenceHighlight#a59c9ca5
  • minimap.warningHighlight#d4572ba5
  • minimapGutter.addedBackground#218871
  • minimapGutter.deletedBackground#ce4770
  • minimapGutter.modifiedBackground#b16803
  • notebook.cellBorderColor#d2c9c4
  • notebook.cellEditorBackground#eee5de7f
  • notebook.cellInsertionIndicator#2c232e
  • notebook.cellStatusBarItemHoverBackground#a59c9c
  • notebook.cellToolbarSeparator#d2c9c4
  • notebook.editorBackground#f8efe7
  • notebook.focusedEditorBorder#a59c9c
  • notebookStatusErrorIcon.foreground#ce4770
  • notebookStatusRunningIcon.foreground#2c232e
  • notebookStatusSuccessIcon.foreground#218871
  • notificationCenter.border#ded5d0
  • notificationCenterHeader.background#fdf7f3
  • notificationCenterHeader.foreground#92898a
  • notificationLink.foreground#ce4770
  • notifications.background#fdf7f3
  • notifications.border#ded5d0
  • notifications.foreground#72696d
  • notificationsErrorIcon.foreground#ce4770
  • notificationsInfoIcon.foreground#2473b6
  • notificationsWarningIcon.foreground#d4572b
  • notificationToast.border#ded5d0
  • panel.background#fdf7f3
  • panel.border#ded5d0
  • panel.dropBackground#eee5debf
  • panelStickyScroll.background#fdf7f3
  • panelStickyScroll.border#beb5b3
  • panelStickyScroll.shadow#fdf7f3
  • panelTitle.activeBorder#ce4770
  • panelTitle.activeForeground#ce4770
  • panelTitle.inactiveForeground#92898a
  • panelTitleBadge.background#ce4770
  • panelTitleBadge.foreground#f8efe7
  • peekView.border#ded5d0
  • peekViewEditor.background#fdf7f3
  • peekViewEditor.matchHighlightBackground#beb5b3
  • peekViewEditorGutter.background#fdf7f3
  • peekViewResult.background#fdf7f3
  • peekViewResult.fileForeground#92898a
  • peekViewResult.lineForeground#92898a
  • peekViewResult.matchHighlightBackground#beb5b3
  • peekViewResult.selectionBackground#d2c9c4
  • peekViewResult.selectionForeground#2c232e
  • peekViewTitle.background#eee5de
  • peekViewTitleDescription.foreground#92898a
  • peekViewTitleLabel.foreground#2c232e
  • pickerGroup.border#f8efe7
  • pickerGroup.foreground#beb5b3
  • ports.iconRunningProcessForeground#218871
  • problemsErrorIcon.foreground#ce4770
  • problemsInfoIcon.foreground#2473b6
  • problemsWarningIcon.foreground#d4572b
  • profileBadge.background#d2c9c4
  • profileBadge.foreground#72696d
  • progressBar.background#a59c9c
  • quickInput.background#fdf7f3
  • quickInput.foreground#92898a
  • radio.activeBackground#fdf7f3
  • radio.activeBorder#d2c9c4
  • radio.activeForeground#ce4770
  • radio.inactiveBackground#f8efe7
  • radio.inactiveBorder#d2c9c4
  • radio.inactiveForeground#92898a
  • radio.inactiveHoverBackground#fdf7f3
  • sash.hoverBorder#a59c9c
  • scmGraph.foreground1#ce4770
  • scmGraph.foreground2#d4572b
  • scmGraph.foreground3#b16803
  • scmGraph.foreground4#218871
  • scmGraph.foreground5#6851a2
  • scmGraph.historyItemBaseRefColor#2473b6
  • scmGraph.historyItemHoverAdditionsForeground#218871
  • scmGraph.historyItemHoverDefaultLabelBackground#92898a
  • scmGraph.historyItemHoverDefaultLabelForeground#f8efe7
  • scmGraph.historyItemHoverDeletionsForeground#ce4770
  • scmGraph.historyItemHoverLabelForeground#f8efe7
  • scmGraph.historyItemRefColor#6851a2
  • scmGraph.historyItemRemoteRefColor#218871
  • scrollbar.shadow#f8efe7
  • scrollbarSlider.activeBackground#2c232e59
  • scrollbarSlider.background#72696d26
  • scrollbarSlider.hoverBackground#2c232e26
  • selection.background#72696d26
  • settings.checkboxBackground#fdf7f3
  • settings.checkboxBorder#d2c9c4
  • settings.checkboxForeground#ce4770
  • settings.dropdownBackground#fdf7f3
  • settings.dropdownBorder#d2c9c4
  • settings.dropdownForeground#2c232e
  • settings.dropdownListBorder#92898a
  • settings.focusedRowBackground#d2c9c4
  • settings.focusedRowBorder#beb5b3
  • settings.headerForeground#ce4770
  • settings.modifiedItemForeground#ce4770
  • settings.modifiedItemIndicator#ce4770
  • settings.numberInputBackground#fdf7f3
  • settings.numberInputBorder#d2c9c4
  • settings.numberInputForeground#2c232e
  • settings.rowHoverBackground#2c232e0c
  • settings.sashBorder#d2c9c4
  • settings.settingsHeaderHoverForeground#2c232e
  • settings.textInputBackground#fdf7f3
  • settings.textInputBorder#d2c9c4
  • settings.textInputForeground#2c232e
  • sideBar.background#eee5de
  • sideBar.border#ded5d0
  • sideBar.dropBackground#eee5debf
  • sideBar.foreground#72696d
  • sideBarSectionHeader.background#eee5de
  • sideBarSectionHeader.foreground#a59c9c
  • sideBarStickyScroll.background#eee5de
  • sideBarStickyScroll.border#d2c9c4
  • sideBarStickyScroll.shadow#eee5de
  • sideBarTitle.foreground#a59c9c
  • simpleFindWidget.sashBorder
  • statusBar.background#eee5de
  • statusBar.border#ded5d0
  • statusBar.debuggingBackground#a59c9c
  • statusBar.debuggingBorder#eee5de
  • statusBar.debuggingForeground#2c232e
  • statusBar.focusBorder#d2c9c4
  • statusBar.foreground#92898a
  • statusBar.noFolderBackground#eee5de
  • statusBar.noFolderBorder#ded5d0
  • statusBar.noFolderForeground#92898a
  • statusBarItem.activeBackground#f8efe7
  • statusBarItem.errorBackground#f8efe7
  • statusBarItem.errorForeground#ce4770
  • statusBarItem.focusBorder#92898a
  • statusBarItem.hoverBackground#eee5de
  • statusBarItem.hoverForeground#2c232e
  • statusBarItem.offlineBackground
  • statusBarItem.offlineForeground
  • statusBarItem.prominentBackground#d2c9c4
  • statusBarItem.prominentHoverBackground#d2c9c4
  • statusBarItem.remoteBackground#eee5de
  • statusBarItem.remoteForeground#218871
  • statusBarItem.remoteHoverBackground#218871
  • statusBarItem.remoteHoverForeground#f8efe7
  • statusBarItem.warningBackground#f8efe7
  • statusBarItem.warningForeground#d4572b
  • symbolIcon.arrayForeground#ce4770
  • symbolIcon.booleanForeground#ce4770
  • symbolIcon.classForeground#2473b6
  • symbolIcon.colorForeground#6851a2
  • symbolIcon.constantForeground#6851a2
  • symbolIcon.constructorForeground#218871
  • symbolIcon.enumeratorForeground#d4572b
  • symbolIcon.enumeratorMemberForeground#d4572b
  • symbolIcon.eventForeground#d4572b
  • symbolIcon.fieldForeground#d4572b
  • symbolIcon.fileForeground#72696d
  • symbolIcon.folderForeground#72696d
  • symbolIcon.functionForeground#218871
  • symbolIcon.interfaceForeground#2473b6
  • symbolIcon.keyForeground#d4572b
  • symbolIcon.keywordForeground#ce4770
  • symbolIcon.methodForeground#218871
  • symbolIcon.moduleForeground#2473b6
  • symbolIcon.namespaceForeground#2473b6
  • symbolIcon.nullForeground#6851a2
  • symbolIcon.numberForeground#6851a2
  • symbolIcon.objectForeground#2473b6
  • symbolIcon.operatorForeground#ce4770
  • symbolIcon.packageForeground#6851a2
  • symbolIcon.propertyForeground#d4572b
  • symbolIcon.referenceForeground#6851a2
  • symbolIcon.snippetForeground#218871
  • symbolIcon.stringForeground#b16803
  • symbolIcon.structForeground#ce4770
  • symbolIcon.textForeground#b16803
  • symbolIcon.typeParameterForeground#d4572b
  • symbolIcon.unitForeground#6851a2
  • symbolIcon.variableForeground#2473b6
  • tab.activeBackground#f8efe7
  • tab.activeBorder#ce4770
  • tab.activeForeground#ce4770
  • tab.activeModifiedBorder#beb5b3
  • tab.border#f8efe7
  • tab.hoverBackground#f8efe7
  • tab.hoverBorder#beb5b3
  • tab.hoverForeground#2c232e
  • tab.inactiveBackground#f8efe7
  • tab.inactiveForeground#92898a
  • tab.inactiveModifiedBorder#beb5b3
  • tab.lastPinnedBorder#beb5b3
  • tab.unfocusedActiveBorder#92898a
  • tab.unfocusedActiveForeground#72696d
  • tab.unfocusedActiveModifiedBorder#d2c9c4
  • tab.unfocusedHoverBackground#f8efe7
  • tab.unfocusedHoverBorder#f8efe7
  • tab.unfocusedHoverForeground#72696d
  • tab.unfocusedInactiveForeground#92898a
  • tab.unfocusedInactiveModifiedBorder#d2c9c4
  • terminal.ansiBlack#d2c9c4
  • terminal.ansiBlue#d4572b
  • terminal.ansiBrightBlack#a59c9c
  • terminal.ansiBrightBlue#d4572b
  • terminal.ansiBrightCyan#2473b6
  • terminal.ansiBrightGreen#218871
  • terminal.ansiBrightMagenta#6851a2
  • terminal.ansiBrightRed#ce4770
  • terminal.ansiBrightWhite#2c232e
  • terminal.ansiBrightYellow#b16803
  • terminal.ansiCyan#2473b6
  • terminal.ansiGreen#218871
  • terminal.ansiMagenta#6851a2
  • terminal.ansiRed#ce4770
  • terminal.ansiWhite#2c232e
  • terminal.ansiYellow#b16803
  • terminal.background#fdf7f3
  • terminal.foreground#2c232e
  • terminal.selectionBackground#2c232e26
  • terminalCommandDecoration.defaultBackground#2c232e
  • terminalCommandDecoration.errorBackground#ce4770
  • terminalCommandDecoration.successBackground#218871
  • terminalCursor.background#00000000
  • terminalCursor.foreground#2c232e
  • testing.iconErrored#ce4770
  • testing.iconFailed#ce4770
  • testing.iconPassed#218871
  • testing.iconQueued#2c232e
  • testing.iconSkipped#d4572b
  • testing.iconUnset#92898a
  • testing.message.error.decorationForeground#ce4770
  • testing.message.error.lineBackground#ce477019
  • testing.message.info.decorationForeground#2c232e
  • testing.message.info.lineBackground#2c232e19
  • testing.runAction#b16803
  • textBlockQuote.background#ded5d0
  • textBlockQuote.border#ded5d0
  • textCodeBlock.background#ded5d0
  • textLink.activeForeground#2c232e
  • textLink.foreground#ce4770
  • textPreformat.foreground#2c232e
  • textSeparator.foreground#a59c9c
  • titleBar.activeBackground#eee5de
  • titleBar.activeForeground#92898a
  • titleBar.border#ded5d0
  • titleBar.inactiveBackground#eee5de
  • titleBar.inactiveForeground#beb5b3
  • tree.inactiveIndentGuidesStroke#f8efe7
  • tree.indentGuidesStroke#d2c9c4
  • walkThrough.embeddedEditorBackground#eee5de
  • welcomePage.buttonBackground#ded5d0
  • welcomePage.buttonHoverBackground#d2c9c4
  • welcomePage.progress.background#a59c9c
  • welcomePage.progress.foreground#92898a
  • welcomePage.tileBackground#ded5d0
  • welcomePage.tileHoverBackground#d2c9c4
  • welcomePage.tileShadow#ded5d0
  • widget.shadow#ded5d0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, comment keyword, comment markup.underline.link, comment string, comment punctuation.definition, comment punctuation, comment text#a59c9citalic
comment storage.type#a59c9c
comment entity.name.type#72696d
comment variable, comment variable.other#72696d
comment keyword, comment entity.name.tag, entity.name.tag.documentation#72696d
comment keyword.codetag.notation#6851a2
comment.git-status.header.remote#ce4770
comment.git-status.header.local#2473b6
comment.other.git-status.head#2c232e
string.quoted.docstring, string.quoted.docstring punctuation.definition#a59c9c
constant#6851a2
constant.other#2c232e
constant.other.java#6851a2
constant.other.caps#6851a2
constant.other.placeholder#d4572b
constant.other.property#6851a2
constant.other.citation.latex#6851a2
constant.other.color#6851a2
constant.other.character-class.escape#6851a2
constant.other.key#6851a2
constant.other.symbol#d4572b
constant.other.elm#2473b6
constant.numeric#6851a2
constant.language#6851a2
constant.character.escape#6851a2
constant.numeric.line-number.find-in-files#beb5b3
constant.numeric.line-number.match.find-in-files#b16803
entity.name.section#b16803
entity.name.function, entity.name.function.templated, entity.name.function.member.static#218871
entity.name.type.class.templated, entity.name.type.class.generic, entity.name.type.namespace#2473b6
entity.name.label#6851a2
entity.name.function.preprocessor#2473b6
entity.name#218871
entity.name.class#2473b6
entity.name.constant#6851a2
entity.name.namespace#2473b6
entity.other.inherited-class#2473b6italic
entity.name.function#218871
entity.name.tag, entity.name.tag.js.jsx support.class.component.js.jsx, entity.name.tag support.class.component, source.vue support.class.component#ce4770
source.ansible entity.name.tag#2473b6
entity.name.function.operator#ce4770
meta.brackets entity.name.function.operator, punctuation.separator entity.name.function.operator#92898a
entity.name.type, entity.name.type.class.reference, entity.name.type.class.value#2473b6
entity.other.attribute-name#2473b6italic
entity.other.attribute-name.class.css, entity.other.attribute-name.parent-selector-suffix.css, entity.other.attribute-name.parent-selector-suffix.css punctuation.definition.entity.css, entity.other.attribute-name.css, entity.other.animation-name.css#218871
entity.other.attribute-name.id.css#d4572b
entity.other.attribute-name.pseudo-class.css, entity.other.pseudo-class.css, entity.other.pseudo-element.css#2473b6italic
entity.name.function, support.function#218871
entity.other.git-status.hex#6851a2
entity.other.jinja2.delimiter#92898a
entity.name.operator.custom-literal#2c232e
entity.name.operator.custom-literal.string#b16803
entity.name.operator.custom-literal.number#6851a2
entity.name.type.rust#2473b6
entity.name.lifetime.rust#ce4770
invalid#ce4770italic underline
invalid.deprecated#d4572bitalic underline
keyword#ce4770
keyword.control#ce4770
keyword.control.directive#ce4770
keyword.operator, keyword.operator.member, keyword.operator.new#ce4770
keyword.other.substitution#92898a
keyword.other.template.begin, keyword.other.template.end#ce4770
keyword.operator.heading.restructuredtext, keyword.operator.table.row.restructuredtext keyword.operator.table.data.restructuredtext#92898a
keyword.other.parenthesis.elm#92898a
keyword.other.fn.rust, keyword.other.rust, keyword.other.unsafe.rust, keyword.other.where.rust#2473b6
keyword.control.rust, keyword.operator.misc.rust#ce4770
keyword.declaration.class.ruby, keyword.declaration.function.ruby, keyword.declaration.namespace.ruby#ce4770
markup.italicitalic
markup.boldbold
markup.heading#b16803
markup.raw#d4572b
markup.underlineunderline
markup.underline.link#218871
markup.inserted, markup.inserted punctuation.definition.inserted#218871
markup.deleted, markup.deleted punctuation.definition.deleted#ce4770
markup.changed, markup.changed punctuation.definition.changed#b16803
markup.ignored, markup.ignored punctuation.definition.ignored#92898a
markup.untracked#92898a
markup.quoteitalic
meta.brace.round, meta.brace.square, meta.brace.curly, meta.delimiter.comma.js, meta.function-call.without-arguments.js, meta.function-call.method.without-arguments.js#92898a
meta.function-call.generic.python, support.function.builtin.python#218871
meta.function-call.python meta.function-call.arguments.python#2c232e
meta.interpolation#d4572b
meta.instance.constructor#218871
meta.attribute-with-value.class string, meta.attribute.class.html string#218871
meta.attribute-with-value.id string, meta.attribute.id.html string#d4572b
source.json meta.mapping.key string#2c232e
source.yaml meta.mapping.key string#ce4770
meta.object.member#2c232e
meta.property-list.css variable.other#d4572b
entity.name.constant.preprocessor, meta.preprocessor#6851a2
meta.diff.git-diff.header#b16803
meta.type_params.rust#2c232e
meta.attribute.rust, meta.annotation.rust, variable.language.rust, variable.annotation.rust, meta.annotation.rust string, meta.annotation.rust keyword, meta.annotation.rust keyword.operator, meta.attribute.rust string#72696d
meta.type variable, meta.type variable.other.readwrite, variable.annotation, meta.decorator variable.other.readwrite#6851a2
punctuation#92898a
punctuation.definition.tag, punctuation.definition.tag source, punctuation.definition.group.begin.ruby, punctuation.definition.group.end.ruby, punctuation.definition.group.begin.css, punctuation.definition.group.end.css, punctuation.definition.string.end.html source.css, punctuation.definition.block, punctuation.definition.parameters.begin, punctuation.definition.parameters.end, punctuation.separator.parameter, punctuation.accessor, punctuation.terminator#92898a
punctuation.definition.group#2c232e
punctuation.definition.comment#a59c9c
punctuation.definition.variable, punctuation.definition.keyword.scss, punctuation.definition.entity.css#72696d
punctuation.section.embedded, punctuation.section.embedded entity.name.tag, punctuation.section.embedded constant.other, punctuation.section.embedded source, punctuation.section.embedded.begin#d4572b
punctuation.template-string.element.begin, punctuation.template-string.element.end, punctuation.definition.string.template.begin, punctuation.definition.string.template.end, string.quoted.template punctuation.definition.string.begin, string.quoted.template punctuation.definition.string.end, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end#ce4770
meta.paragraph.markdown meta.dummy.line-break, meta.paragraph.markdown meta.hard-line-break.markdown
markup.underline.link punctuation#218871
meta.brace.round, meta.brace.square, keyword.operator.type.annotation, meta.type storage.modifier.array#92898a
region.redish#ce4770
region.orangish#d4572b
region.yellowish#b16803
region.greenish#218871
region.bluish#2473b6
region.purplish#6851a2
region.pinkish#ce4770
region.whitish#FFFFFF
source#2c232e
source.scss, source.sass#92898a
source.sass variable.other, source.sass variable.sass, source.scss variable.other, source.scss variable.scss, source.scss variable.sass, source.css variable.other, source.css variable.scss, source.less variable.other, source.less variable.other.less, source.less variable.declaration.less#d4572bitalic
source.git-show.commit.sha#6851a2
source.git-show.author, source.git-show.date, source.git-diff.command, source.git-diff.command meta.diff.git-diff.header.from-file, source.git-diff.command meta.diff.git-diff.header.to-file#92898a
source.git-show meta.diff.git-diff.header.extended.index.from-sha, source.git-show meta.diff.git-diff.header.extended.index.to-sha#6851a2
source.git-show meta.diff.range.unified#d4572b
source.git-show meta.diff.header.from-file, source.git-show meta.diff.header.to-file#92898a
storage#ce4770
storage.type#2473b6italic
storage.type.extends#ce4770normal
storage.type.function.arrow#ce4770normal
storage.modifier, storage.type.modifier#ce4770italic
storage.class.restructuredtext.ref#6851a2
storage.modifier.visibility.rust, storage.modifier.lifetime.rust#ce4770
storage.modifier.const.rust, storage.modifier.dyn.rust, storage.modifier.mut.rust, storage.modifier.static.rust, storage.type.rust, storage.type.core.rust, storage.class.std.rust#2473b6
storage.type.rust, storage.modifier.const.rust, storage.modifier.dyn.rust, storage.modifier.mut.rust, storage.modifier.static.rust, keyword.other.rust, keyword.other.where.rust#ce4770
storage.modifier.import.java#2c232e
string#b16803
string.unquoted.label#2c232e
string source#2c232e
string source punctuation.section.embedded, string punctuation.definition.string source#92898a
string.other.link.title, string.other.link.description#ce4770
string.other.link.description.title#2473b6
string.regexp punctuation.definition.string.begin, string.regexp punctuation.definition.string.end#ce4770
string.other.ref, string.other.restructuredtext.ref#218871
string.other.git-status.help.key#72696d
string.other.git-status.remote#ce4770
support.constant#2473b6
support.constant.handlebars#92898a
support.type.vendor-prefix.css#72696d
support.function#218871
support.macro#218871
support.function.delimiter.elm#92898a
support.type, entity.name.type.object.console#2473b6italic
support.variable, support.variable.property#2473b6
support.type.property-name#2c232enormal
support.class#2473b6
support.constant.core.rust#6851a2
comment support, comment support.class#a59c9c
text#2c232e
text.find-in-files#2c232e
variable, variable.other#2c232e
variable.parameter, parameters variable.function#d4572bitalic
variable.language, variable.parameter.function.language.special.self.python, variable.parameter.function.language.special.cls.python#72696ditalic
variable.language.arguments#6851a2
variable.other.class#2473b6
variable.other.constant#6851a2
variable.other.readwrite#2c232e
variable.other.member#2c232e
variable.other.enummember#6851a2
variable.other.property, variable.other.property.static, variable.other.event#2c232e
variable.function#218871
variable.other.substitution#d4572b
source.ruby variable.other.readwrite.instance.ruby, source.ruby variable.other.readwrite.class.ruby#6851a2
source.jinja2 variable.other.jinja2.block#218871
source.jinja2 variable.other.jinja2#d4572b

Shiki preview

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

Loading...

Monokai Pro - Coding Theme