Seafarer

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#191C25
• activityBar.foreground#A5CAF5
• activityBar.inactiveForeground#E1E5ED
• activityBarBadge.background#3F5E7F
• activityBarBadge.foreground#CED4DD
• badge.background#3F5E7F
• badge.foreground#CED4DD
• breadcrumb.activeSelectionForeground#CED4DD
• button.background#3F5E7F
• button.foreground#CED4DD
• button.hoverBackground#5680AD
• checkbox.background#191C25
• checkbox.border#A5CAF5
• checkbox.foreground#CED4DD
• descriptionForeground#CED4DD
• diffEditor.insertedTextBackground#191C25
• diffEditor.removedTextBackground#CED4DD
• dropdown.background#13151B
• dropdown.border#90B7DB
• dropdown.foreground#CED4DD
• dropdown.listBackground#191C25
• editor.background#1F2430
• editor.findMatchBackground#3F5E7F
• editor.findMatchHighlightBackground#3F5E7F
• editor.foreground#CED4DD
• editor.lineHighlightBackground#191C25
• editor.rangeHighlightBackground#191C25
• editor.selectionBackground#3F5E7F
• editorBracketMatch.border#1F2430
• editorCursor.foreground#CED4DD
• editorError.border#BA2828
• editorError.foreground#BA2828
• editorGroup.border#90B7DB
• editorGroup.dropBackground#3F5E7F
• editorGroupHeader.noTabsBackground#3F5E7F
• editorGroupHeader.tabsBackground#1F2430
• editorGutter.addedBackground#3EAD58
• editorGutter.background#1F2430
• editorGutter.deletedBackground#BA2828
• editorGutter.modifiedBackground#D3753F
• editorHint.foreground#CED4DD
• editorIndentGuide.background#3F5E7F
• editorLineNumber.foreground#3F5E7F
• editorLink.activeForeground#CED4DD
• editorOverviewRuler.addedForeground#3EAD58
• editorOverviewRuler.currentContentForeground#BA2828
• editorOverviewRuler.deletedForeground#90B7DB
• editorOverviewRuler.errorForeground#BA2828
• editorOverviewRuler.modifiedForeground#D3753F
• editorOverviewRuler.warningForeground#C6B547
• editorRuler.foreground#3F5E7F
• editorWarning.foreground#C6B547
• editorWhitespace.foreground#3F5E7F
• editorWidget.background#13151B
• editorWidget.foreground#90B7DB
• editorWidget.resizeBorder#3F5E7F
• errorForeground#BA2828
• extensionBadge.remoteBackground#D3753F
• extensionBadge.remoteForeground#CED4DD
• extensionButton.prominentBackground#3EAD58
• extensionButton.prominentForeground#CED4DD
• extensionButton.prominentHoverBackground#3EAD58
• focusBorder#90B7DB
• foreground#CED4DD
• gitDecoration.addedResourceForeground#3EAD58
• gitDecoration.conflictingResourceForeground#BA2828
• gitDecoration.deletedResourceForeground#BA2828
• gitDecoration.ignoredResourceForeground#7E8CA4
• gitDecoration.modifiedResourceForeground#D3753F
• gitDecoration.untrackedResourceForeground#CED4DD
• icon.foreground#90B7DB
• input.background#13151B
• input.border#13151B
• input.foreground#F2F5F9
• input.placeholderForeground#5680AD
• inputOption.activeBackground#3F5E7F
• list.activeSelectionBackground#191C25
• list.activeSelectionForeground#CED4DD
• list.errorForeground#BA2828
• list.focusBackground#3F5E7F
• list.focusForeground#CED4DD
• list.highlightForeground#90B7DB
• list.hoverBackground#191C25
• list.hoverForeground#CED4DD
• list.inactiveSelectionBackground#191C25
• list.inactiveSelectionForeground#CED4DD
• list.warningForeground#90B7DB
• listFilterWidget.background#191C25
• listFilterWidget.outline#90B7DB
• menu.separatorBackground#3F5E7F
• minimap.errorHighlight#BA2828
• minimap.findMatchHighlight#3F5E7F
• minimap.selectionHighlight#90B7DB
• minimap.warningHighlight#C6B547
• minimapGutter.addedBackground#3EAD58
• minimapGutter.deletedBackground#7E8CA4
• minimapGutter.modifiedBackground#AD5A3E
• notifications.background#3F5E7F
• panel.background#191C25
• panel.border#191C25
• panelTitle.activeForeground#CED4DD
• panelTitle.inactiveForeground#3EAD58
• peekViewResult.lineForeground#D3753F
• peekViewResult.selectionForeground#D3753F
• pickerGroup.border#191C25
• pickerGroup.foreground#90B7DB
• progressBar.background#5680AD
• scrollbar.shadow#191C25
• scrollbarSlider.activeBackground#3F5E7F
• scrollbarSlider.background#191C25
• scrollbarSlider.hoverBackground#3F5E7F
• selection.background#90B7DB
• settings.headerForeground#CED4DD
• sideBar.background#1F2430
• sideBar.border#13151B
• sideBar.foreground#CED4DD
• sideBarSectionHeader.background#191C25
• sideBarSectionHeader.foreground#CED4DD
• sideBarTitle.foreground#CED4DD
• statusBar.background#191C25
• statusBar.border#1F2430
• statusBar.debuggingBackground#D3753F
• statusBar.foreground#CED4DD
• statusBar.noFolderBackground#3F5E7F
• statusBar.noFolderForeground#CED4DD
• statusBarItem.activeBackground#1F2430
• statusBarItem.hoverBackground#1F2430
• tab.activeBackground#1F2430
• tab.activeBorderTop#A5CAF5
• tab.activeForeground#CED4DD
• tab.inactiveBackground#1F2430
• tab.inactiveForeground#CED4DD
• terminal.ansiBlack#191C25
• terminal.ansiBlue#90B7DB
• terminal.ansiCyan#5680AD
• terminal.ansiGreen#3EAD58
• terminal.ansiMagenta#7349A3
• terminal.ansiRed#BA2828
• terminal.ansiWhite#CED4DD
• terminal.ansiYellow#C6B547
• terminal.background#1F2430
• terminal.foreground#CED4DD
• terminalCursor.background#3F5E7F
• terminalCursor.foreground#CED4DD
• textBlockQuote.background#191C25
• textCodeBlock.background#191C25
• textLink.activeForeground#CED4DD
• textLink.foreground#5680AD
• textPreformat.foreground#CED4DD
• textSeparator.foreground#191C25
• titleBar.activeBackground#1F2430
• titleBar.activeForeground#CED4DD
• titleBar.inactiveBackground#1F2430
• tree.indentGuidesStroke#5680AD
• widget.shadow#1F2430

tokenColors

TextMate scopes and font styles (syntax highlighting rules).