Haho Vs Code Premium

Color themes

• 

  Haho Ice Violet

• 

  Haho Lava Dark

• 

  Haho Midnight Sakura

• 

  Haho Mono Lux

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#f97316
• activityBar.background#0c0c0d
• activityBar.foreground#fff7ed
• activityBar.inactiveForeground#fff7ed80
• activityBarBadge.background#f97316
• activityBarBadge.foreground#001018
• badge.background#ef4444
• badge.foreground#ffffff
• button.background#f97316
• button.foreground#001018
• button.hoverBackground#fa8c40
• button.secondaryBackground#432612
• button.secondaryForeground#fff7ed
• descriptionForeground#fff7edB5
• dropdown.background#0d0d0e
• dropdown.border#f9731665
• dropdown.foreground#fff7ed
• editor.background#060607
• editor.findMatchBackground#facc1555
• editor.findMatchHighlightBackground#ef444435
• editor.foreground#fff7ed
• editor.lineHighlightBackground#f9731612
• editor.selectionBackground#f9731635
• editor.selectionHighlightBackground#ef444422
• editorBracketMatch.border#facc15
• editorCursor.foreground#facc15
• editorGroup.border#f9731628
• editorGroupHeader.tabsBackground#09090a
• editorGutter.addedBackground#ef4444
• editorGutter.background#060607
• editorGutter.deletedBackground#ff4d6d
• editorGutter.modifiedBackground#f97316
• editorHoverWidget.background#101011
• editorHoverWidget.border#f9731680
• editorIndentGuide.activeBackground1#f9731680
• editorIndentGuide.background1#fff7ed14
• editorLineNumber.activeForeground#f97316
• editorLineNumber.foreground#fff7ed55
• editorSuggestWidget.background#101011
• editorSuggestWidget.border#f9731680
• editorSuggestWidget.foreground#fff7ed
• editorSuggestWidget.selectedBackground#432612
• editorWhitespace.foreground#fff7ed20
• editorWidget.background#101011
• editorWidget.border#f9731680
• errorForeground#ff4d6d
• focusBorder#f97316
• foreground#fff7ed
• icon.foreground#fff7edD0
• input.background#0d0d0e
• input.border#f9731665
• input.foreground#fff7ed
• inputOption.activeBorder#f97316
• list.activeSelectionBackground#432612
• list.activeSelectionForeground#fff7ed
• list.focusOutline#f97316
• list.highlightForeground#facc15
• list.hoverBackground#f9731614
• list.inactiveSelectionBackground#f9731620
• menu.background#101011
• menu.border#f9731650
• menu.foreground#fff7ed
• menu.selectionBackground#432612
• menu.selectionForeground#fff7ed
• menubar.selectionBackground#f9731620
• menubar.selectionForeground#fff7ed
• minimap.background#060607
• panel.background#231811
• panel.border#f9731635
• panelTitle.activeBorder#f97316
• panelTitle.activeForeground#fff7ed
• panelTitle.inactiveForeground#fff7ed88
• sash.hoverBorder#f97316
• scrollbarSlider.activeBackground#f9731675
• scrollbarSlider.background#f9731630
• scrollbarSlider.hoverBackground#f9731655
• sideBar.background#231811
• sideBar.border#f9731635
• sideBar.foreground#fff7ed
• sideBarSectionHeader.background#0d0d0e
• sideBarSectionHeader.foreground#fff7ed
• sideBarTitle.foreground#fff7ed
• statusBar.background#432612
• statusBar.border#f9731655
• statusBar.foreground#fff7ed
• statusBarItem.hoverBackground#f9731628
• statusBarItem.remoteBackground#f97316
• statusBarItem.remoteForeground#001018
• tab.activeBackground#1e1109
• tab.activeBorderTop#f97316
• tab.activeForeground#fff7ed
• tab.hoverBackground#f9731616
• tab.inactiveBackground#0c0c0d
• tab.inactiveForeground#fff7edA0
• terminal.ansiCyan#f97316
• terminal.ansiMagenta#ef4444
• terminal.ansiYellow#facc15
• terminal.background#060607
• terminal.foreground#fff7ed
• terminalCursor.foreground#facc15
• titleBar.activeBackground#0c0c0d
• titleBar.activeForeground#fff7ed
• titleBar.inactiveBackground#060607
• titleBar.inactiveForeground#fff7ed80
• window.activeBorder#f97316
• window.inactiveBorder#ef444460

tokenColors

TextMate scopes and font styles (syntax highlighting rules).