Haho Vs Code Premium

Color themes

• 

  Haho Nebula Cyan

• 

  Haho Ocean Glass

• 

  Haho Redline Racing

• 

  Haho Royal Purple

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#a855f7
• activityBar.background#10091c
• activityBar.foreground#fbf5ff
• activityBar.inactiveForeground#fbf5ff80
• activityBarBadge.background#a855f7
• activityBarBadge.foreground#001018
• badge.background#ec4899
• badge.foreground#ffffff
• button.background#a855f7
• button.foreground#001018
• button.hoverBackground#b874f8
• button.secondaryBackground#351b51
• button.secondaryForeground#fbf5ff
• descriptionForeground#fbf5ffB5
• dropdown.background#110a1e
• dropdown.border#a855f765
• dropdown.foreground#fbf5ff
• editor.background#0b0714
• editor.findMatchBackground#38bdf855
• editor.findMatchHighlightBackground#ec489935
• editor.foreground#fbf5ff
• editor.lineHighlightBackground#a855f712
• editor.selectionBackground#a855f735
• editor.selectionHighlightBackground#ec489922
• editorBracketMatch.border#38bdf8
• editorCursor.foreground#38bdf8
• editorGroup.border#a855f728
• editorGroupHeader.tabsBackground#0d0818
• editorGutter.addedBackground#ec4899
• editorGutter.background#0b0714
• editorGutter.deletedBackground#ff4d6d
• editorGutter.modifiedBackground#a855f7
• editorHoverWidget.background#140b22
• editorHoverWidget.border#a855f780
• editorIndentGuide.activeBackground1#a855f780
• editorIndentGuide.background1#fbf5ff14
• editorLineNumber.activeForeground#a855f7
• editorLineNumber.foreground#fbf5ff55
• editorSuggestWidget.background#140b22
• editorSuggestWidget.border#a855f780
• editorSuggestWidget.foreground#fbf5ff
• editorSuggestWidget.selectedBackground#351b51
• editorWhitespace.foreground#fbf5ff20
• editorWidget.background#140b22
• editorWidget.border#a855f780
• errorForeground#ff4d6d
• focusBorder#a855f7
• foreground#fbf5ff
• icon.foreground#fbf5ffD0
• input.background#110a1e
• input.border#a855f765
• input.foreground#fbf5ff
• inputOption.activeBorder#a855f7
• list.activeSelectionBackground#351b51
• list.activeSelectionForeground#fbf5ff
• list.focusOutline#a855f7
• list.highlightForeground#38bdf8
• list.hoverBackground#a855f714
• list.inactiveSelectionBackground#a855f720
• menu.background#140b22
• menu.border#a855f750
• menu.foreground#fbf5ff
• menu.selectionBackground#351b51
• menu.selectionForeground#fbf5ff
• menubar.selectionBackground#a855f720
• menubar.selectionForeground#fbf5ff
• minimap.background#0b0714
• panel.background#201133
• panel.border#a855f735
• panelTitle.activeBorder#a855f7
• panelTitle.activeForeground#fbf5ff
• panelTitle.inactiveForeground#fbf5ff88
• sash.hoverBorder#a855f7
• scrollbarSlider.activeBackground#a855f775
• scrollbarSlider.background#a855f730
• scrollbarSlider.hoverBackground#a855f755
• sideBar.background#201133
• sideBar.border#a855f735
• sideBar.foreground#fbf5ff
• sideBarSectionHeader.background#110a1d
• sideBarSectionHeader.foreground#fbf5ff
• sideBarTitle.foreground#fbf5ff
• statusBar.background#351b51
• statusBar.border#a855f755
• statusBar.foreground#fbf5ff
• statusBarItem.hoverBackground#a855f728
• statusBarItem.remoteBackground#a855f7
• statusBarItem.remoteForeground#001018
• tab.activeBackground#1b0f2b
• tab.activeBorderTop#a855f7
• tab.activeForeground#fbf5ff
• tab.hoverBackground#a855f716
• tab.inactiveBackground#10091c
• tab.inactiveForeground#fbf5ffA0
• terminal.ansiCyan#a855f7
• terminal.ansiMagenta#ec4899
• terminal.ansiYellow#38bdf8
• terminal.background#0b0714
• terminal.foreground#fbf5ff
• terminalCursor.foreground#38bdf8
• titleBar.activeBackground#10091c
• titleBar.activeForeground#fbf5ff
• titleBar.inactiveBackground#0b0714
• titleBar.inactiveForeground#fbf5ff80
• window.activeBorder#a855f7
• window.inactiveBorder#ec489960

tokenColors

TextMate scopes and font styles (syntax highlighting rules).