Bananify for VS Code

Color themes

• 

  Banana Cream

• 

  Banana Grove

• 

  Midnight Banana

• 

  Monkey Jungle

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

Loading...

colors

Workbench UI color keys from the theme JSON colors map.

• activityBar.activeBackground#59372A
• activityBar.activeBorder#F9D56E
• activityBar.background#40261E
• activityBar.border#654333
• activityBar.dropBorder#F9D56E
• activityBar.foreground#F9D56E
• activityBar.inactiveForeground#C8AA91
• activityBarBadge.background#A8DB72
• activityBarBadge.foreground#102015
• activityBarTop.activeBorder#F9D56E
• activityBarTop.dropBorder#F9D56E
• activityBarTop.foreground#F9D56E
• activityBarTop.inactiveForeground#C8AA91
• badge.background#A8DB72
• badge.foreground#102015
• button.background#81502A
• button.foreground#FFFFFF
• button.hoverBackground#9A6336
• button.secondaryBackground#355842
• button.secondaryForeground#E9F4E8
• button.secondaryHoverBackground#4A6C52
• checkbox.background#0C2014
• checkbox.border#4A6C52
• checkbox.foreground#E9F4E8
• commandCenter.activeBackground#2D523A
• commandCenter.activeBorder#F9D56E
• commandCenter.activeForeground#FFFFFF
• commandCenter.background#203A29
• commandCenter.border#4A6C52
• commandCenter.foreground#E9F4E8
• commandCenter.inactiveBorder#355842
• commandCenter.inactiveForeground#91AA98
• descriptionForeground#B1C7B6
• disabledForeground#78917E
• dropdown.background#0C2014
• dropdown.border#4A6C52
• dropdown.foreground#E9F4E8
• editor.background#0D1C14
• editor.border#355842
• editor.foreground#E9F4E8
• editor.inactiveSelectionBackground#4D724E66
• editor.selectionBackground#4D724E99
• editorCursor.foreground#F9D56E
• editorGroup.border#355842
• editorGroupHeader.noTabsBackground#16291D
• editorGroupHeader.tabsBackground#16291D
• editorGroupHeader.tabsBorder#253F2E
• editorIndentGuide.activeBackground1#83B35C
• editorIndentGuide.background1#233B2B
• editorLineNumber.activeForeground#F9D56E
• editorLineNumber.foreground#6F8C76
• editorPane.background#0D1C14
• focusBorder#F9D56E
• foreground#E9F4E8
• input.background#0C2014
• input.border#4A6C52
• input.foreground#E9F4E8
• input.placeholderForeground#91AA98
• inputOption.activeBackground#4D724E66
• inputOption.activeBorder#F9D56E
• inputOption.activeForeground#F3F9E9
• inputValidation.errorBackground#4A2420
• inputValidation.errorBorder#E98B70
• inputValidation.infoBackground#143A31
• inputValidation.infoBorder#73D0A2
• inputValidation.warningBackground#463916
• inputValidation.warningBorder#F3B268
• list.activeSelectionBackground#2D523A
• list.activeSelectionForeground#FFFFFF
• list.dropBackground#4D724E66
• list.focusBackground#2D523A
• list.focusForeground#FFFFFF
• list.highlightForeground#A8DB72
• list.hoverBackground#203B2B
• list.hoverForeground#FFFFFF
• list.inactiveSelectionBackground#203B2B
• list.inactiveSelectionForeground#DCEBDD
• menu.background#203A29
• menu.border#4A6C52
• menu.foreground#E9F4E8
• menu.selectionBackground#2D523A
• menu.selectionBorder#F9D56E
• menu.selectionForeground#FFFFFF
• menu.separatorBackground#4A6C52
• menubar.selectionBackground#2D523A
• menubar.selectionBorder#4A6C52
• menubar.selectionForeground#FFFFFF
• minimapSlider.activeBackground#B1C7B699
• minimapSlider.background#78917E44
• minimapSlider.hoverBackground#91AA9877
• modernActivityBar.background#3A211A
• modernActivityBar.border#654333
• modernActivityBar.inactiveBackground#2A1B17
• modernActivityBarItem.activeBackground#59372A
• modernActivityBarItem.activeForeground#F9D56E
• modernActivityBarItem.hoverBackground#4B3026
• modernActivityBarItem.hoverForeground#FFFFFF
• modernEditorTab.actionHoverBackground#2D523A
• modernEditorTab.activeBackground#0D1C14
• modernEditorTab.activeForeground#FFFFFF
• modernEditorTab.hoverBackground#203B2B
• modernEditorTab.hoverForeground#FFFFFF
• modernEditorTab.selectedActionBackground#4D724E99
• modernEditorTab.selectedActionForeground#F3F9E9
• modernPanel.border#4A6C52
• modernSash.gripForeground#B1C7B666
• modernTab.activeBackground#2D523A
• modernTab.activeForeground#FFFFFF
• modernTab.hoverBackground#203B2B
• modernTab.hoverForeground#FFFFFF
• modernUI.inactiveShellBackground#13251A
• modernUI.shellBackground#0A160F
• notificationCenter.border#4A6C52
• notificationLink.foreground#73D0A2
• notifications.background#203A29
• notifications.border#4A6C52
• notifications.foreground#E9F4E8
• notificationToast.border#4A6C52
• panel.background#11251A
• panel.border#355842
• panel.dropBorder#F9D56E
• panelInput.border#4A6C52
• panelTitle.activeBorder#F9D56E
• panelTitle.activeForeground#FFFFFF
• panelTitle.border#355842
• panelTitle.inactiveForeground#91AA98
• scrollbar.shadow#050E0999
• scrollbarSlider.activeBackground#B1C7B6AA
• scrollbarSlider.background#78917E55
• scrollbarSlider.hoverBackground#91AA9888
• sideBar.background#14271B
• sideBar.border#355842
• sideBar.dropBackground#4D724E66
• sideBar.foreground#DCEBDD
• sideBarSectionHeader.background#203B2B
• sideBarSectionHeader.border#355842
• sideBarSectionHeader.foreground#FFFFFF
• sideBarStickyScroll.background#14271B
• sideBarStickyScroll.border#355842
• sideBarTitle.border#355842
• sideBarTitle.foreground#FFFFFF
• statusBar.background#70401F
• statusBar.border#925A32
• statusBar.debuggingBackground#8A432D
• statusBar.debuggingForeground#FFFFFF
• statusBar.foreground#FFFFFF
• statusBar.inactiveBackground#49372B
• statusBar.inactiveForeground#D8C5B4
• statusBar.noFolderBackground#37593A
• statusBarItem.activeBackground#FFFFFF33
• statusBarItem.focusBorder#FFFFFF
• statusBarItem.hoverBackground#FFFFFF26
• statusBarItem.prominentBackground#315438
• statusBarItem.prominentForeground#E9F4E8
• statusBarItem.prominentHoverBackground#416C4A
• surface.background#203A29
• surface.border#4A6C52
• surface.foreground#E9F4E8
• tab.activeBackground#0D1C14
• tab.activeBorder#0D1C14
• tab.activeBorderTop#F9D56E
• tab.activeForeground#FFFFFF
• tab.border#253F2E
• tab.hoverBackground#203B2B
• tab.hoverForeground#FFFFFF
• tab.inactiveBackground#14271B
• tab.inactiveForeground#B1C7B6
• tab.lastPinnedBorder#4A6C52
• tab.unfocusedActiveBackground#0D1C14
• tab.unfocusedActiveForeground#B1C7B6
• tab.unfocusedInactiveBackground#14271B
• tab.unfocusedInactiveForeground#78917E
• terminal.ansiYellow#F9D56E
• titleBar.activeBackground#16291D
• titleBar.activeForeground#E9F4E8
• titleBar.border#2A4734
• titleBar.inactiveBackground#16291D
• titleBar.inactiveForeground#91AA98
• window.activeBorder#4A6C52
• window.inactiveBorder#253F2E

tokenColors

TextMate scopes and font styles (syntax highlighting rules).