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#2D3650
• activityBar.activeBorder#FFD94A
• activityBar.background#171D2D
• activityBar.border#34405A
• activityBar.dropBorder#FFD94A
• activityBar.foreground#FFD94A
• activityBar.inactiveForeground#A9B0C3
• activityBarBadge.background#FFD94A
• activityBarBadge.foreground#211B08
• activityBarTop.activeBorder#FFD94A
• activityBarTop.dropBorder#FFD94A
• activityBarTop.foreground#FFD94A
• activityBarTop.inactiveForeground#A9B0C3
• badge.background#FFD94A
• badge.foreground#211B08
• button.background#8A6800
• button.foreground#FFFFFF
• button.hoverBackground#A47D00
• button.secondaryBackground#34405A
• button.secondaryForeground#F3EBC7
• button.secondaryHoverBackground#46516D
• checkbox.background#0D1423
• checkbox.border#46516D
• checkbox.foreground#F3EBC7
• commandCenter.activeBackground#252D42
• commandCenter.activeBorder#FFD94A
• commandCenter.activeForeground#FFFFFF
• commandCenter.background#182134
• commandCenter.border#46516D
• commandCenter.foreground#F3EBC7
• commandCenter.inactiveBorder#34405A
• commandCenter.inactiveForeground#8992AA
• descriptionForeground#A9B0C3
• disabledForeground#737C94
• dropdown.background#0D1423
• dropdown.border#46516D
• dropdown.foreground#F3EBC7
• editor.background#101522
• editor.border#34405A
• editor.foreground#F3EBC7
• editor.inactiveSelectionBackground#695A2D66
• editor.selectionBackground#695A2D99
• editorCursor.foreground#FFD94A
• editorGroup.border#34405A
• editorGroupHeader.noTabsBackground#111726
• editorGroupHeader.tabsBackground#111726
• editorGroupHeader.tabsBorder#252D42
• editorIndentGuide.activeBackground1#B9982F
• editorIndentGuide.background1#293147
• editorLineNumber.activeForeground#FFD94A
• editorLineNumber.foreground#737C94
• editorPane.background#101522
• focusBorder#FFD94A
• foreground#F3EBC7
• input.background#0D1423
• input.border#46516D
• input.foreground#F3EBC7
• input.placeholderForeground#8992AA
• inputOption.activeBackground#695A2D66
• inputOption.activeBorder#FFD94A
• inputOption.activeForeground#FFF8D8
• inputValidation.errorBackground#49242C
• inputValidation.errorBorder#FDA4AF
• inputValidation.infoBackground#183348
• inputValidation.infoBorder#7DD3FC
• inputValidation.warningBackground#433817
• inputValidation.warningBorder#E7D47A
• list.activeSelectionBackground#333D59
• list.activeSelectionForeground#FFFFFF
• list.dropBackground#695A2D66
• list.focusBackground#333D59
• list.focusForeground#FFFFFF
• list.highlightForeground#FFD94A
• list.hoverBackground#252D42
• list.hoverForeground#FFFFFF
• list.inactiveSelectionBackground#252D42
• list.inactiveSelectionForeground#DCE0EB
• menu.background#182134
• menu.border#46516D
• menu.foreground#F3EBC7
• menu.selectionBackground#333D59
• menu.selectionBorder#FFD94A
• menu.selectionForeground#FFFFFF
• menu.separatorBackground#46516D
• menubar.selectionBackground#252D42
• menubar.selectionBorder#46516D
• menubar.selectionForeground#FFFFFF
• minimapSlider.activeBackground#A9B0C399
• minimapSlider.background#737C9444
• minimapSlider.hoverBackground#8992AA77
• modernActivityBar.background#12192A
• modernActivityBar.border#46516D
• modernActivityBar.inactiveBackground#111726
• modernActivityBarItem.activeBackground#2D3650
• modernActivityBarItem.activeForeground#FFD94A
• modernActivityBarItem.hoverBackground#252D42
• modernActivityBarItem.hoverForeground#FFFFFF
• modernEditorTab.actionHoverBackground#333D59
• modernEditorTab.activeBackground#101522
• modernEditorTab.activeForeground#FFFFFF
• modernEditorTab.hoverBackground#252D42
• modernEditorTab.hoverForeground#FFFFFF
• modernEditorTab.selectedActionBackground#695A2D99
• modernEditorTab.selectedActionForeground#FFF8D8
• modernPanel.border#46516D
• modernSash.gripForeground#A9B0C366
• modernTab.activeBackground#333D59
• modernTab.activeForeground#FFFFFF
• modernTab.hoverBackground#252D42
• modernTab.hoverForeground#FFFFFF
• modernUI.inactiveShellBackground#111726
• modernUI.shellBackground#090E18
• notificationCenter.border#46516D
• notificationLink.foreground#7DD3FC
• notifications.background#182134
• notifications.border#46516D
• notifications.foreground#F3EBC7
• notificationToast.border#46516D
• panel.background#141B2A
• panel.border#3B4561
• panel.dropBorder#FFD94A
• panelInput.border#46516D
• panelTitle.activeBorder#FFD94A
• panelTitle.activeForeground#FFFFFF
• panelTitle.border#34405A
• panelTitle.inactiveForeground#8992AA
• scrollbar.shadow#05081099
• scrollbarSlider.activeBackground#A9B0C3AA
• scrollbarSlider.background#737C9455
• scrollbarSlider.hoverBackground#8992AA88
• sideBar.background#151B29
• sideBar.border#34405A
• sideBar.dropBackground#695A2D66
• sideBar.foreground#E5E8F0
• sideBarSectionHeader.background#252D42
• sideBarSectionHeader.border#34405A
• sideBarSectionHeader.foreground#FFFFFF
• sideBarStickyScroll.background#151B29
• sideBarStickyScroll.border#34405A
• sideBarTitle.border#34405A
• sideBarTitle.foreground#FFFFFF
• statusBar.background#6D5200
• statusBar.border#8A6800
• statusBar.debuggingBackground#7A3347
• statusBar.debuggingForeground#FFFFFF
• statusBar.foreground#FFFFFF
• statusBar.inactiveBackground#40391D
• statusBar.inactiveForeground#D6CEAA
• statusBar.noFolderBackground#473A70
• statusBarItem.activeBackground#FFFFFF33
• statusBarItem.focusBorder#FFFFFF
• statusBarItem.hoverBackground#FFFFFF26
• statusBarItem.prominentBackground#28314A
• statusBarItem.prominentForeground#FFD94A
• statusBarItem.prominentHoverBackground#36415F
• surface.background#182134
• surface.border#46516D
• surface.foreground#F3EBC7
• tab.activeBackground#101522
• tab.activeBorder#101522
• tab.activeBorderTop#FFD94A
• tab.activeForeground#FFFFFF
• tab.border#252D42
• tab.hoverBackground#252D42
• tab.hoverForeground#FFFFFF
• tab.inactiveBackground#171D2D
• tab.inactiveForeground#A9B0C3
• tab.lastPinnedBorder#46516D
• tab.unfocusedActiveBackground#101522
• tab.unfocusedActiveForeground#A9B0C3
• tab.unfocusedInactiveBackground#171D2D
• tab.unfocusedInactiveForeground#737C94
• terminal.ansiYellow#FFD94A
• titleBar.activeBackground#111726
• titleBar.activeForeground#F3EBC7
• titleBar.border#252D42
• titleBar.inactiveBackground#111726
• titleBar.inactiveForeground#8992AA
• window.activeBorder#46516D
• window.inactiveBorder#252D42

tokenColors

TextMate scopes and font styles (syntax highlighting rules).