Ocean Dive Themes
Publisher: CodetownThemes in package: 6
Beautiful ocean-themed dark and light themes with Material Design Ocean backgrounds and harmonious color palettes
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#070D1B
- activityBar.foreground#EAF6FF
- activityBar.inactiveForeground#6C7A89
- activityBarItem.background#070D1B
- activityBarItem.border#6C7A8940
- activityBarItem.foreground#EAF6FF
- button.hoverBackground#101624
- dropdown.background#030509
- dropdown.foreground#EAF6FF
- dropdown.listBackground#030509
- editor.background#070D1B
- editor.foreground#EAF6FF
- editor.inactiveSelectionBackground#10162488
- editor.lineHighlightBackground#101624
- editor.selectionBackground#3DEB8933
- editor.snippetFinalTabstopHighlightBackground#070D1B
- editor.snippetFinalTabstopHighlightBorder#3DEB89
- editor.snippetTabstopHighlightBackground#070D1B
- editor.snippetTabstopHighlightBorder#3DEB89
- editorCursor.foreground#3DEB89
- editorError.background#070D1B
- editorError.border#9B7BB8
- editorError.foreground#EAF6FF
- editorGroupHeader.tabsBackground#070D1B
- editorIndentGuide.activeBackground1#3DEB89
- editorIndentGuide.background1#101624
- editorInfo.background#070D1B
- editorInfo.border#3DEB89
- editorInfo.foreground#EAF6FF
- editorSuggestWidget.background#070D1B
- editorSuggestWidget.border#6C7A8940
- editorSuggestWidget.foreground#EAF6FF
- editorWarning.background#070D1B
- editorWarning.border#E6B17A
- editorWarning.foreground#EAF6FF
- focusBorder#6C7A8940
- input.background#070D1B
- input.border#101624
- input.foreground#EAF6FF
- input.placeholderForeground#6C7A89
- inputOption.activeBackground#101624
- inputOption.activeBorder#6C7A8940
- inputOption.hoverBackground#101624
- list.activeSelectionBackground#101624
- list.activeSelectionForeground#FFFFFF
- list.focusOutline#6C7A8940
- list.inactiveSelectionBackground#070D1B
- list.inactiveSelectionForeground#EAF6FF
- menu.background#070D1B
- menu.foreground#EAF6FF
- menu.selectionBackground#101624
- menu.selectionForeground#3DEB89
- menubar.selectionBackground#101624
- menubar.selectionForeground#3DEB89
- notification.background#070D1B
- notification.border#3DEB89
- notification.foreground#EAF6FF
- notificationToast.background#070D1B
- notificationToast.border#3DEB89
- notificationToast.foreground#EAF6FF
- panel.background#101624
- panel.border#6C7A8940
- quickInput.background#070D1B
- quickInput.foreground#EAF6FF
- quickInputList.focusBackground#101624
- quickInputList.focusForeground#FFFFFF
- sideBar.background#070D1B
- statusBar.background#070D1B
- statusBar.border#6C7A8940
- statusBar.foreground#EAF6FF
- statusBarItem.background#070D1B
- statusBarItem.border#6C7A8940
- statusBarItem.foreground#EAF6FF
- tab.activeBackground#101624
- tab.hoverBackground#101624
- tab.inactiveBackground#070D1B
- terminal.background#070D1B
- terminal.foreground#EAF6FF
- terminal.selectionBackground#101624
- terminalCursor.background#EAF6FF
- terminalCursor.foreground#3DEB89
- titleBar.activeBackground#070D1B
- titleBar.activeForeground#EAF6FF
- titleBar.border#6C7A8940
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #8B7355 | italic |
| string, constant.other.symbol | #D4A574 | — |
| variable, identifier | #B8A9C9 | — |
| storage.type, storage.modifier | #9B7BB8 | — |
| keyword, storage.type, import, support.type | #A8C8A0 | bold |
| constant.numeric, constant.language | #E6B17A | — |
| variable.parameter, meta.parameter | #C4A484 | — |
| entity.name.function, support.function, meta.function-call, variable.function | #8FB3D3 | — |
| support.class.builtin.js, support.class | #B8A9C9 | — |
| entity.name.type, entity.name.interface, support.type | #A8C8A0 | — |
| entity.name.tag, support.class.component.html | #A8D8B9 | — |
| entity.other.attribute-name, attribute.name | #E5C07B | — |
| string.quoted.double.html, string.quoted.single.html | #D4A574 | — |
| support.type.property-name.css, meta.property-name.css | #8FB3D3 | — |
| support.constant.property-value.css, constant.other.color.rgb-value.css, constant.numeric.css | #C4A484 | — |
| constant.language.boolean, constant.language.null | #E6B17A | — |
| entity.name.function | #8FB3D3 | — |