Phelipe Blue
Publisher: Phelipe Gabriel dos Santos VianaThemes in package: 1
A modern blue dark theme for VS Code, created by Phelipe Viana.
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#60a5fa
- activityBar.background#001536
- activityBar.border#0c356a
- activityBar.foreground#ffffff
- activityBar.inactiveForeground#7890bd
- activityBarBadge.background#38bdf8
- activityBarBadge.foreground#001536
- badge.background#bbdaffcc
- badge.foreground#001733
- breadcrumb.activeSelectionForeground#dbeafe
- breadcrumb.background#002b66
- breadcrumb.focusForeground#ffffff
- breadcrumb.foreground#93a4c7
- button.background#1d74d8
- button.foreground#ffffff
- button.hoverBackground#2688f2
- button.secondaryBackground#124f91
- button.secondaryForeground#dbeafe
- button.secondaryHoverBackground#1765b3
- debugToolBar.background#001c40
- descriptionForeground#93a4c7
- dropdown.background#063a7b
- dropdown.border#1d5f9f
- dropdown.foreground#f3f8ff
- editor.background#002b66
- editor.findMatchBackground#fbbf2455
- editor.findMatchBorder#fbbf24
- editor.findMatchHighlightBackground#60a5fa30
- editor.foreground#dbeafe
- editor.inactiveSelectionBackground#0d467f
- editor.lineHighlightBackground#083574
- editor.lineHighlightBorder#2b78c244
- editor.selectionBackground#155aa3
- editor.selectionHighlightBackground#60a5fa33
- editor.wordHighlightBackground#60a5fa22
- editor.wordHighlightStrongBackground#60a5fa35
- editorBracketMatch.background#60a5fa24
- editorBracketMatch.border#8ec5ff
- editorCursor.foreground#ffffff
- editorGroup.border#404f7d
- editorGroup.dropBackground#25375daa
- editorGroupHeader.tabsBackground#001733
- editorGutter.addedBackground#9ece6a
- editorGutter.background#002b66
- editorGutter.deletedBackground#e06c3a
- editorGutter.modifiedBackground#7aa2f7
- editorHoverWidget.background#001c40
- editorHoverWidget.border#ffffff44
- editorIndentGuide.activeBackground1#8ec5ff
- editorIndentGuide.background1#31527f
- editorLineNumber.activeForeground#dbeafe
- editorLineNumber.foreground#6683b5
- editorWhitespace.foreground#7f9cca55
- editorWidget.background#063a7b
- editorWidget.border#1d5f9f
- editorWidget.foreground#dbeafe
- errorForeground#ff8f5f
- focusBorder#60a5fa99
- foreground#dbeafe
- icon.foreground#a9bddf
- input.background#063a7b
- input.border#1d5f9f
- input.foreground#f3f8ff
- input.placeholderForeground#879bc3
- inputOption.activeBorder#60a5fa
- list.activeSelectionBackground#124f91
- list.activeSelectionForeground#ffffff
- list.errorForeground#ff9b6a
- list.focusBackground#124f91
- list.highlightForeground#7dd3fc
- list.hoverBackground#083574
- list.inactiveSelectionBackground#0b3f77
- list.inactiveSelectionForeground#dbeafe
- list.warningForeground#facc15
- minimap.selectionHighlight#003f8e
- panel.background#001f4f
- panel.border#0c356a
- panelTitle.activeBorder#60a5fa
- panelTitle.activeForeground#ffffff
- panelTitle.inactiveForeground#879bc3
- peekView.border#60a5fa
- peekViewEditor.background#00265a
- peekViewResult.background#001d47
- pickerGroup.foreground#bbdaff
- ports.iconRunningProcessForeground#bbdaff
- progressBar.background#bbdaffcc
- quickInput.background#063a7b
- quickInput.foreground#dbeafe
- quickInputList.focusBackground#ffffff60
- quickInputTitle.background#002b66
- sash.hoverBorder#60a5fa
- scrollbarSlider.activeBackground#b1d4ff88
- scrollbarSlider.background#7296cc40
- scrollbarSlider.hoverBackground#8eb6ee66
- sideBar.background#001d47
- sideBar.border#0c356a
- sideBar.foreground#c8d9f4
- sideBarSectionHeader.background#062a5c
- sideBarSectionHeader.border#164a83
- sideBarSectionHeader.foreground#dbeafe
- sideBarTitle.foreground#f3f8ff
- statusBar.background#063a7b
- statusBar.border#0c356a
- statusBar.debuggingBackground#1e3a8a
- statusBar.foreground#ffffff
- statusBar.noFolderBackground#063a7b
- statusBarItem.hoverBackground#155aa3
- statusBarItem.remoteBackground#38bdf8
- statusBarItem.remoteForeground#001536
- tab.activeBackground#002b66
- tab.activeBorderTop#60a5fa
- tab.activeForeground#ffffff
- tab.activeModifiedBorder#facc15
- tab.border#0c356a
- tab.hoverBackground#063a7b
- tab.inactiveBackground#001d47
- tab.inactiveForeground#93a4c7
- tab.inactiveModifiedBorder#b6922f
- tab.lastPinnedBorder#007acc80
- tab.unfocusedActiveForeground#c8d9f4
- tab.unfocusedInactiveForeground#7086ae
- terminal.ansiBlack#001d47
- terminal.ansiBlue#82aaff
- terminal.ansiBrightBlack#6683b5
- terminal.ansiBrightBlue#a8c7ff
- terminal.ansiBrightCyan#b7f0ff
- terminal.ansiBrightGreen#d7f7a8
- terminal.ansiBrightMagenta#ddb6f2
- terminal.ansiBrightRed#ffb08a
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#ffe6a6
- terminal.ansiCyan#89ddff
- terminal.ansiGreen#c3e88d
- terminal.ansiMagenta#c792ea
- terminal.ansiRed#ff8f5f
- terminal.ansiWhite#dbeafe
- terminal.ansiYellow#ffd580
- terminal.background#002b66
- terminal.foreground#dbeafe
- terminalCursor.foreground#ffffff
- titleBar.activeBackground#001536
- titleBar.activeForeground#dbeafe
- titleBar.border#0c356a
- titleBar.inactiveBackground#00122c
- titleBar.inactiveForeground#7086ae
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| — | #dbeafe | — |
| meta.embedded, source.groovy.embedded, meta.jsx.children, string meta.image.inline.markdown, variable.legacy.builtin.python | #FFFFFF | — |
| comment | #8398c7 | — |
| keyword.operator.class, keyword.operator, constant.other, source.php.embedded.line | #FFFFFF | |
| variable, support.other.variable, string.other.link, string.regexp, entity.name.tag, entity.other.attribute-name, meta.tag, declaration.tag, markup.deleted.git_gutter | #ffb86c | — |
| constant.numeric, constant.language, support.constant, constant.character, variable.parameter, punctuation.section.embedded, keyword.other.unit | #FD971F | |
| entity.name.class, entity.name.type, entity.name.namespace, entity.name.scope-resolution, support.type, support.class | #ffedb3 | |
| string, constant.other.symbol, entity.other.inherited-class, punctuation.separator.namespace.ruby, markup.heading, markup.inserted.git_gutter | #c3e88d | |
| keyword.operator, constant.other.color | #89ddff | — |
| entity.name.function, support.function, keyword.other.special-method, markup.changed.git_gutter | #A6E22E | |
| keyword, storage, storage.type, entity.name.tag.css, entity.name.tag.less | #c792ea | |
| invalid | #ff8f5f | |
| meta.separator | #FFFFFF | — |
| invalid.deprecated | #cd9731 | |
| markup.inserted.diff, markup.deleted.diff, meta.diff.header.to-file, meta.diff.header.from-file | #FFFFFF | — |
| markup.inserted.diff, meta.diff.header.to-file | #718c00 | — |
| markup.deleted.diff, meta.diff.header.from-file | #e06c3a | — |
| meta.diff.header.from-file, meta.diff.header.to-file | #4271ae | — |
| meta.diff.range | #3e999f | italic |
| markup.quote | #FFC58F | — |
| markup.list | #BBDAFF | — |
| markup.bold, markup.italic | #FFC58F | — |
| markup.bold | — | bold |
| markup.italic | — | italic |
| markup.strikethrough | — | strikethrough |
| markup.inline.raw | #ffb86c | |
| markup.heading | — | bold |
| token.info-token | #6796e6 | — |
| token.warn-token | #cd9731 | — |
| token.error-token | #f44747 | — |
| token.debug-token | #b267e6 | — |
| punctuation, meta.brace, meta.delimiter | #a9bddf | — |
| entity.name.tag.tsx, entity.name.tag.jsx, support.class.component.tsx, support.class.component.jsx | #89ddff | — |
| support.type.property-name.css, support.type.property-name.scss, meta.property-name.css | #82aaff | — |
| meta.function-call, meta.function-call entity.name.function, meta.function-call support.function, variable.function, support.function.any-method, meta.method-call, entity.name.function.member, entity.name.function.method | #66D9EF | |
| entity.name.function, meta.function entity.name.function, meta.method.declaration entity.name.function, meta.definition.method entity.name.function | #A6E22E |