Light Blue & Pearl White
Publisher: Developer in TrainingThemes in package: 1
A light VS Code theme in light blue and pearl white tones, with iridescent pearl-toned accents.
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#E7F0F8
- activityBar.border#DCEAF7
- activityBar.foreground#1565C0
- activityBar.inactiveForeground#8FB3D9
- activityBarBadge.background#2196F3
- activityBarBadge.foreground#FFFFFF
- badge.background#2196F3
- badge.foreground#FFFFFF
- breadcrumb.activeSelectionForeground#1565C0
- breadcrumb.background#F3F5F6
- breadcrumb.foreground#5D7893
- button.background#2196F3
- button.foreground#FFFFFF
- button.hoverBackground#1E88E5
- button.secondaryBackground#E3EEF9
- button.secondaryForeground#1B2733
- button.secondaryHoverBackground#D2E9FB
- descriptionForeground#5D7893
- diffEditor.insertedTextBackground#2E7D3222
- diffEditor.removedTextBackground#C6282822
- dropdown.background#F3F5F6
- dropdown.border#C9DFF2
- dropdown.foreground#1B2733
- editor.background#F3F5F6
- editor.findMatchBackground#F3D98B
- editor.findMatchHighlightBackground#BBDEFB80
- editor.foreground#1B2733
- editor.inactiveSelectionBackground#D6EAFB
- editor.lineHighlightBackground#EFE9EF
- editor.selectionBackground#BBDEFB
- editor.wordHighlightBackground#D2E9FB80
- editor.wordHighlightStrongBackground#E3D9F380
- editorBracketHighlight.foreground1#4FA8DC
- editorBracketHighlight.foreground2#D98CB3
- editorBracketHighlight.foreground3#9B8FD9
- editorBracketHighlight.foreground4#C9A227
- editorBracketHighlight.foreground5#4FB89C
- editorBracketHighlight.foreground6#2E6DA4
- editorBracketHighlight.unexpectedBracket.foreground#C62828
- editorBracketMatch.background#F6ECC9
- editorBracketMatch.border#C9A227
- editorCursor.foreground#1976D2
- editorGroup.border#DCEAF7
- editorGroupHeader.tabsBackground#F1F6FA
- editorGroupHeader.tabsBorder#DCEAF7
- editorGutter.addedBackground#2E7D32
- editorGutter.deletedBackground#C62828
- editorGutter.modifiedBackground#1E88E5
- editorHoverWidget.background#F3F5F6
- editorHoverWidget.border#DCEAF7
- editorIndentGuide.activeBackground1#D9C9E8
- editorIndentGuide.background1#EFE9F2
- editorLineNumber.activeForeground#1976D2
- editorLineNumber.foreground#B9C6D6
- editorRuler.foreground#EFE9F2
- editorSuggestWidget.background#F3F5F6
- editorSuggestWidget.border#DCEAF7
- editorSuggestWidget.highlightForeground#1565C0
- editorSuggestWidget.selectedBackground#D2E9FB
- editorWhitespace.foreground#E5DEE9
- editorWidget.background#F3F5F6
- editorWidget.border#DCEAF7
- errorForeground#C62828
- focusBorder#2196F3
- foreground#1B2733
- gitDecoration.addedResourceForeground#2E7D32
- gitDecoration.deletedResourceForeground#C62828
- gitDecoration.ignoredResourceForeground#A9C6E8
- gitDecoration.modifiedResourceForeground#1E88E5
- gitDecoration.untrackedResourceForeground#00897B
- input.background#F3F5F6
- input.border#C9DFF2
- input.foreground#1B2733
- input.placeholderForeground#9BB3C9
- inputOption.activeBackground#D2E9FB
- inputOption.activeBorder#2196F3
- list.activeSelectionBackground#D2E9FB
- list.activeSelectionForeground#1B2733
- list.focusBackground#D2E9FB
- list.highlightForeground#1565C0
- list.hoverBackground#EEF6FD
- list.inactiveSelectionBackground#E8F3FC
- notificationCenterHeader.background#E7F0F8
- notifications.background#F3F5F6
- notifications.border#DCEAF7
- panel.background#F1F6FA
- panel.border#DCEAF7
- panelTitle.activeBorder#2196F3
- panelTitle.activeForeground#1565C0
- panelTitle.inactiveForeground#8FA6BD
- scrollbarSlider.activeBackground#9D8FE0CC
- scrollbarSlider.background#C9D4F099
- scrollbarSlider.hoverBackground#B3AEE8AA
- selection.background#BBDEFB
- sideBar.background#F1F6FA
- sideBar.border#DCEAF7
- sideBar.foreground#2B3A4A
- sideBarSectionHeader.background#E7F0F8
- sideBarSectionHeader.border#DCEAF7
- sideBarTitle.foreground#1B2733
- statusBar.background#2196F3
- statusBar.border#1E88E5
- statusBar.debuggingBackground#F57C00
- statusBar.debuggingForeground#FFFFFF
- statusBar.foreground#FFFFFF
- statusBar.noFolderBackground#90A9C4
- statusBarItem.hoverBackground#1E88E5
- tab.activeBackground#F3F5F6
- tab.activeBorderTop#2196F3
- tab.activeForeground#1B2733
- tab.border#DCEAF7
- tab.hoverBackground#F1F6FA
- tab.inactiveBackground#E7F0F8
- tab.inactiveForeground#7C93AB
- terminal.ansiBlack#37474F
- terminal.ansiBlue#1976D2
- terminal.ansiCyan#0097A7
- terminal.ansiGreen#2E7D32
- terminal.ansiMagenta#7B1FA2
- terminal.ansiRed#C62828
- terminal.ansiWhite#F1F6FA
- terminal.ansiYellow#C77B00
- terminal.background#F3F5F6
- terminal.foreground#1B2733
- titleBar.activeBackground#E7F0F8
- titleBar.activeForeground#1B2733
- titleBar.border#DCEAF7
- titleBar.inactiveBackground#F1F6FA
- titleBar.inactiveForeground#8FA6BD
- widget.shadow#00000022
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| — | #1B2733 | — |
| comment, punctuation.definition.comment | #8FA6BD | italic |
| string, string.quoted, string.template | #9C5680 | — |
| constant.numeric, constant.language, constant.character | #1E88E5 | — |
| keyword, keyword.control, storage.type, storage.modifier | #0B5FFF | — |
| keyword.operator | #37474F | — |
| entity.name.function, support.function, meta.function-call | #0277BD | — |
| entity.name.type, entity.name.class, support.class, storage.type.class | #6B5B95 | — |
| variable, variable.other, variable.parameter | #263238 | — |
| entity.other.attribute-name, support.type.property-name | #0288D1 | — |
| entity.name.tag | #1565C0 | — |
| punctuation, meta.brace | #4C6B85 | — |
| markup.bold | — | bold |
| markup.italic | — | italic |
| invalid, invalid.illegal | #C62828 | — |