Skip to main content
Coding Theme

Ocean Mist

Publisher: Malik HaziqThemes in package: 2

Ocean Mist is modern VS Code theme inspired by the calming aqua color, designed for readability and focus.

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#303030
  • activityBar.border#0a3941
  • activityBar.foreground#49aaba
  • activityBar.inactiveForeground#ffffff66
  • activityBarBadge.background#4e929d
  • activityBarBadge.foreground#ffffff
  • badge.background#425558
  • badge.foreground#ffffff
  • breadcrumb.activeSelectionForeground#f0efef
  • breadcrumb.background#434647
  • breadcrumb.focusForeground#f0efef
  • breadcrumb.foreground#d9d7d7cc
  • button.background#478892
  • button.foreground#ffffff
  • button.hoverBackground#49aaba
  • button.secondaryBackground#3a3d41
  • button.secondaryForeground#ffffff
  • button.secondaryHoverBackground#45494e
  • checkbox.background#49aaba26
  • checkbox.border#3c6d75
  • checkbox.foreground#cccccc
  • debugExceptionWidget.background#3f4849
  • debugExceptionWidget.border#3f646b
  • debugToolBar.background#3f4849
  • debugToolBar.border#3f646b
  • diffEditor.border#444444
  • diffEditor.insertedTextBackground#9bb95533
  • diffEditor.removedTextBackground#ff000033
  • dropdown.background#49aaba26
  • dropdown.border#3c6d75
  • dropdown.foreground#cccccc
  • editor.background#242e30
  • editor.findMatchBackground#515c6a
  • editor.findMatchBorder#74879f
  • editor.findMatchHighlightBackground#ea5c0055
  • editor.findMatchHighlightBorder#ffffff00
  • editor.findRangeHighlightBackground#3a3d4166
  • editor.findRangeHighlightBorder#ffffff00
  • editor.foldBackground#49aaba42
  • editor.foreground#d4d4d4
  • editor.hoverHighlightBackground#2b6068
  • editor.inactiveSelectionBackground#3a3d41
  • editor.lineHighlightBackground#3a84903e
  • editor.lineHighlightBorder#324b4f
  • editor.rangeHighlightBackground#ffffff0b
  • editor.rangeHighlightBorder#ffffff00
  • editor.selectionBackground#396066fb
  • editor.selectionHighlightBackground#add6ff26
  • editor.selectionHighlightBorder#495F77
  • editor.wordHighlightBackground#575757b8
  • editor.wordHighlightStrongBackground#006879
  • editor.wordHighlightStrongBorder#008ca3
  • editorBracketMatch.background#4789943c
  • editorBracketMatch.border#5296a1
  • editorCodeLens.foreground#999999
  • editorCursor.background#212121
  • editorCursor.foreground#7da7ad
  • editorError.background#B73A3400
  • editorError.border#ffffff00
  • editorError.foreground#f48771
  • editorGroup.border#444444
  • editorGroup.emptyBackground#242e30
  • editorGroupHeader.border#34474d
  • editorGroupHeader.tabsBackground#33393b
  • editorGroupHeader.tabsBorder#394547
  • editorGutter.addedBackground#587c0c
  • editorGutter.background#242e30
  • editorGutter.commentRangeForeground#c5c5c5
  • editorGutter.deletedBackground#94151b
  • editorGutter.foldingControlForeground#c5c5c5
  • editorGutter.modifiedBackground#0c7d9d
  • editorHoverWidget.background#2d3e41
  • editorHoverWidget.border#2c575e
  • editorHoverWidget.foreground#cccccc
  • editorIndentGuide.activeBackground#707070
  • editorIndentGuide.background#3f3f3f
  • editorInfo.background#4490BF00
  • editorInfo.border#4490BF00
  • editorInfo.foreground#75beff
  • editorLineNumber.activeForeground#739aa1
  • editorLineNumber.foreground#7d7d7d
  • editorLink.activeForeground#49aaba
  • editorMarkerNavigation.background#2d2d30
  • editorMarkerNavigationError.background#f48771
  • editorMarkerNavigationInfo.background#75beff
  • editorMarkerNavigationWarning.background#cca700
  • editorOverviewRuler.background#25252500
  • editorOverviewRuler.border#7f7f7f4d
  • editorRuler.foreground#5a5a5a
  • editorSuggestWidget.background#354447
  • editorSuggestWidget.border#334b4f
  • editorSuggestWidget.foreground#d4d4d4
  • editorSuggestWidget.highlightForeground#15d3f2
  • editorSuggestWidget.selectedBackground#49aaba38
  • editorWarning.background#A9904000
  • editorWarning.border#ffffff00
  • editorWarning.foreground#cca700
  • editorWhitespace.foreground#7ec9d568
  • editorWidget.background#25393d
  • editorWidget.foreground#d9d9d9
  • editorWidget.resizeBorder#49aaba
  • focusBorder#49aaba
  • foreground#c4c4c4
  • gitDecoration.addedResourceForeground#5fa16b
  • gitDecoration.conflictingResourceForeground#6c6cc4
  • gitDecoration.deletedResourceForeground#c74e39
  • gitDecoration.ignoredResourceForeground#8c8c8c
  • gitDecoration.modifiedResourceForeground#e2c08d
  • gitDecoration.stageDeletedResourceForeground#c74e39
  • gitDecoration.stageModifiedResourceForeground#e2c08d
  • gitDecoration.submoduleResourceForeground#8db9e2
  • gitDecoration.untrackedResourceForeground#73c991
  • icon.foreground#c4c4c4
  • input.background#49aaba26
  • input.border#3c6d75
  • input.foreground#cccccc
  • input.placeholderForeground#a6a6a6
  • inputOption.activeBackground#345c62
  • inputOption.activeBorder#49aaba
  • inputOption.activeForeground#ffffff
  • list.activeSelectionBackground#08606f
  • list.activeSelectionForeground#ffffff
  • list.dropBackground#414f51
  • list.focusBackground#3c5054
  • list.focusForeground#e2eef0
  • list.highlightForeground#49aaba
  • list.hoverBackground#344447
  • list.hoverForeground#ffffff
  • list.inactiveSelectionBackground#3c4749
  • list.inactiveSelectionForeground#ffffff
  • listFilterWidget.background#653723
  • listFilterWidget.noMatchesOutline#be1100
  • listFilterWidget.outline#4c5f62
  • menu.background#303d3f
  • menu.border#6b72735e
  • menu.foreground#d5d5d5
  • menu.selectionBackground#49aaba5a
  • menu.selectionBorder#49aaba7e
  • menu.selectionForeground#ffffff
  • menu.separatorBackground#d0eef262
  • menubar.selectionBackground#49aaba4e
  • menubar.selectionBorder#2a7c8aa3
  • menubar.selectionForeground#ffffff
  • merge.commonContentBackground#282828
  • merge.commonHeaderBackground#383838
  • merge.currentContentBackground#27403B
  • merge.currentHeaderBackground#367366
  • merge.incomingContentBackground#28384B
  • merge.incomingHeaderBackground#395F8F
  • minimap.background#242e30
  • minimap.errorHighlight#f48771
  • minimap.findMatchHighlight#515c6a
  • minimap.selectionHighlight#396066fb
  • minimap.warningHighlight#cca700
  • minimapGutter.addedBackground#587c0c
  • minimapGutter.deletedBackground#94151b
  • minimapGutter.modifiedBackground#0c7d9d
  • notificationCenter.border#3d3d3d
  • notificationCenterHeader.background#2f4549
  • notificationCenterHeader.foreground#dedede
  • notifications.background#2d3334
  • notifications.border#4f6a6f
  • notifications.foreground#e0e0e0
  • notificationsErrorIcon.foreground#f48771
  • notificationsInfoIcon.foreground#75beff
  • notificationsWarningIcon.foreground#cca700
  • notificationToast.border#33484b
  • panel.background#2d3334
  • panel.border#54acba4e
  • panelSection.border#45575a
  • panelTitle.activeBorder#d7d0d0
  • panelTitle.activeForeground#e7e7e7
  • panelTitle.inactiveForeground#e7e7e799
  • peekView.border#007acc
  • peekViewEditor.background#0f282c
  • peekViewEditor.matchHighlightBackground#92693399
  • peekViewEditor.matchHighlightBorder#ee931e
  • peekViewEditorGutter.background#0e2226
  • peekViewResult.background#252526
  • peekViewResult.fileForeground#ffffff
  • peekViewResult.lineForeground#bbbbbb
  • peekViewResult.matchHighlightBackground#ea5c004d
  • peekViewResult.selectionBackground#49aaba26
  • peekViewResult.selectionForeground#ffffff
  • peekViewTitle.background#1e1e1e
  • peekViewTitleDescription.foreground#ccccccb3
  • peekViewTitleLabel.foreground#ffffff
  • pickerGroup.border#3c828e
  • pickerGroup.foreground#54e0f7
  • progressBar.background#49aaba
  • scrollbar.shadow#000000
  • scrollbarSlider.activeBackground#bfbfbf66
  • scrollbarSlider.background#344145
  • scrollbarSlider.hoverBackground#646464b3
  • selection.background#376c75
  • settings.focusedRowBackground#ffffff07
  • settings.headerForeground#c4c4c4
  • sideBar.background#2d3334
  • sideBar.border#004651
  • sideBar.dropBackground#414f51
  • sideBar.foreground#eafcff
  • sideBarSectionHeader.background#20494f
  • sideBarSectionHeader.border#006171
  • sideBarSectionHeader.foreground#e9eaea
  • sideBarTitle.foreground#fdfdfd
  • statusBar.background#367782
  • statusBar.border#49aaba
  • statusBar.debuggingBackground#a94f23
  • statusBar.debuggingBorder#bc9393
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#ffffff
  • statusBar.noFolderBackground#052126
  • statusBar.noFolderBorder#4b4f62
  • statusBar.noFolderForeground#ffffff
  • statusBarItem.activeBackground#FFFFFF25
  • statusBarItem.hoverBackground#49aaba
  • statusBarItem.remoteBackground#16825d
  • statusBarItem.remoteForeground#ffffff
  • tab.activeBackground#3b5054
  • tab.activeBorder#00000000
  • tab.activeBorderTop#00000000
  • tab.activeForeground#ffffff
  • tab.border#253b3f
  • tab.hoverBackground#39484d
  • tab.inactiveBackground#33393b
  • tab.inactiveForeground#ffffff80
  • terminal.ansiBlack#000000
  • terminal.ansiBlue#2472c8
  • terminal.ansiBrightBlack#666666
  • terminal.ansiBrightBlue#3b8eea
  • terminal.ansiBrightCyan#29b8db
  • terminal.ansiBrightGreen#23d18b
  • terminal.ansiBrightMagenta#d670d6
  • terminal.ansiBrightRed#f14c4c
  • terminal.ansiBrightWhite#d9d9d9
  • terminal.ansiBrightYellow#f5f543
  • terminal.ansiCyan#11a8cd
  • terminal.ansiGreen#0dbc79
  • terminal.ansiMagenta#bc3fbc
  • terminal.ansiRed#cd3131
  • terminal.ansiWhite#e5e5e5
  • terminal.ansiYellow#e5e510
  • terminal.border#45575a
  • terminal.foreground#d5d5d5
  • terminal.selectionBackground#ffffff40
  • terminalCursor.background#49aaba
  • terminalCursor.foreground#ffffff
  • textLink.foreground#36e3ff
  • titleBar.activeBackground#23373b
  • titleBar.activeForeground#d3d3d3
  • titleBar.border#00000000
  • titleBar.inactiveBackground#3c3c3c99
  • titleBar.inactiveForeground#cccccc99
  • tree.indentGuidesStroke#506366
  • walkThrough.embeddedEditorBackground#00000050
  • widget.shadow#2c2c2c5c

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
punctuation.definition.delayed.unison,punctuation.definition.list.begin.unison,punctuation.definition.list.end.unison,punctuation.definition.ability.begin.unison,punctuation.definition.ability.end.unison,punctuation.operator.assignment.as.unison,punctuation.separator.pipe.unison,punctuation.separator.delimiter.unison,punctuation.definition.hash.unison#f5717b
variable.other.generic-type.haskell#77ecff
storage.type.haskell#ffc084
support.variable.magic.python#f5717b
punctuation.separator.period.python,punctuation.separator.element.python,punctuation.parenthesis.begin.python,punctuation.parenthesis.end.python#d4d4d4
variable.parameter.function.language.special.self.python#ffd471
storage.modifier.lifetime.rust#d4d4d4
support.function.std.rust#ee9cff
entity.name.lifetime.rust#ffd471
variable.language.rust#f5717b
support.constant.edge#77ecff
constant.other.character-class.regexp#f5717b
keyword.operator.quantifier.regexp#ffc084
punctuation.definition.string.begin,punctuation.definition.string.end#77ad50
variable.parameter.function#d4d4d4
comment markup.link#5a7377
markup.changed.diff#ffd471
meta.diff.header.from-file,meta.diff.header.to-file,punctuation.definition.from-file.diff,punctuation.definition.to-file.diff#ee9cff
markup.inserted.diff#77ad50
markup.deleted.diff#f5717b
meta.function.c,meta.function.cpp#f5717b
punctuation.section.block.begin.bracket.curly.cpp,punctuation.section.block.end.bracket.curly.cpp,punctuation.terminator.statement.c,punctuation.section.block.begin.bracket.curly.c,punctuation.section.block.end.bracket.curly.c,punctuation.section.parens.begin.bracket.round.c,punctuation.section.parens.end.bracket.round.c,punctuation.section.parameters.begin.bracket.round.c,punctuation.section.parameters.end.bracket.round.c#d4d4d4
punctuation.separator.key-value#d4d4d4
keyword.operator.expression.import#ee9cff
support.constant.math#ffd471
support.constant.property.math#ffc084
variable.other.constant#ffd471
storage.type.annotation.java, storage.type.object.array.java#ffd471
source.java#f5717b
punctuation.section.block.begin.java,punctuation.section.block.end.java,punctuation.definition.method-parameters.begin.java,punctuation.definition.method-parameters.end.java,meta.method.identifier.java,punctuation.section.method.begin.java,punctuation.section.method.end.java,punctuation.terminator.java,punctuation.section.class.begin.java,punctuation.section.class.end.java,punctuation.section.inner-class.begin.java,punctuation.section.inner-class.end.java,meta.method-call.java,punctuation.section.class.begin.bracket.curly.java,punctuation.section.class.end.bracket.curly.java,punctuation.section.method.begin.bracket.curly.java,punctuation.section.method.end.bracket.curly.java,punctuation.separator.period.java,punctuation.bracket.angle.java,punctuation.definition.annotation.java,meta.method.body.java#d4d4d4
meta.method.java#ee9cff
storage.modifier.import.java,storage.type.java,storage.type.generic.java#ffd471
keyword.operator.instanceof.java#77ecff
meta.definition.variable.name.java#f5717b
keyword.operator.logical#56b6c2
keyword.operator.bitwise#56b6c2
keyword.operator.channel#56b6c2
support.constant.property-value.scss,support.constant.property-value.css#ffc084
keyword.operator.css,keyword.operator.scss,keyword.operator.less#56b6c2
support.constant.color.w3c-standard-color-name.css,support.constant.color.w3c-standard-color-name.scss#ffc084
punctuation.separator.list.comma.css#d4d4d4
support.constant.color.w3c-standard-color-name.css#ffc084
support.type.vendored.property-name.css#56b6c2
support.module.node,support.type.object.module,support.module.node#ffd471
entity.name.type.module#ffd471
variable.other.readwrite,meta.object-literal.key,support.variable.property,support.variable.object.process,support.variable.object.node#f5717b
support.constant.json#ffc084
keyword.operator.expression.instanceof, keyword.operator.new, keyword.operator.ternary, keyword.operator.optional, keyword.operator.expression.keyof#77ecff
support.type.object.console#f5717b
support.variable.property.process#ffc084
entity.name.function,support.function.console#ee9cff
keyword.operator.misc.rust#d4d4d4
keyword.operator.sigil.rust#77ecff
keyword.operator.delete#77ecff
support.type.object.dom#56b6c2
support.variable.dom,support.variable.property.dom#f5717b
keyword.operator.arithmetic,keyword.operator.comparison,keyword.operator.decrement,keyword.operator.increment,keyword.operator.relational#56b6c2
keyword.operator.assignment.c,keyword.operator.comparison.c,keyword.operator.c,keyword.operator.increment.c,keyword.operator.decrement.c,keyword.operator.bitwise.shift.c,keyword.operator.assignment.cpp,keyword.operator.comparison.cpp,keyword.operator.cpp,keyword.operator.increment.cpp,keyword.operator.decrement.cpp,keyword.operator.bitwise.shift.cpp#77ecff
punctuation.separator.delimiter#d4d4d4
punctuation.separator.c,punctuation.separator.cpp#77ecff
support.type.posix-reserved.c,support.type.posix-reserved.cpp#56b6c2
keyword.operator.sizeof.c,keyword.operator.sizeof.cpp#77ecff
variable.parameter.function.language.python#ffc084
support.type.python#56b6c2
keyword.operator.logical.python#77ecff
variable.parameter.function.python#ffc084
punctuation.definition.arguments.begin.python,punctuation.definition.arguments.end.python,punctuation.separator.arguments.python,punctuation.definition.list.begin.python,punctuation.definition.list.end.python#d4d4d4
meta.function-call.generic.python#ee9cff
constant.character.format.placeholder.other.python#ffc084
keyword.operator#d4d4d4
keyword.operator.assignment.compound#77ecff
keyword.operator.assignment.compound.js,keyword.operator.assignment.compound.ts#56b6c2
keyword#77ecff
entity.name.namespace#ffd471
variable#f5717b
variable.c#d4d4d4
variable.language#ffd471
token.variable.parameter.java#d4d4d4
import.storage.java#ffd471
token.package.keyword#77ecff
token.package#d4d4d4
entity.name.function, meta.require, support.function.any-method, variable.function#ee9cff
entity.name.type.namespace#389cd7
support.class, entity.name.type.class#389cd7
entity.name.class.identifier.namespace.type#ffd471
entity.name.class, variable.other.class.js, variable.other.class.ts#ffd471
variable.other.class.php#f5717b
entity.name.type#ffd471
keyword.control#77ecff
control.elements, keyword.operator.less#ffc084
keyword.other.special-method#ee9cff
storage#77ecff
token.storage#77ecff
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#77ecff
token.storage.type.java#ffd471
support.function#56b6c2
support.type.property-name#d4d4d4
support.constant.property-value#d4d4d4
support.constant.font-name#ffc084
meta.tag#d4d4d4
string#c0eca1
entity.other.inherited-class#ffd471
constant.other.symbol#56b6c2
constant.numeric#ffc084
constant#ffc084
punctuation.definition.constant#ffc084
entity.name.tag#f5717b
entity.other.attribute-name#ffc084
entity.other.attribute-name.id#ee9cffnormal
entity.other.attribute-name.class.css#ffc084normal
meta.selector#77ecff
markup.heading#f5717b
markup.heading punctuation.definition.heading, entity.name.section#ee9cff
keyword.other.unit#f5717b
markup.bold,todo.bold#ffc084
punctuation.definition.bold#ffd471
markup.italic, punctuation.definition.italic,todo.emphasis#77ecff
emphasis md#77ecff
entity.name.section.markdown#f5717b
punctuation.definition.heading.markdown#f5717b
punctuation.definition.list.begin.markdown#f5717b
markup.heading.setext#d4d4d4
punctuation.definition.bold.markdown#ffc084
markup.inline.raw.markdown#77ad50
markup.inline.raw.string.markdown#77ad50
punctuation.definition.list.markdown#f5717b
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown, punctuation.definition.metadata.markdown#f5717b
beginning.punctuation.definition.list.markdown#f5717b
punctuation.definition.metadata.markdown#f5717b
markup.underline.link.markdown,markup.underline.link.image.markdown#77ecff
string.other.link.title.markdown,string.other.link.description.markdown#ee9cff
string.regexp#56b6c2
constant.character.escape#56b6c2
punctuation.section.embedded, variable.interpolation#f5717b
punctuation.section.embedded.begin,punctuation.section.embedded.end#77ecff
invalid.illegal#ffffff
invalid.illegal.bad-ampersand.html#d4d4d4
invalid.broken#ffffff
invalid.deprecated#ffffff
invalid.unimplemented#ffffff
source.json meta.structure.dictionary.json > string.quoted.json#f5717b
source.json meta.structure.dictionary.json > string.quoted.json > punctuation.string#f5717b
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#77ad50
source.json meta.structure.dictionary.json > constant.language.json,source.json meta.structure.array.json > constant.language.json#56b6c2
support.type.property-name.json#f5717b
support.type.property-name.json punctuation#f5717b
text.html.laravel-blade source.php.embedded.line.html entity.name.tag.laravel-blade#77ecff
text.html.laravel-blade source.php.embedded.line.html support.constant.laravel-blade#77ecff
support.other.namespace.use.php,support.other.namespace.use-as.php,support.other.namespace.php,entity.other.alias.php,meta.interface.php#25a3ee
keyword.operator.error-control.php#77ecff
keyword.operator.type.php#77ecff
punctuation.section.array.begin.php#d4d4d4
punctuation.section.array.end.php#d4d4d4
invalid.illegal.non-null-typehinted.php#f44747
storage.type.php,meta.other.type.phpdoc.php,keyword.other.type.php,keyword.other.array.phpdoc.php#ffd471
meta.function-call.php,meta.function-call.object.php,meta.function-call.static.php#ee9cff
punctuation.definition.parameters.begin.bracket.round.php,punctuation.definition.parameters.end.bracket.round.php,punctuation.separator.delimiter.php,punctuation.section.scope.begin.php,punctuation.section.scope.end.php,punctuation.terminator.expression.php,punctuation.definition.arguments.begin.bracket.round.php,punctuation.definition.arguments.end.bracket.round.php,punctuation.definition.storage-type.begin.bracket.round.php,punctuation.definition.storage-type.end.bracket.round.php,punctuation.definition.array.begin.bracket.round.php,punctuation.definition.array.end.bracket.round.php,punctuation.definition.begin.bracket.round.php,punctuation.definition.end.bracket.round.php,punctuation.definition.begin.bracket.curly.php,punctuation.definition.end.bracket.curly.php,punctuation.definition.section.switch-block.end.bracket.curly.php,punctuation.definition.section.switch-block.start.bracket.curly.php,punctuation.definition.section.switch-block.begin.bracket.curly.php,punctuation.definition.section.switch-block.end.bracket.curly.php#d4d4d4
support.constant.core.rust#ffc084
support.constant.ext.php,support.constant.std.php,support.constant.core.php,support.constant.parser-token.php#ffc084
entity.name.goto-label.php,support.other.php#ee9cff
keyword.operator.logical.php,keyword.operator.bitwise.php,keyword.operator.arithmetic.php#56b6c2
keyword.operator.regexp.php#77ecff
keyword.operator.comparison.php#56b6c2
keyword.operator.heredoc.php,keyword.operator.nowdoc.php#77ecff
meta.function.decorator.python#ee9cff
support.token.decorator.python,meta.function.decorator.identifier.python#56b6c2
function.parameter#d4d4d4
function.brace#d4d4d4
function.parameter.ruby, function.parameter.cs#d4d4d4
constant.language.symbol.ruby#56b6c2
rgb-value#56b6c2
inline-color-decoration rgb-value#ffc084
less rgb-value#ffc084
selector.sass#f5717b
support.type.primitive.ts,support.type.builtin.ts,support.type.primitive.tsx,support.type.builtin.tsx#ffd471
block.scope.end,block.scope.begin#d4d4d4
storage.type.cs#ffd471
entity.name.variable.local.cs#f5717b
token.info-token#ee9cff
token.warn-token#ffc084
token.error-token#f44747
token.debug-token#77ecff
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#77ecff
meta.template.expression#d4d4d4
keyword.operator.module#77ecff
support.type.type.flowtype#ee9cff
support.type.primitive#ffd471
meta.property.object#f5717b
variable.parameter.function.js#f5717b
keyword.other.template.begin#77ad50
keyword.other.template.end#77ad50
keyword.other.substitution.begin#77ad50
keyword.other.substitution.end#77ad50
keyword.operator.assignment#56b6c2
keyword.operator.assignment.go#ffd471
keyword.operator.arithmetic.go, keyword.operator.address.go#77ecff
entity.name.package.go#ffd471
support.type.prelude.elm#56b6c2
support.constant.elm#ffc084
punctuation.quasi.element#77ecff
constant.character.entity#f5717b
entity.other.attribute-name.pseudo-element, entity.other.attribute-name.pseudo-class#56b6c2
entity.global.clojure#ffd471
meta.symbol.clojure#f5717b
constant.keyword.clojure#56b6c2
meta.arguments.coffee, variable.parameter.function.coffee#f5717b
source.ini#77ad50
meta.scope.prerequisites.makefile#f5717b
source.makefile#ffd471
storage.modifier.import.groovy#ffd471
meta.method.groovy#ee9cff
meta.definition.variable.name.groovy#f5717b
meta.definition.class.inherited.classes.groovy#77ad50
support.variable.semantic.hlsl#ffd471
support.type.texture.hlsl, support.type.sampler.hlsl, support.type.object.hlsl, support.type.object.rw.hlsl, support.type.fx.hlsl, support.type.object.hlsl#77ecff
text.variable, text.bracketed#f5717b
support.type.swift, support.type.vb.asp#ffd471
entity.name.function.xi#ffd471
entity.name.class.xi#56b6c2
constant.character.character-class.regexp.xi#f5717b
constant.regexp.xi#77ecff
keyword.control.xi#56b6c2
invalid.xi#d4d4d4
beginning.punctuation.definition.quote.markdown.xi#77ad50
beginning.punctuation.definition.list.markdown.xi#5a7377
constant.character.xi#ee9cff
accent.xi#ee9cff
wikiword.xi#ffc084
constant.other.color.rgb-value.xi#ffffff
punctuation.definition.tag.xi#5a7377
entity.name.label.cs, entity.name.scope-resolution.function.call, entity.name.scope-resolution.function.definition#ffd471
entity.name.label.cs, markup.heading.setext.1.markdown, markup.heading.setext.2.markdown#f5717b
meta.brace.square#d4d4d4
comment, punctuation.definition.comment#5a7377italic
markup.quote.markdown#5a7377
punctuation.definition.block.sequence.item.yaml#d4d4d4
constant.language.symbol.elixir#56b6c2
entity.other.attribute-name.js,entity.other.attribute-name.ts,entity.other.attribute-name.jsx,entity.other.attribute-name.tsx,variable.parameter,variable.language.superitalic
comment.line.double-slash,comment.block.documentationitalic
keyword.control.import.python,keyword.control.flow.pythonitalic
markup.italic.markdownitalic

Shiki preview

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

Loading...