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#38bdf8
• activityBar.background#061726
• activityBar.foreground#effbff
• activityBar.inactiveForeground#effbff80
• activityBarBadge.background#38bdf8
• activityBarBadge.foreground#001018
• badge.background#2dd4bf
• badge.foreground#ffffff
• button.background#38bdf8
• button.foreground#001018
• button.hoverBackground#5cc9f9
• button.secondaryBackground#123f58
• button.secondaryForeground#effbff
• descriptionForeground#effbffB5
• dropdown.background#061827
• dropdown.border#38bdf865
• dropdown.foreground#effbff
• editor.background#04121f
• editor.findMatchBackground#a7f3d055
• editor.findMatchHighlightBackground#2dd4bf35
• editor.foreground#effbff
• editor.lineHighlightBackground#38bdf812
• editor.selectionBackground#38bdf835
• editor.selectionHighlightBackground#2dd4bf22
• editorBracketMatch.border#a7f3d0
• editorCursor.foreground#a7f3d0
• editorGroup.border#38bdf828
• editorGroupHeader.tabsBackground#051422
• editorGutter.addedBackground#2dd4bf
• editorGutter.background#04121f
• editorGutter.deletedBackground#ff4d6d
• editorGutter.modifiedBackground#38bdf8
• editorHoverWidget.background#071b2b
• editorHoverWidget.border#38bdf880
• editorIndentGuide.activeBackground1#38bdf880
• editorIndentGuide.background1#effbff14
• editorLineNumber.activeForeground#38bdf8
• editorLineNumber.foreground#effbff55
• editorSuggestWidget.background#071b2b
• editorSuggestWidget.border#38bdf880
• editorSuggestWidget.foreground#effbff
• editorSuggestWidget.selectedBackground#123f58
• editorWhitespace.foreground#effbff20
• editorWidget.background#071b2b
• editorWidget.border#38bdf880
• errorForeground#ff4d6d
• focusBorder#38bdf8
• foreground#effbff
• icon.foreground#effbffD0
• input.background#061827
• input.border#38bdf865
• input.foreground#effbff
• inputOption.activeBorder#38bdf8
• list.activeSelectionBackground#123f58
• list.activeSelectionForeground#effbff
• list.focusOutline#38bdf8
• list.highlightForeground#a7f3d0
• list.hoverBackground#38bdf814
• list.inactiveSelectionBackground#38bdf820
• menu.background#071b2b
• menu.border#38bdf850
• menu.foreground#effbff
• menu.selectionBackground#123f58
• menu.selectionForeground#effbff
• menubar.selectionBackground#38bdf820
• menubar.selectionForeground#effbff
• minimap.background#04121f
• panel.background#0b283b
• panel.border#38bdf835
• panelTitle.activeBorder#38bdf8
• panelTitle.activeForeground#effbff
• panelTitle.inactiveForeground#effbff88
• sash.hoverBorder#38bdf8
• scrollbarSlider.activeBackground#38bdf875
• scrollbarSlider.background#38bdf830
• scrollbarSlider.hoverBackground#38bdf855
• sideBar.background#0b283b
• sideBar.border#38bdf835
• sideBar.foreground#effbff
• sideBarSectionHeader.background#061827
• sideBarSectionHeader.foreground#effbff
• sideBarTitle.foreground#effbff
• statusBar.background#123f58
• statusBar.border#38bdf855
• statusBar.foreground#effbff
• statusBarItem.hoverBackground#38bdf828
• statusBarItem.remoteBackground#38bdf8
• statusBarItem.remoteForeground#001018
• tab.activeBackground#092335
• tab.activeBorderTop#38bdf8
• tab.activeForeground#effbff
• tab.hoverBackground#38bdf816
• tab.inactiveBackground#061726
• tab.inactiveForeground#effbffA0
• terminal.ansiCyan#38bdf8
• terminal.ansiMagenta#2dd4bf
• terminal.ansiYellow#a7f3d0
• terminal.background#04121f
• terminal.foreground#effbff
• terminalCursor.foreground#a7f3d0
• titleBar.activeBackground#061726
• titleBar.activeForeground#effbff
• titleBar.inactiveBackground#04121f
• titleBar.inactiveForeground#effbff80
• window.activeBorder#38bdf8
• window.inactiveBorder#2dd4bf60

tokenColors

TextMate scopes and font styles (syntax highlighting rules).