Haho Vs Code Premium

Color themes

• 

  Haho Aqua Dream

• 

  Haho Arctic Ice

• 

  Haho Candy Pop

• 

  Haho Cyberpunk Gold

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#a5f3fc
• activityBar.background#091421
• activityBar.foreground#f4fbff
• activityBar.inactiveForeground#f4fbff80
• activityBarBadge.background#a5f3fc
• activityBarBadge.foreground#001018
• badge.background#60a5fa
• badge.foreground#ffffff
• button.background#a5f3fc
• button.foreground#001018
• button.hoverBackground#b5f5fd
• button.secondaryBackground#2d4754
• button.secondaryForeground#f4fbff
• descriptionForeground#f4fbffB5
• dropdown.background#0a1522
• dropdown.border#a5f3fc65
• dropdown.foreground#f4fbff
• editor.background#06111d
• editor.findMatchBackground#ffffff55
• editor.findMatchHighlightBackground#60a5fa35
• editor.foreground#f4fbff
• editor.lineHighlightBackground#a5f3fc12
• editor.selectionBackground#a5f3fc35
• editor.selectionHighlightBackground#60a5fa22
• editorBracketMatch.border#ffffff
• editorCursor.foreground#ffffff
• editorGroup.border#a5f3fc28
• editorGroupHeader.tabsBackground#07131f
• editorGutter.addedBackground#60a5fa
• editorGutter.background#06111d
• editorGutter.deletedBackground#ff4d6d
• editorGutter.modifiedBackground#a5f3fc
• editorHoverWidget.background#0b1724
• editorHoverWidget.border#a5f3fc80
• editorIndentGuide.activeBackground1#a5f3fc80
• editorIndentGuide.background1#f4fbff14
• editorLineNumber.activeForeground#a5f3fc
• editorLineNumber.foreground#f4fbff55
• editorSuggestWidget.background#0b1724
• editorSuggestWidget.border#a5f3fc80
• editorSuggestWidget.foreground#f4fbff
• editorSuggestWidget.selectedBackground#2d4754
• editorWhitespace.foreground#f4fbff20
• editorWidget.background#0b1724
• editorWidget.border#a5f3fc80
• errorForeground#ff4d6d
• focusBorder#a5f3fc
• foreground#f4fbff
• icon.foreground#f4fbffD0
• input.background#0a1522
• input.border#a5f3fc65
• input.foreground#f4fbff
• inputOption.activeBorder#a5f3fc
• list.activeSelectionBackground#2d4754
• list.activeSelectionForeground#f4fbff
• list.focusOutline#a5f3fc
• list.highlightForeground#ffffff
• list.hoverBackground#a5f3fc14
• list.inactiveSelectionBackground#a5f3fc20
• menu.background#0b1724
• menu.border#a5f3fc50
• menu.foreground#f4fbff
• menu.selectionBackground#2d4754
• menu.selectionForeground#f4fbff
• menubar.selectionBackground#a5f3fc20
• menubar.selectionForeground#f4fbff
• minimap.background#06111d
• panel.background#172935
• panel.border#a5f3fc35
• panelTitle.activeBorder#a5f3fc
• panelTitle.activeForeground#f4fbff
• panelTitle.inactiveForeground#f4fbff88
• sash.hoverBorder#a5f3fc
• scrollbarSlider.activeBackground#a5f3fc75
• scrollbarSlider.background#a5f3fc30
• scrollbarSlider.hoverBackground#a5f3fc55
• sideBar.background#172935
• sideBar.border#a5f3fc35
• sideBar.foreground#f4fbff
• sideBarSectionHeader.background#091522
• sideBarSectionHeader.foreground#f4fbff
• sideBarTitle.foreground#f4fbff
• statusBar.background#2d4754
• statusBar.border#a5f3fc55
• statusBar.foreground#f4fbff
• statusBarItem.hoverBackground#a5f3fc28
• statusBarItem.remoteBackground#a5f3fc
• statusBarItem.remoteForeground#001018
• tab.activeBackground#162833
• tab.activeBorderTop#a5f3fc
• tab.activeForeground#f4fbff
• tab.hoverBackground#a5f3fc16
• tab.inactiveBackground#091421
• tab.inactiveForeground#f4fbffA0
• terminal.ansiCyan#a5f3fc
• terminal.ansiMagenta#60a5fa
• terminal.ansiYellow#ffffff
• terminal.background#06111d
• terminal.foreground#f4fbff
• terminalCursor.foreground#ffffff
• titleBar.activeBackground#091421
• titleBar.activeForeground#f4fbff
• titleBar.inactiveBackground#06111d
• titleBar.inactiveForeground#f4fbff80
• window.activeBorder#a5f3fc
• window.inactiveBorder#60a5fa60

tokenColors

TextMate scopes and font styles (syntax highlighting rules).