Haho Vs Code Premium

Color themes

• 

  Haho Sunset Neon

• 

  Haho Synthwave 84

• 

  Haho Toxic Lime

• 

  Haho Volcano Pro

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#ff3b30
• activityBar.background#180909
• activityBar.foreground#fff2e9
• activityBar.inactiveForeground#fff2e980
• activityBarBadge.background#ff3b30
• activityBarBadge.foreground#001018
• badge.background#ff8a00
• badge.foreground#ffffff
• button.background#ff3b30
• button.foreground#001018
• button.hoverBackground#ff5e55
• button.secondaryBackground#4e1612
• button.secondaryForeground#fff2e9
• descriptionForeground#fff2e9B5
• dropdown.background#190a09
• dropdown.border#ff3b3065
• dropdown.foreground#fff2e9
• editor.background#120707
• editor.findMatchBackground#ffd16655
• editor.findMatchHighlightBackground#ff8a0035
• editor.foreground#fff2e9
• editor.lineHighlightBackground#ff3b3012
• editor.selectionBackground#ff3b3035
• editor.selectionHighlightBackground#ff8a0022
• editorBracketMatch.border#ffd166
• editorCursor.foreground#ffd166
• editorGroup.border#ff3b3028
• editorGroupHeader.tabsBackground#150808
• editorGutter.addedBackground#ff8a00
• editorGutter.background#120707
• editorGutter.deletedBackground#ff4d6d
• editorGutter.modifiedBackground#ff3b30
• editorHoverWidget.background#1c0b0a
• editorHoverWidget.border#ff3b3080
• editorIndentGuide.activeBackground1#ff3b3080
• editorIndentGuide.background1#fff2e914
• editorLineNumber.activeForeground#ff3b30
• editorLineNumber.foreground#fff2e955
• editorSuggestWidget.background#1c0b0a
• editorSuggestWidget.border#ff3b3080
• editorSuggestWidget.foreground#fff2e9
• editorSuggestWidget.selectedBackground#4e1612
• editorWhitespace.foreground#fff2e920
• editorWidget.background#1c0b0a
• editorWidget.border#ff3b3080
• errorForeground#ff4d6d
• focusBorder#ff3b30
• foreground#fff2e9
• icon.foreground#fff2e9D0
• input.background#190a09
• input.border#ff3b3065
• input.foreground#fff2e9
• inputOption.activeBorder#ff3b30
• list.activeSelectionBackground#4e1612
• list.activeSelectionForeground#fff2e9
• list.focusOutline#ff3b30
• list.highlightForeground#ffd166
• list.hoverBackground#ff3b3014
• list.inactiveSelectionBackground#ff3b3020
• menu.background#1c0b0a
• menu.border#ff3b3050
• menu.foreground#fff2e9
• menu.selectionBackground#4e1612
• menu.selectionForeground#fff2e9
• menubar.selectionBackground#ff3b3020
• menubar.selectionForeground#fff2e9
• minimap.background#120707
• panel.background#2e0f0d
• panel.border#ff3b3035
• panelTitle.activeBorder#ff3b30
• panelTitle.activeForeground#fff2e9
• panelTitle.inactiveForeground#fff2e988
• sash.hoverBorder#ff3b30
• scrollbarSlider.activeBackground#ff3b3075
• scrollbarSlider.background#ff3b3030
• scrollbarSlider.hoverBackground#ff3b3055
• sideBar.background#2e0f0d
• sideBar.border#ff3b3035
• sideBar.foreground#fff2e9
• sideBarSectionHeader.background#190a09
• sideBarSectionHeader.foreground#fff2e9
• sideBarTitle.foreground#fff2e9
• statusBar.background#4e1612
• statusBar.border#ff3b3055
• statusBar.foreground#fff2e9
• statusBarItem.hoverBackground#ff3b3028
• statusBarItem.remoteBackground#ff3b30
• statusBarItem.remoteForeground#001018
• tab.activeBackground#2a0c0b
• tab.activeBorderTop#ff3b30
• tab.activeForeground#fff2e9
• tab.hoverBackground#ff3b3016
• tab.inactiveBackground#180909
• tab.inactiveForeground#fff2e9A0
• terminal.ansiCyan#ff3b30
• terminal.ansiMagenta#ff8a00
• terminal.ansiYellow#ffd166
• terminal.background#120707
• terminal.foreground#fff2e9
• terminalCursor.foreground#ffd166
• titleBar.activeBackground#180909
• titleBar.activeForeground#fff2e9
• titleBar.inactiveBackground#120707
• titleBar.inactiveForeground#fff2e980
• window.activeBorder#ff3b30
• window.inactiveBorder#ff8a0060

tokenColors

TextMate scopes and font styles (syntax highlighting rules).