Hanabi Theme (Cursor)

Color themes

• 

  Hanabi

• 

  Hanabi Light

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.background#DFE4F8
• activityBar.foreground#1C2233
• activityBar.inactiveForeground#5F6D8C
• activityBarBadge.background#345FC7
• activityBarBadge.foreground#1F2537
• badge.background#DFE4F8
• badge.foreground#1C2233
• button.background#DFE4F8
• button.foreground#1C2233
• button.hoverBackground#D9DFF6
• button.secondaryBackground#E3E8FA
• button.secondaryForeground#1C2233
• button.secondaryHoverBackground#D9DFF6
• descriptionForeground#5F6D8C
• disabledForeground#5F6D8C
• dropdown.background#ECEFFD
• dropdown.border#D6DCF5
• dropdown.foreground#1C2233
• editor.background#F5F6FC
• editor.findMatchBackground#AD8A1848
• editor.findMatchHighlightBackground#AD8A1828
• editor.findRangeHighlightBackground#E3E8FA
• editor.foreground#1C2233
• editor.inactiveSelectionBackground#CCD5F49A
• editor.lineHighlightBackground#E3E8FA99
• editor.lineHighlightBorder#C6CFEAAA
• editor.selectionBackground#CCD5F4D0
• editor.selectionHighlightBackground#AD8A1833
• editor.wordHighlightBackground#007E8A30
• editor.wordHighlightStrongBackground#2E8A5230
• editorBracketHighlight.foreground1#BF3D58
• editorBracketHighlight.foreground2#2E8A52
• editorBracketHighlight.foreground3#A35D00
• editorBracketHighlight.foreground4#8E7300
• editorBracketHighlight.foreground5#345FC7
• editorBracketHighlight.foreground6#007E8A
• editorBracketHighlight.unexpectedBracket.foreground#B73A78
• editorBracketPairGuide.activeBackground1#BF3D583A
• editorBracketPairGuide.activeBackground2#2E8A523A
• editorBracketPairGuide.activeBackground3#A35D003A
• editorBracketPairGuide.activeBackground4#AD8A183A
• editorBracketPairGuide.activeBackground5#345FC73A
• editorBracketPairGuide.activeBackground6#007E8A3A
• editorBracketPairGuide.background1#BF3D581E
• editorBracketPairGuide.background2#2E8A521E
• editorBracketPairGuide.background3#A35D001E
• editorBracketPairGuide.background4#AD8A181E
• editorBracketPairGuide.background5#345FC71E
• editorBracketPairGuide.background6#007E8A1E
• editorCursor.foreground#1C2233
• editorGroupHeader.tabsBackground#D6DCF5
• editorGroupHeader.tabsBorder#ECEFFD
• editorHoverWidget.background#D9DFF6
• editorHoverWidget.border#ECEFFD
• editorIndentGuide.activeBackground#1C223388
• editorIndentGuide.background#C6CFEA
• editorLineNumber.activeForeground#A35D00
• editorLineNumber.foreground#5F6D8C
• editorWhitespace.foreground#C6CFEA
• errorForeground#BF3D58
• focusBorder#D9DFF6
• foreground#1C2233
• icon.foreground#1C2233
• input.background#F5F6FC
• input.border#ECEFFD
• input.foreground#1C2233
• input.placeholderForeground#5F6D8CAA
• list.activeSelectionBackground#D9DFF6
• list.activeSelectionForeground#1C2233
• list.errorForeground#BF3D58
• list.focusBackground#A8B3D6
• list.focusForeground#1C2233
• list.highlightForeground#007E8A
• list.hoverBackground#E3E8FA
• list.hoverForeground#1C2233
• list.inactiveSelectionBackground#E3E8FA
• list.inactiveSelectionForeground#1C2233
• list.warningForeground#8E7300
• minimap.background#F5F6FC
• minimap.selectionHighlight#CCD5F4AA
• panel.background#F5F6FC
• panel.border#ECEFFD
• panelTitle.activeForeground#1C2233
• panelTitle.inactiveForeground#5F6D8C
• peekViewEditor.background#F5F6FC
• peekViewResult.background#ECEFFD
• peekViewResult.selectionBackground#D9DFF6
• peekViewTitle.background#D6DCF5
• progressBar.background#345FC7
• scrollbar.shadow#D6DCF5
• scrollbarSlider.activeBackground#1C223366
• scrollbarSlider.background#1C223322
• scrollbarSlider.hoverBackground#1C223344
• sideBar.background#ECEFFD
• sideBar.border#D6DCF5
• sideBar.foreground#1C2233
• sideBarSectionHeader.background#F5F6FC
• sideBarSectionHeader.foreground#1C2233
• sideBarTitle.foreground#1C2233
• statusBar.background#DFE4F8
• statusBar.debuggingBackground#A35D00
• statusBar.debuggingForeground#D6DCF5
• statusBar.foreground#1C2233
• statusBar.noFolderBackground#ECEFFD
• statusBar.noFolderForeground#1C2233
• tab.activeBackground#F5F6FC
• tab.activeBorderTop#345FC7
• tab.activeForeground#1C2233
• tab.hoverBackground#D9DFF6
• tab.hoverForeground#1C2233
• tab.inactiveBackground#ECEFFD
• tab.inactiveForeground#5F6D8C
• terminal.ansiBlack#2A3145
• terminal.ansiBlue#4D71CD
• terminal.ansiBrightBlack#6A7594
• terminal.ansiBrightBlue#5E84DD
• terminal.ansiBrightCyan#4EA7B0
• terminal.ansiBrightGreen#5DA475
• terminal.ansiBrightMagenta#C06B99
• terminal.ansiBrightRed#D86E84
• terminal.ansiBrightWhite#1C2233
• terminal.ansiBrightYellow#AD8A18
• terminal.ansiCyan#2D919B
• terminal.ansiGreen#3D925A
• terminal.ansiMagenta#B45488
• terminal.ansiRed#C44A65
• terminal.ansiWhite#A3AEC8
• terminal.ansiYellow#977200
• terminal.background#F5F6FC
• terminal.foreground#1C2233
• terminal.selectionBackground#CCD5F4
• terminalCursor.background#F5F6FC
• terminalCursor.foreground#1C2233
• textCodeBlock.background#E3E8FA
• textLink.activeForeground#4EA7B0
• textLink.foreground#007E8A
• titleBar.activeBackground#D6DCF5
• titleBar.activeForeground#1C2233
• titleBar.inactiveBackground#ECEFFD
• titleBar.inactiveForeground#5F6D8C
• window.activeBorder#D6DCF5
• window.inactiveBorder#ECEFFD

tokenColors

TextMate scopes and font styles (syntax highlighting rules).