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#00d5ff
• activityBar.background#0a0f1f
• activityBar.foreground#eaf7ff
• activityBar.inactiveForeground#eaf7ff80
• activityBarBadge.background#00d5ff
• activityBarBadge.foreground#001018
• badge.background#8b5cf6
• badge.foreground#ffffff
• button.background#00d5ff
• button.foreground#001018
• button.hoverBackground#2eddff
• button.secondaryBackground#0a3e54
• button.secondaryForeground#eaf7ff
• descriptionForeground#eaf7ffB5
• dropdown.background#0b1120
• dropdown.border#00d5ff65
• dropdown.foreground#eaf7ff
• editor.background#070b18
• editor.findMatchBackground#ff3df255
• editor.findMatchHighlightBackground#8b5cf635
• editor.foreground#eaf7ff
• editor.lineHighlightBackground#00d5ff12
• editor.selectionBackground#00d5ff35
• editor.selectionHighlightBackground#8b5cf622
• editorBracketMatch.border#ff3df2
• editorCursor.foreground#ff3df2
• editorGroup.border#00d5ff28
• editorGroupHeader.tabsBackground#090d1b
• editorGutter.addedBackground#8b5cf6
• editorGutter.background#070b18
• editorGutter.deletedBackground#ff4d6d
• editorGutter.modifiedBackground#00d5ff
• editorHoverWidget.background#0d1324
• editorHoverWidget.border#00d5ff80
• editorIndentGuide.activeBackground1#00d5ff80
• editorIndentGuide.background1#eaf7ff14
• editorLineNumber.activeForeground#00d5ff
• editorLineNumber.foreground#eaf7ff55
• editorSuggestWidget.background#0d1324
• editorSuggestWidget.border#00d5ff80
• editorSuggestWidget.foreground#eaf7ff
• editorSuggestWidget.selectedBackground#0a3e54
• editorWhitespace.foreground#eaf7ff20
• editorWidget.background#0d1324
• editorWidget.border#00d5ff80
• errorForeground#ff4d6d
• focusBorder#00d5ff
• foreground#eaf7ff
• icon.foreground#eaf7ffD0
• input.background#0b1120
• input.border#00d5ff65
• input.foreground#eaf7ff
• inputOption.activeBorder#00d5ff
• list.activeSelectionBackground#0a3e54
• list.activeSelectionForeground#eaf7ff
• list.focusOutline#00d5ff
• list.highlightForeground#ff3df2
• list.hoverBackground#00d5ff14
• list.inactiveSelectionBackground#00d5ff20
• menu.background#0d1324
• menu.border#00d5ff50
• menu.foreground#eaf7ff
• menu.selectionBackground#0a3e54
• menu.selectionForeground#eaf7ff
• menubar.selectionBackground#00d5ff20
• menubar.selectionForeground#eaf7ff
• minimap.background#070b18
• panel.background#0c2336
• panel.border#00d5ff35
• panelTitle.activeBorder#00d5ff
• panelTitle.activeForeground#eaf7ff
• panelTitle.inactiveForeground#eaf7ff88
• sash.hoverBorder#00d5ff
• scrollbarSlider.activeBackground#00d5ff75
• scrollbarSlider.background#00d5ff30
• scrollbarSlider.hoverBackground#00d5ff55
• sideBar.background#0c2336
• sideBar.border#00d5ff35
• sideBar.foreground#eaf7ff
• sideBarSectionHeader.background#0b1020
• sideBarSectionHeader.foreground#eaf7ff
• sideBarTitle.foreground#eaf7ff
• statusBar.background#0a3e54
• statusBar.border#00d5ff55
• statusBar.foreground#eaf7ff
• statusBarItem.hoverBackground#00d5ff28
• statusBarItem.remoteBackground#00d5ff
• statusBarItem.remoteForeground#001018
• tab.activeBackground#061f2f
• tab.activeBorderTop#00d5ff
• tab.activeForeground#eaf7ff
• tab.hoverBackground#00d5ff16
• tab.inactiveBackground#0a0f1f
• tab.inactiveForeground#eaf7ffA0
• terminal.ansiCyan#00d5ff
• terminal.ansiMagenta#8b5cf6
• terminal.ansiYellow#ff3df2
• terminal.background#070b18
• terminal.foreground#eaf7ff
• terminalCursor.foreground#ff3df2
• titleBar.activeBackground#0a0f1f
• titleBar.activeForeground#eaf7ff
• titleBar.inactiveBackground#070b18
• titleBar.inactiveForeground#eaf7ff80
• window.activeBorder#00d5ff
• window.inactiveBorder#8b5cf660

tokenColors

TextMate scopes and font styles (syntax highlighting rules).