Skip to main content
Coding Theme

Space Ocean Kit Refined

Publisher: space-ocean-kit-refinedThemes in package: 1

This is a refined redesign of the theme OceanKit with a little inspiration by One Dark Pro. Supported files: *.js, *.html, *.css, *.jsx, *.json, *.md, and *.py

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#2b303b
  • activityBar.dropBackground#353b49
  • activityBar.foreground#c0c5ce
  • activityBarBadge.background#1c1f26
  • activityBarBadge.foreground#c0c5ce
  • badge.background#1c1f26
  • badge.foreground#c0c5ce
  • button.background#2b303b
  • button.foreground#c0c5ce
  • button.hoverBackground#353b49
  • descriptionForeground#c0c5ce
  • dropdown.background#14171c
  • dropdown.border#2b303b
  • dropdown.foreground#c0c5ce
  • editor.background#2b303b
  • editor.findMatchBackground#96b5b4
  • editor.foreground#d4d4d4
  • editor.hoverHighlightBackground#96b5b4
  • editor.inactiveSelectionBackground#96b5b4
  • editor.lineHighlightBorder#22262f
  • editor.selectionBackground#96b5b4
  • editor.selectionHighlightBackground#8891a2
  • editor.selectionHighlightBorder#96b5b4
  • editorCursor.foreground#96b5b4
  • editorError.foreground#bf5f69
  • editorGroup.background#2b303b
  • editorGroup.border#1c1f26
  • editorGroup.dropBackground#1c1f26
  • editorGroupHeader.noTabsBackground#1c1f26
  • editorGroupHeader.tabsBackground#1c1f26
  • editorHint.foreground#96b5b4
  • editorHoverWidget.background#353b49
  • editorIndentGuide.activeBackground#669190
  • editorIndentGuide.background#353b49
  • editorInfo.foreground#96b5b4
  • editorLineNumber.activeForeground#c0c5ce
  • editorLineNumber.foreground#8891a2
  • editorSuggestWidget.foreground#c0c5ce
  • editorSuggestWidget.selectedBackground#353b49
  • editorWarning.foreground#ebcb8b
  • editorWidget.background#2b303b
  • editorWidget.border#353b49
  • errorForeground#bf5f69
  • focusBorder#c0c5ce
  • foreground#c0c5ce
  • gitDecoration.conflictingResourceForeground#bf5f69
  • gitDecoration.deletedResourceForeground#dda73b
  • gitDecoration.ignoredResourceForeground#8891a2
  • gitDecoration.modifiedResourceForeground#dda73b
  • gitDecoration.untrackedResourceForeground#a3be89
  • input.background#14171c
  • input.border#2b303b
  • input.foreground#c0c5ce
  • input.placeholderForeground#8891a2
  • inputOption.activeBorder#c0c5ce
  • inputValidation.errorBackground#993d46
  • inputValidation.errorBorder#bf5f69
  • inputValidation.infoBackground#993d46
  • inputValidation.infoBorder#bf5f69
  • inputValidation.warningBackground#dda73b
  • inputValidation.warningBorder#ebcb8b
  • list.activeSelectionBackground#2b303b
  • list.activeSelectionForeground#f7f8f9
  • list.dropBackground#2b303b
  • list.focusBackground#2b303b
  • list.focusForeground#c0c5ce
  • list.hoverBackground#353b49
  • list.hoverForeground#8891a2
  • list.inactiveSelectionBackground#2b303b
  • list.inactiveSelectionForeground#c0c5ce
  • list.invalidItemForeground#bf5f69
  • notificationCenterHeader.background#2b303b
  • notificationCenterHeader.foreground#c0c5ce
  • notificationLink.foreground#96b5b4
  • notifications.background#2b303b
  • notifications.foreground#c0c5ce
  • progressBar.background#a3be89
  • scrollbar.shadow#14171c
  • scrollbarSlider.activeBackground#20242c
  • scrollbarSlider.background#353b49
  • scrollbarSlider.hoverBackground#20242c
  • selection.background#96b5b4
  • sideBar.background#1c1f26
  • sideBar.dropBackground#2b303b
  • sideBar.foreground#c0c5ce
  • sideBarSectionHeader.background#2b303b
  • sideBarSectionHeader.foreground#c0c5ce
  • sideBarTitle.foreground#c0c5ce
  • statusBar.background#1c1f26
  • statusBar.debuggingBackground#bf5f69
  • statusBar.debuggingForeground#1c1f26
  • statusBar.foreground#c0c5ce
  • tab.activeBackground#2b303b
  • tab.activeForeground#f7f8f9
  • tab.border#2b303b
  • tab.hoverBackground#2b303b
  • tab.hoverBorder#c0c5ce
  • tab.inactiveBackground#1c1f26
  • tab.inactiveForeground#c0c5ce
  • terminal.ansiBlack#1c1f26
  • terminal.ansiBlue#96b5b4
  • terminal.ansiBrightBlack#22262f
  • terminal.ansiBrightBlue#c6d7d6
  • terminal.ansiBrightCyan#c6d7d6
  • terminal.ansiBrightGreen#ccdbbd
  • terminal.ansiBrightMagenta#d4bed0
  • terminal.ansiBrightRed#d39298
  • terminal.ansiBrightWhite#f7f8f9
  • terminal.ansiBrightYellow#f8eeda
  • terminal.ansiCyan#96b5b4
  • terminal.ansiGreen#a3be89
  • terminal.ansiMagenta#b48ead
  • terminal.ansiRed#bf5f69
  • terminal.ansiWhite#c0c5ce
  • terminal.ansiYellow#ebcb8b
  • terminal.background#2b303b
  • terminal.border#c0c5ce
  • terminal.foreground#c0c5ce
  • terminal.selectionBackground#1c1f2680
  • terminalCursor.foreground#bf5f69
  • textLink.activeForeground#669190
  • textLink.foreground#96b5b4
  • titleBar.activeBackground#2b303b
  • titleBar.activeForeground#c0c5ce
  • titleBar.inactiveBackground#2b303b
  • titleBar.inactiveForeground#c0c5ce
  • welcomePage.buttonBackground#1c1f26
  • welcomePage.buttonHoverBackground#22262f
  • widget.shadow#14171c

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#d4d4d4ff
meta.embedded, source.groovy.embedded#D4D4D4
emphasisitalic
strongbold
header#000080
comment#608b4e
constant.language#569cd6
constant.numeric#b5cea8
constant.regexp#646695
entity.name.tag#569cd6
entity.name.tag.css#d7ba7d
entity.other.attribute-name#9cdcfe
entity.other.attribute-name.class.css, entity.other.attribute-name.class.mixin.css, entity.other.attribute-name.id.css, entity.other.attribute-name.parent-selector.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css, source.css.less entity.other.attribute-name.id, entity.other.attribute-name.attribute.scss, entity.other.attribute-name.scss#d7ba7d
invalid#f44747
markup.underlineunderline
markup.bold#569cd6bold
markup.heading#569cd6bold
markup.italicitalic
markup.inserted#b5cea8
markup.deleted#ce9178
markup.changed#569cd6
beginning.punctuation.definition.quote.markdown#608b4e
beginning.punctuation.definition.list.markdown#6796e6
markup.inline.raw#ce9178
meta.selector#d7ba7d
punctuation.definition.tag#808080
meta.preprocessor#569cd6
meta.preprocessor.string#ce9178
meta.preprocessor.numeric#b5cea8
meta.structure.dictionary.key.python#9cdcfe
meta.diff.header#569cd6
storage#569cd6
storage.type#569cd6
storage.modifier#569cd6
string#ce9178
string.tag#ce9178
string.value#ce9178
string.regexp#d16969
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#569cd6
meta.template.expression#d4d4d4
support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less, source.coffee.embedded#9cdcfe
keyword#569cd6
keyword.control#569cd6
keyword.operator#d4d4d4
keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.instanceof, keyword.operator.logical.python#569cd6
keyword.other.unit#b5cea8
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#569cd6
support.function.git-rebase#9cdcfe
constant.sha.git-rebase#b5cea8
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java#d4d4d4
variable.language#569cd6
entity.name.function, support.function, support.constant.handlebars#DCDCAA
meta.return-type, support.class, support.type, entity.name.type, entity.name.class, storage.type.numeric.go, storage.type.byte.go, storage.type.boolean.go, storage.type.string.go, storage.type.uintptr.go, storage.type.cs, storage.type.generic.cs, storage.type.modifier.cs, storage.type.variable.cs, storage.type.annotation.java, storage.type.generic.java, storage.type.java, storage.type.object.array.java, storage.type.primitive.array.java, storage.type.primitive.java, storage.type.token.java, storage.type.groovy, storage.type.annotation.groovy, storage.type.parameters.groovy, storage.type.generic.groovy, storage.type.object.array.groovy, storage.type.primitive.array.groovy, storage.type.primitive.groovy#4EC9B0
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json, entity.other.inherited-class#4EC9B0
keyword.control#C586C0
variable, meta.definition.variable.name, support.variable#9CDCFE
meta.object-literal.key#9CDCFE
support.constant.property-value, support.constant.font-name, support.constant.media-type, support.constant.media, constant.other.color.rgb-value, constant.other.rgb-value, support.constant.color#CE9178
punctuation.definition.group.regexp, punctuation.definition.group.assertion.regexp, punctuation.definition.character-class.regexp, punctuation.character.set.begin.regexp, punctuation.character.set.end.regexp, keyword.operator.negation.regexp, support.other.parenthesis.regexp#CE9178
constant.character.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.regexp, constant.character.set.regexp#d16969
keyword.operator.or.regexp, keyword.control.anchor.regexp#DCDCAA
keyword.operator.quantifier.regexp#d7ba7d
constant.character#569cd6
constant.character.escape#d7ba7d
token.info-token#6796e6
token.warn-token#cd9731
token.error-token#f44747
token.debug-token#b267e6
punctuation.definition.string.begin,punctuation.definition.string.end#a3be89
variable.parameter.function#c0c5ce
comment, punctuation.definition.comment#8891a2italic
comment markup.link#8891a2
markup.changed.diff#ebcb8b
meta.diff.header.from-file,punctuation.definition.from-file.diff#96b5b4
markup.inserted.diff#a3be89
markup.deleted.diff#bf5f69
punctuation.separator.key-value#c0c5ce
entity.other.attribute-name.js,entity.other.attribute-name.ts,entity.other.attribute-name.jsx,entity.other.attribute-name.tsx,variable.language.super#bf5f69italic
variable.parameter#bf5f69
constant.language.import-export-all.js, constant.language.null.js, constant.language.undefined.js#96b5b4
keyword.operator.expression.import#b48ead
support.constant.math#ebcb8b
support.constant.property.math#d0866e
variable.other.constant#d0866e
keyword.operator.logical.js#96b5b4
keyword.operator.bitwise#96b5b4
support.constant.property-value.scss,support.constant.property-value.css#d0866e
support.constant.color.w3c-standard-color-name.css,support.constant.color.w3c-standard-color-name.scss#d0866e
punctuation.separator.list.comma.css#c0c5ce
support.constant.color.w3c-standard-color-name.css#d0866e
support.type.vendored.property-name.css#96b5b4
punctuation.definition.template-expression.begin,punctuation.definition.template-expression.end#bf5f69
support.module.node,support.type.object.module,support.module.node#e5c07b
variable.other.readwrite,meta.object-literal.key,support.variable.property,support.variable.object.process,support.variable.object.node#bf5f69
comment.line.double-slash,comment.block.documentationitalic
support.constant.json#d0866e
keyword.operator.expression.instanceof,keyword.operator.new,keyword.operator.ternary#b48eaditalic
support.type.object.console#bf5f69
support.variable.property.process#d0866e
entity.name.function#96b5b4
support.function.console#96b5b4italic
keyword.operator#96b5b4
support.type.object.dom#96b5b4
support.variable.dom,support.variable.property.dom#bf5f69
keyword.operator.arithmetic,keyword.operator.comparison#96b5b4
variable.parameter.function.language.python#d0866e
support.variable.magic.python#96b5b4ff
support.type.python#96b5b4
keyword.operator.logical.python#b48ead
meta.function-call.arguments.python#bf5f69
meta.function-call.python#bf5f69
variable.parameter.function.python#d0866e
punctuation.definition.arguments.begin.python,punctuation.definition.arguments.end.python,punctuation.separator.arguments.python,punctuation.definition.list.begin.python,punctuation.definition.list.end.python,meta.function-call.arguments.python#c0c5ce
meta.function-call.generic.python#96b5b4
constant.character.format.placeholder.other.python#a3be89
none#c0c5ce
keyword.operator#c0c5ce
keyword#b48ead
variable#bf5f69
token.package.keyword#b48ead
token.package#c0c5ce
meta.require, support.function.any-method#96b5b4italic
entity.name.type.namespace#ebcb8b
support.class, entity.name.type.class#ebcb8b
entity.name.class.identifier.namespace.type#ebcb8b
entity.name.class#96b5b4
entity.name.type#ebcb8b
keyword.control#b48eaditalic
control.elements, keyword.operator.less#d0866e
keyword.other.special-method#96b5b4
storage#b48eaditalic
storage.type#b48eaditalic
token.storage#b48ead
constant.language.boolean.false.js, constant.language.boolean.true.js#96b5b4
storage.modifier#b48ead
punctuation.section.embedded.begin.js,punctuation.section.embedded.end.js,punctuation.definition.parameters.begin.js,punctuation.definition.parameters.end.js,meta.brace.round.js,punctuation.definition.binding-pattern.object.js,punctuation.definition.block.js,punctuation.section.embedded.begin.js,punctuation.section.embedded.end.js,punctuation.definition.parameters.begin.js,punctuation.definition.parameters.end.js#c0c5ce
keyword.operator.expression.delete,keyword.operator.expression.in,keyword.operator.expression.of,keyword.operator.expression.instanceof,keyword.operator.new,keyword.operator.expression.typeof,keyword.operator.expression.void#b48ead
support.function#96b5b4italic
support.type.property-name#c0c5ce
support.constant.property-value#c0c5ce
support.constant.font-name#d0866e
meta.tag#c0c5ce
string, entity.other.inherited-class#a3be89
constant.other.symbol#96b5b4
constant.numeric#d0866e
none#d0866e
none#d0866e
constant#d0866e
punctuation.definition.constant#d0866e
entity.name.tag#bf5f69
entity.other.attribute-name#d0866e
entity.other.attribute-name.id#96b5b4
entity.other.attribute-name.class.css#d0866e
meta.selector#b48ead
none#d0866e
markup.heading#bf5f69bold
markup.heading punctuation.definition.heading, entity.name.section#96b5b4
keyword.other.unit#d0866e
markup.bold,todo.bold#d0866ebold
punctuation.definition.bold#ebcb8b
markup.italic, punctuation.definition.italic,todo.emphasis#b48ead
emphasis md#b48ead
entity.name.section.markdown#bf5f69
punctuation.definition.heading.markdown#bf5f69
markup.heading.setext#c0c5ce
punctuation.definition.bold.markdown#d0866e
markup.inline.raw.markdown#a3be89
markup.inline.raw.string.markdown#a3be89
beginning.punctuation.definition.list.markdown#bf5f69
beginning.punctuation.definition.quote.markdown#bf5f69
markup.quote.markdown#8891a2italic
punctuation.definition.string.begin.markdown,punctuation.definition.string.end.markdown,punctuation.definition.metadata.markdown#c0c5ce
punctuation.definition.metadata.markdown#b48ead
markup.underline.link.markdown,markup.underline.link.image.markdown#b48ead
string.other.link.title.markdown,string.other.link.description.markdown#96b5b4
markup.italic.markdown#d0866eitalic
markup.bold.markdown#d0866ebold
string.regexp#96b5b4
constant.character.escape#96b5b4
punctuation.section.embedded, variable.interpolation#bf5f69
constant.language.json, constant.language.python#96b5b4
source.json meta.structure.dictionary.json > string.quoted.json#bf5f69
source.json meta.structure.dictionary.json > string.quoted.json > punctuation.string#bf5f69
source.json meta.structure.dictionary.json > value.json > string.quoted.json,source.json meta.structure.array.json > value.json > string.quoted.json,source.json meta.structure.dictionary.json > value.json > string.quoted.json > punctuation,source.json meta.structure.array.json > value.json > string.quoted.json > punctuation#a3be89
source.json meta.structure.dictionary.json > constant.language.json,source.json meta.structure.array.json > constant.language.json#96b5b4
support.type.property-name.json#bf5f69
support.type.property-name.json punctuation#bf5f69
meta.function.decorator.python#96b5b4
support.token.decorator.python,meta.function.decorator.identifier.python#96b5b4
function.parameter#d0866e
function.parameter#c0c5ce
function.brace#c0c5ce
function.parameter.ruby, function.parameter.cs#c0c5ce
rgb-value#96b5b4
inline-color-decoration rgb-value#d0866e
less rgb-value#d0866e
selector.sass#bf5f69
var.this,variable.language.this.js,variable.language.this.ts,variable.language.this.jsx,variable.language.this.tsx#ebcb8bitalic
support.type.primitive.ts,support.type.builtin.ts,support.type.primitive.tsx,support.type.builtin.tsx#ebcb8b
block.scope.end,block.scope.begin#c0c5ce
token.info-token#669190
token.warn-token#b4583a
token.error-token#993d46
token.debug-token#916088
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#b48ead
meta.template.expression#c0c5ce
support.type.prelude.elm#96b5b4ff
support.constant.elm#d0866eff
invalid.illegal#993d46bold
invalid.broken#993d46bold
invalid.deprecated#b4583abold
invalid.unimplemented#669190bold

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Space Ocean Kit Refined - Coding Theme