Ocean Theme
Publisher: Nikhil SarafThemes in package: 1
Ocean theme
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#80CBC4
- activityBar.background#1B2B34
- activityBar.border#80CBC430
- activityBar.dropBackground#607d8b30
- activityBar.foreground#F7F7F7
- activityBar.inactiveForeground#607d8b
- activityBarBadge.background#80CBC4
- activityBarBadge.foreground#000000
- badge.background#D8DEE9
- badge.foreground#000000
- breadcrumb.activeSelectionForeground#80CBC4
- breadcrumb.background#1B2B3430
- breadcrumb.focusForeground#D8DEE9
- breadcrumb.foreground#607d8b
- breadcrumbPicker.background#1B2B34
- button.background#80CBC4
- button.foreground#000000
- button.hoverBackground#6699CC
- debugToolBar.background#1B2B34
- dropdown.background#273942
- dropdown.border#273942
- dropdown.foreground#D8DEE9
- dropdown.listBackground#273942
- editor.background#273942
- editor.findMatchBackground#F9875775
- editor.findMatchBorder#00000000
- editor.findMatchHighlightBackground#F9AE5875
- editor.findMatchHighlightBorder#00000000
- editor.findRangeHighlightBorder#00000000
- editor.foreground#D8DEE9
- editor.hoverHighlightBackground#80CBC420
- editor.inactiveSelectionBackground#80CBC410
- editor.lineHighlightBackground#00000000
- editor.lineHighlightBorder#00000000
- editor.selectionBackground#607d8b80
- editor.selectionHighlightBackground#80CBC415
- editor.selectionHighlightBorder#00000000
- editor.wordHighlightBackground#6699CC25
- editor.wordHighlightBorder#00000000
- editorBracketMatch.background#6699CC50
- editorBracketMatch.border#00000000
- editorCursor.foreground#F9AE58
- editorError.border#00000000
- editorError.foreground#EC5f6790
- editorGroup.border#1B2B3430
- editorGroupHeader.noTabsBackground#1B2B34
- editorGroupHeader.tabsBackground#1B2B34
- editorGutter.addedBackground#99C79450
- editorGutter.background#273942
- editorGutter.deletedBackground#EC5f6750
- editorGutter.modifiedBackground#6699CC50
- editorHint.border#00000000
- editorHint.foreground#AFBDC490
- editorIndentGuide.activeBackground#AFBDC430
- editorIndentGuide.background#4E5D6530
- editorInfo.border#00000000
- editorInfo.foreground#AFBDC490
- editorLineNumber.activeForeground#AFBDC4
- editorLineNumber.foreground#4E5D65
- editorLink.activeForeground#00000000
- editorOverviewRuler.addedForeground#99C79450
- editorOverviewRuler.border#1B2B34
- editorOverviewRuler.deletedForeground#EC5f6750
- editorOverviewRuler.errorForeground#EC5f6780
- editorOverviewRuler.modifiedForeground#6699CC50
- editorOverviewRuler.warningForeground#FAC86350
- editorSuggestWidget.background#1B2B34
- editorSuggestWidget.border#1B2B3410
- editorSuggestWidget.foreground#D8DEE9
- editorSuggestWidget.highlightForeground#80CBC4
- editorSuggestWidget.selectedBackground#00000050
- editorUnnecessaryCode.border#607d8b
- editorWarning.border#00000000
- editorWarning.foreground#FAC86370
- editorWhitespace.foreground#D8DEE935
- editorWidget.background#1B2B34
- editorWidget.border#1B2B34
- editorWidget.resizeBorder#80CBC4
- errorForeground#EC5f67
- extensionButton.prominentBackground#000000
- extensionButton.prominentForeground#80CBC4
- extensionButton.prominentHoverBackground#6699CC
- focusBorder#F7F7F700
- foreground#D8DEE9
- gitDecoration.addedResourceForeground#99C794
- gitDecoration.deletedResourceForeground#EC5f67
- gitDecoration.modifiedResourceForeground#6699CC
- gitDecoration.untrackedResourceForeground#FAC863
- input.background#1B2B34
- input.border#273942
- input.foreground#F7F7F7
- input.placeholderForeground#607d8b
- list.activeSelectionBackground#607d8b50
- list.activeSelectionForeground#80CBC4
- list.dropBackground#607d8b50
- list.focusBackground#607d8b50
- list.hoverBackground#607d8b20
- list.hoverForeground#D8DEE9
- list.inactiveSelectionBackground#607d8b30
- list.inactiveSelectionForeground#80CBC4
- menu.background#1B2B34
- menu.foreground#D8DEE9
- menu.selectionBackground#607d8b50
- menu.selectionForeground#F7F7F7
- notification.background#273942
- notification.foreground#D8DEE9
- panel.background#1B2B34
- panel.border#80CBC430
- panel.dropBackground#1B2B3470
- panelTitle.activeBorder#80CBC4
- panelTitle.activeForeground#F7F7F7
- panelTitle.inactiveForeground#607d8b
- progressBar.background#80CBC4
- scrollbar.shadow#1B2B3470
- settings.checkboxBackground#1B2B34
- settings.checkboxBorder#1B2B34
- settings.checkboxForeground#F7F7F7
- settings.dropdownBackground#1B2B34
- settings.dropdownBorder#1B2B34
- settings.dropdownForeground#D8DEE9
- settings.dropdownListBorder#1B2B34
- settings.headerForeground#80CBC4
- settings.modifiedItemIndicator#5FB3B3
- settings.numberInputBackground#1B2B34
- settings.numberInputBorder#1B2B34
- settings.numberInputForeground#FAC863
- settings.textInputBackground#1B2B34
- settings.textInputBorder#1B2B34
- settings.textInputForeground#99C794
- sideBar.background#1B2B34
- sideBar.border#80CBC430
- sideBar.dropBackground#1B2B3430
- sideBar.foreground#607d8b
- sideBarSectionHeader.background#1B2B34
- sideBarSectionHeader.border#80CBC430
- sideBarSectionHeader.foreground#D8DEE9
- sideBarTitle.foreground#D8DEE9
- statusBar.background#1B2B34
- statusBar.border#80CBC430
- statusBar.debuggingBackground#80CBC4
- statusBar.debuggingBorder#80CBC4
- statusBar.debuggingForeground#000000
- statusBar.foreground#607d8b
- statusBar.noFolderBackground#1B2B34
- statusBar.noFolderBorder#1B2B34
- statusBar.noFolderForeground#607d8b
- statusBarItem.activeBackground#273942
- statusBarItem.hoverBackground#607d8b20
- statusBarItem.prominentBackground#80CBC4
- statusBarItem.prominentForeground#000000
- statusBarItem.prominentHoverBackground#6699CC
- tab.activeBackground#273942
- tab.activeBorder#80CBC4
- tab.activeForeground#F7F7F7
- tab.activeModifiedBorder#607d8b
- tab.border#1B2B34
- tab.hoverBackground#273942
- tab.inactiveBackground#1B2B34
- tab.inactiveForeground#607d8b
- tab.unfocusedActiveBorder#607d8b
- tab.unfocusedActiveForeground#D8DEE9
- terminal.ansiBlack#4E5D65
- terminal.ansiBlue#6699CC
- terminal.ansiBrightBlack#4E5D65
- terminal.ansiBrightBlue#42A5F5
- terminal.ansiBrightCyan#00ACA2
- terminal.ansiBrightGreen#CDDC39
- terminal.ansiBrightMagenta#D81B60
- terminal.ansiBrightRed#EC5f67
- terminal.ansiBrightWhite#D8DEE9
- terminal.ansiBrightYellow#FFC135
- terminal.ansiCyan#5FB3B3
- terminal.ansiGreen#99C794
- terminal.ansiMagenta#C695C6
- terminal.ansiRed#EC5f67
- terminal.ansiWhite#D8DEE9
- terminal.ansiYellow#FAC863
- terminal.background#1B2B34
- terminal.border#80CBC430
- terminal.foreground#D8DEE9
- terminal.selectionBackground#607d8b50
- terminalCursor.foreground#F9AE58
- textBlockQuote.background#1B2B34
- textBlockQuote.border#1B2B34
- textCodeBlock.background#273942
- textLink.activeForeground#D8DEE9
- textLink.foreground#80CBC4
- titleBar.activeBackground#1B2B34
- titleBar.activeForeground#D8DEE9
- titleBar.border#1B2B3400
- titleBar.inactiveBackground#263238
- titleBar.inactiveForeground#607d8b
- walkThrough.embeddedEditorBackground#273942
- welcomePage.background#273942
- welcomePage.buttonBackground#1B2B34
- welcomePage.buttonHoverBackground#607d8b20
- widget.shadow#1B2B3450
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment | #4E5D65 | — |
| constant | #D8DEE9 | — |
| constant.numeric | #FAC863 | — |
| constant.character | #CDDC39 | — |
| constant.character.escape | #C695C6 | — |
| constant.language | #EC5f67 | italic |
| constant.other | #6699CC | — |
| entity.name | #6699CC | — |
| entity.name.type | #6699CC | italic |
| entity.name.function | #5FB3B3 | — |
| meta.function-call entity.name.function, meta.function-call | #6699CC | — |
| meta.function-call.arguments | #D8DEE9 | — |
| entity.name.tag | #EC5f67 | — |
| entity.name.section | — | — |
| entity.name.type.class | #F9AE58 | |
| entity.other.inherited-class | #6699CC | italic |
| entity.other.attribute-name | #C695C6 | — |
| punctuation | #AFBDC4 | — |
| punctuation.accessor | #F98757 | — |
| punctuation.separator | #F98757 | — |
| punctuation.definition.comment | #4E5D65 | — |
| punctuation.definition.keyword | #C695C6 | — |
| punctuation.section | #5FB3B3 | — |
| punctuation.definition | #5FB3B3 | — |
| punctuation.definition.variable | #D8DEE9 | — |
| keyword.control | #C695C6 | — |
| keyword.control.import, keyword.control.export, keyword.control.from | #80CBC4 | — |
| keyword.operator | #5FB3B3 | — |
| keyword.other | #EC5f67 | — |
| storage.type | #C695C6 | — |
| storage.modifier | #C695C6 | — |
| string.quoted | #99C794 | — |
| string.quoted.triple | #5FB3B3 | — |
| string.unquoted.interpolated | #C695C6 | — |
| string.unquoted.regexp | #EC5f67 | — |
| string.template | #C695C6 | — |
| support.function | #EC5f67 | — |
| support.class | #EC5f67 | italic |
| support.type | #EC5f67 | italic |
| support.constant | #EC5f67 | — |
| support.variable | #EC5f67 | — |
| support.other | #EC5f67 | — |
| variable.language | #EC5f67 | italic |
| variable.parameter | #F9AE58 | — |
| variable.other | #D8DEE9 | — |
| variable.other.constant.property | #99C794 | — |
| variable.object.property | #5FB3B3 | — |
| meta.object-literal.key | #5FB3B3 | — |