Kairo Themes
Publisher: OdixCodezThemes in package: 6
A collection of carefully crafted dark and light themes for VS Code — Astral, Aurora, Default, Lavender, Light, and Mint.
Color themes
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#F5F7FA
- activityBar.border#E0E4EC
- activityBar.foreground#1C2033
- activityBar.inactiveForeground#757575
- activityBarBadge.background#1976D2
- activityBarBadge.foreground#FFFFFF
- badge.background#1976D2
- badge.foreground#FFFFFF
- breadcrumb.activeSelectionForeground#1976D2
- breadcrumb.focusForeground#1C2033
- breadcrumb.foreground#757575
- breadcrumbPicker.background#FFFFFF
- button.background#1976D2
- button.foreground#FFFFFF
- button.hoverBackground#1E88E5
- descriptionForeground#616161
- editor.background#FFFFFF
- editor.findMatchBackground#BBDEFB60
- editor.findMatchHighlightBackground#BBDEFB40
- editor.foreground#1C2033
- editor.inactiveSelectionBackground#1976D220
- editor.lineHighlightBackground#F5F7FA
- editor.selectionBackground#1976D230
- editor.selectionHighlightBackground#1976D218
- editor.wordHighlightBackground#1976D225
- editor.wordHighlightStrongBackground#1976D240
- editorBracketMatch.background#1976D218
- editorBracketMatch.border#1976D260
- editorCursor.background#FFFFFF
- editorCursor.foreground#1976D2
- editorError.foreground#D32F2F
- editorGroupHeader.tabsBackground#EEEEEE
- editorGroupHeader.tabsBorder#E0E4EC
- editorGutter.background#FFFFFF
- editorHoverWidget.background#FFFFFF
- editorHoverWidget.border#E0E4EC
- editorIndentGuide.activeBackground1#B0B8C8
- editorIndentGuide.background1#E8ECF2
- editorInfo.foreground#1976D2
- editorLineNumber.activeForeground#1976D2
- editorLineNumber.foreground#B0B8C8
- editorRuler.foreground#E8ECF2
- editorSuggestWidget.background#FFFFFF
- editorSuggestWidget.border#E0E4EC
- editorSuggestWidget.highlightForeground#1976D2
- editorSuggestWidget.selectedBackground#E3F2FD
- editorWarning.foreground#F57C00
- editorWhitespace.foreground#E0E4EC
- errorForeground#D32F2F
- focusBorder#1976D260
- foreground#1C2033
- gitDecoration.conflictingResourceForeground#7B1FA2
- gitDecoration.deletedResourceForeground#D32F2F
- gitDecoration.ignoredResourceForeground#B0B8C8
- gitDecoration.modifiedResourceForeground#F57C00
- gitDecoration.untrackedResourceForeground#388E3C
- input.background#FFFFFF
- input.border#E0E4EC
- input.foreground#1C2033
- input.placeholderForeground#757575
- list.activeSelectionBackground#BBDEFB
- list.activeSelectionForeground#0D47A1
- list.focusBackground#BBDEFB
- list.highlightForeground#1976D2
- list.hoverBackground#F5F7FA
- list.hoverForeground#1C2033
- list.inactiveSelectionBackground#E3F2FD
- list.inactiveSelectionForeground#424242
- panel.background#F5F7FA
- panel.border#E0E4EC
- panelTitle.activeBorder#1976D2
- panelTitle.activeForeground#1976D2
- panelTitle.inactiveForeground#757575
- scrollbarSlider.activeBackground#757575A0
- scrollbarSlider.background#B0B8C850
- scrollbarSlider.hoverBackground#B0B8C880
- selection.background#1976D230
- sideBar.background#FAFBFC
- sideBar.border#E0E4EC
- sideBar.foreground#424242
- sideBarSectionHeader.background#F5F7FA
- sideBarSectionHeader.border#E0E4EC
- sideBarSectionHeader.foreground#616161
- sideBarTitle.foreground#1976D2
- statusBar.background#1976D2
- statusBar.border#1565C0
- statusBar.debuggingBackground#D32F2F
- statusBar.debuggingForeground#FFFFFF
- statusBar.foreground#FFFFFF
- statusBar.noFolderBackground#42A5F5
- statusBarItem.hoverBackground#1E88E5
- statusBarItem.remoteBackground#0D47A1
- statusBarItem.remoteForeground#FFFFFF
- tab.activeBackground#FFFFFF
- tab.activeBorder#1976D2
- tab.activeBorderTop#1976D2
- tab.activeForeground#1C2033
- tab.border#E0E4EC
- tab.hoverBackground#FAFBFC
- tab.hoverForeground#424242
- tab.inactiveBackground#F5F7FA
- tab.inactiveForeground#757575
- tab.unfocusedActiveForeground#616161
- tab.unfocusedInactiveForeground#9E9E9E
- terminal.ansiBlack#424242
- terminal.ansiBlue#1976D2
- terminal.ansiBrightBlack#757575
- terminal.ansiBrightBlue#42A5F5
- terminal.ansiBrightCyan#26C6DA
- terminal.ansiBrightGreen#66BB6A
- terminal.ansiBrightMagenta#AB47BC
- terminal.ansiBrightRed#EF5350
- terminal.ansiBrightWhite#FFFFFF
- terminal.ansiBrightYellow#FFA726
- terminal.ansiCyan#00838F
- terminal.ansiGreen#388E3C
- terminal.ansiMagenta#7B1FA2
- terminal.ansiRed#D32F2F
- terminal.ansiWhite#E0E4EC
- terminal.ansiYellow#F57C00
- terminal.background#F5F7FA
- terminal.foreground#1C2033
- titleBar.activeBackground#F5F7FA
- titleBar.activeForeground#1C2033
- titleBar.border#E0E4EC
- titleBar.inactiveBackground#EEEEEE
- titleBar.inactiveForeground#757575
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #9E9E9E | italic |
| keyword, keyword.control, keyword.operator.new, keyword.other.import | #1976D2 | bold |
| keyword.operator, keyword.operator.logical, keyword.operator.comparison | #00838F | — |
| storage, storage.type, storage.modifier | #7B1FA2 | italic |
| string, string.quoted, string.template | #2E7D32 | — |
| constant.character.escape, string.regexp | #00838F | — |
| constant.numeric | #F57C00 | — |
| constant, constant.language, constant.other | #EF6C00 | — |
| entity.name.function, meta.definition.method entity.name.function | #1565C0 | bold |
| meta.function-call, support.function | #1976D2 | — |
| variable, variable.other | #1C2033 | — |
| variable.parameter | #424242 | italic |
| variable.language, variable.other.this, variable.other.self | #1976D2 | italic |
| entity.name.type, entity.name.class, support.class | #7B1FA2 | bold |
| entity.name.interface, entity.name.enum | #9C27B0 | — |
| entity.name.tag | #D32F2F | — |
| entity.other.attribute-name | #1976D2 | — |
| support.type.property-name | #1565C0 | — |
| support.constant.property-value | #2E7D32 | — |
| punctuation, meta.brace | #9E9E9E | — |
| meta.decorator, punctuation.decorator | #EF6C00 | italic |
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#E8F5E9
- activityBar.border#D0DEC8
- activityBar.foreground#1B2E1B
- activityBar.inactiveForeground#81A878
- activityBarBadge.background#2E7D32
- activityBarBadge.foreground#FFFFFF
- badge.background#2E7D32
- badge.foreground#FFFFFF
- breadcrumb.activeSelectionForeground#2E7D32
- breadcrumb.focusForeground#1B2E1B
- breadcrumb.foreground#81A878
- breadcrumbPicker.background#FFFFFF
- button.background#2E7D32
- button.foreground#FFFFFF
- button.hoverBackground#388E3C
- descriptionForeground#558B5A
- editor.background#F7FAF5
- editor.findMatchBackground#A5D6A740
- editor.findMatchHighlightBackground#A5D6A725
- editor.foreground#1B2E1B
- editor.inactiveSelectionBackground#2E7D3220
- editor.lineHighlightBackground#EBF3E8
- editor.selectionBackground#2E7D3230
- editor.selectionHighlightBackground#2E7D3218
- editor.wordHighlightBackground#2E7D3220
- editor.wordHighlightStrongBackground#2E7D3235
- editorBracketMatch.background#2E7D3218
- editorBracketMatch.border#2E7D3255
- editorCursor.background#F7FAF5
- editorCursor.foreground#2E7D32
- editorError.foreground#C62828
- editorGroupHeader.tabsBackground#E4EDE0
- editorGroupHeader.tabsBorder#D0DEC8
- editorGutter.background#F7FAF5
- editorHoverWidget.background#FFFFFF
- editorHoverWidget.border#D0DEC8
- editorIndentGuide.activeBackground1#A8C4A0
- editorIndentGuide.background1#DCE8D6
- editorInfo.foreground#2E7D32
- editorLineNumber.activeForeground#2E7D32
- editorLineNumber.foreground#A8C4A0
- editorRuler.foreground#DCE8D6
- editorSuggestWidget.background#FFFFFF
- editorSuggestWidget.border#D0DEC8
- editorSuggestWidget.highlightForeground#2E7D32
- editorSuggestWidget.selectedBackground#E8F5E9
- editorWarning.foreground#EF6C00
- editorWhitespace.foreground#D5E5D0
- errorForeground#C62828
- focusBorder#2E7D3260
- foreground#1B2E1B
- gitDecoration.conflictingResourceForeground#6A1B9A
- gitDecoration.deletedResourceForeground#C62828
- gitDecoration.ignoredResourceForeground#A8C4A0
- gitDecoration.modifiedResourceForeground#EF6C00
- gitDecoration.untrackedResourceForeground#2E7D32
- input.background#FFFFFF
- input.border#D0DEC8
- input.foreground#1B2E1B
- input.placeholderForeground#81A878
- list.activeSelectionBackground#C8E6C9
- list.activeSelectionForeground#1B2E1B
- list.focusBackground#C8E6C9
- list.highlightForeground#2E7D32
- list.hoverBackground#E0F0DC
- list.hoverForeground#1B2E1B
- list.inactiveSelectionBackground#E0F0DC
- list.inactiveSelectionForeground#2E4430
- panel.background#E8F5E9
- panel.border#D0DEC8
- panelTitle.activeBorder#2E7D32
- panelTitle.activeForeground#2E7D32
- panelTitle.inactiveForeground#81A878
- scrollbarSlider.activeBackground#81A87899
- scrollbarSlider.background#A8C4A050
- scrollbarSlider.hoverBackground#A8C4A080
- selection.background#2E7D3228
- sideBar.background#F0F7ED
- sideBar.border#D0DEC8
- sideBar.foreground#2E4430
- sideBarSectionHeader.background#E8F5E9
- sideBarSectionHeader.border#D0DEC8
- sideBarSectionHeader.foreground#558B5A
- sideBarTitle.foreground#2E7D32
- statusBar.background#2E7D32
- statusBar.border#1B5E20
- statusBar.debuggingBackground#C62828
- statusBar.debuggingForeground#FFFFFF
- statusBar.foreground#F1F8E9
- statusBar.noFolderBackground#558B5A
- statusBarItem.hoverBackground#388E3C
- statusBarItem.remoteBackground#1B5E20
- statusBarItem.remoteForeground#F1F8E9
- tab.activeBackground#F7FAF5
- tab.activeBorder#2E7D32
- tab.activeBorderTop#2E7D32
- tab.activeForeground#1B2E1B
- tab.border#D0DEC8
- tab.hoverBackground#F0F7ED
- tab.hoverForeground#2E4430
- tab.inactiveBackground#E8F5E9
- tab.inactiveForeground#81A878
- tab.unfocusedActiveForeground#558B5A
- tab.unfocusedInactiveForeground#A8C4A0
- terminal.ansiBlack#2E4430
- terminal.ansiBlue#1565C0
- terminal.ansiBrightBlack#558B5A
- terminal.ansiBrightBlue#1E88E5
- terminal.ansiBrightCyan#00897B
- terminal.ansiBrightGreen#43A047
- terminal.ansiBrightMagenta#8E24AA
- terminal.ansiBrightRed#E53935
- terminal.ansiBrightWhite#F7FAF5
- terminal.ansiBrightYellow#FB8C00
- terminal.ansiCyan#00695C
- terminal.ansiGreen#2E7D32
- terminal.ansiMagenta#6A1B9A
- terminal.ansiRed#C62828
- terminal.ansiWhite#D0DEC8
- terminal.ansiYellow#EF6C00
- terminal.background#E8F5E9
- terminal.foreground#1B2E1B
- titleBar.activeBackground#E8F5E9
- titleBar.activeForeground#1B2E1B
- titleBar.border#D0DEC8
- titleBar.inactiveBackground#E0EDE0
- titleBar.inactiveForeground#81A878
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #8AB88A | italic |
| keyword, keyword.control, keyword.operator.new, keyword.other.import | #2E7D32 | bold |
| keyword.operator, keyword.operator.logical, keyword.operator.comparison | #00695C | — |
| storage, storage.type, storage.modifier | #6A1B9A | italic |
| string, string.quoted, string.template | #1B7A4A | — |
| constant.character.escape, string.regexp | #00695C | — |
| constant.numeric | #EF6C00 | — |
| constant, constant.language | #E65100 | — |
| entity.name.function, meta.definition.method entity.name.function | #1565C0 | bold |
| meta.function-call, support.function | #2E7D32 | — |
| variable, variable.other | #1B2E1B | — |
| variable.parameter | #2E4430 | italic |
| variable.language, variable.other.this, variable.other.self | #2E7D32 | italic |
| entity.name.type, entity.name.class, support.class | #6A1B9A | bold |
| entity.name.interface, entity.name.enum | #5C6BC0 | — |
| entity.name.tag | #C62828 | — |
| entity.other.attribute-name | #2E7D32 | — |
| support.type.property-name | #1565C0 | — |
| support.constant.property-value | #1B7A4A | — |
| punctuation, meta.brace | #90A888 | — |
| meta.decorator, punctuation.decorator | #E65100 | italic |