Omakase
Publisher: byluisferThemes in package: 1
A curated VS Code theme collection. Trust the chef.
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#151515
- activityBar.foreground#A8BFD0
- activityBar.inactiveForeground#3A4E60
- activityBarBadge.background#6DAAFF
- activityBarBadge.foreground#181818
- badge.background#253040
- badge.foreground#A8BFCF
- breadcrumb.activeSelectionForeground#A8BFCF
- breadcrumb.focusForeground#A8BFCF
- breadcrumb.foreground#4E6070
- button.background#2A4068
- button.foreground#C8DCED
- button.hoverBackground#345080
- checkbox.background#1B1B1B
- checkbox.border#2E3840
- diffEditor.insertedTextBackground#1E382E88
- diffEditor.removedTextBackground#38202088
- dropdown.background#1B1B1B
- dropdown.border#252A30
- dropdown.foreground#A8BFCF
- editor.background#181818
- editor.findMatchHighlightBackground#3A4F6A55
- editor.foreground#B8CCDA
- editor.lineHighlightBackground#1b1b1b
- editor.selectionBackground#2B3A50
- editor.selectionHighlightBackground#2E3F5566
- editor.wordHighlightBackground#2A3F5544
- editor.wordHighlightStrongBackground#35506644
- editorBracketHighlight.foreground1#7FE7D0
- editorBracketHighlight.foreground2#4EC9E4
- editorBracketHighlight.foreground3#9D8FD8
- editorBracketHighlight.foreground4#7FE7D0
- editorBracketHighlight.foreground5#50B0C4
- editorBracketHighlight.foreground6#6DAAFF
- editorBracketMatch.border#6DAAFF66
- editorCursor.foreground#6DAAFF
- editorError.foreground#E06C75
- editorGroup.border#1E2228
- editorGroupHeader.tabsBackground#141414
- editorGutter.addedBackground#4E9E8A
- editorGutter.deletedBackground#A05060
- editorGutter.modifiedBackground#6DAAFF
- editorHint.foreground#7FE7D0
- editorHoverWidget.background#1B1B1B
- editorHoverWidget.border#252A30
- editorIndentGuide.activeBackground1#2E4058
- editorIndentGuide.background1#232830
- editorInfo.foreground#6DAAFF
- editorLineNumber.foreground#3A4550
- editorOverviewRuler.errorForeground#E06C75B3
- editorOverviewRuler.infoForeground#6DAAFFB3
- editorOverviewRuler.warningForeground#E0924AB3
- editorSuggestWidget.background#1B1B1B
- editorSuggestWidget.border#252A30
- editorSuggestWidget.foreground#A8BFCF
- editorSuggestWidget.highlightForeground#6DAAFF
- editorSuggestWidget.selectedBackground#22272E
- editorWarning.foreground#E0924A
- editorWidget.background#1B1B1B
- editorWidget.border#252A30
- focusBorder#151515
- gitDecoration.addedResourceForeground#4E9E8A
- gitDecoration.deletedResourceForeground#A05060
- gitDecoration.modifiedResourceForeground#6DAAFF
- gitDecoration.untrackedResourceForeground#4EC9E4
- input.background#1B1B1B
- input.border#252A30
- input.foreground#A8BFCF
- input.placeholderForeground#3A4E60
- inputOption.activeBorder#6DAAFF
- list.activeSelectionBackground#22272E
- list.activeSelectionForeground#B8CCDA
- list.highlightForeground#6DAAFF
- list.hoverBackground#1D2228
- list.hoverForeground#A8BFCF
- list.inactiveSelectionBackground#1E2228
- menu.background#1A1A1A
- menu.foreground#A8BFCF
- menu.selectionBackground#22272E
- menu.selectionForeground#B8CCDA
- minimap.background#181818
- minimap.findMatchHighlight#3A5C8066
- minimap.selectionHighlight#2B3A50CC
- panel.background#141414
- panel.border#1E2228
- panelTitle.activeForeground#A8BFCF
- panelTitle.inactiveForeground#4E6070
- peekView.border#252A30
- peekViewEditor.background#181818
- peekViewResult.background#151515
- peekViewTitle.background#1B1B1B
- scrollbarSlider.activeBackground#3E4E60AA
- scrollbarSlider.background#2A333C77
- scrollbarSlider.hoverBackground#354050AA
- selection.background#2B3A50
- sideBar.background#151515
- sideBarSectionHeader.background#1A1A1A
- sideBarSectionHeader.foreground#7A9AAE
- sideBarTitle.foreground#8AABB8
- statusBar.background#151515
- statusBar.border#1E2228
- statusBar.debuggingBackground#6DAAFF
- statusBar.debuggingForeground#181818
- statusBar.foreground#7A9AAE
- statusBar.noFolderBackground#151515
- statusBarItem.hoverBackground#22272E
- tab.activeBackground#1C1C1C
- tab.activeBorder#4EC9E4
- tab.activeModifiedBorder#6DAAFF
- tab.border#141414
- tab.inactiveBackground#141414
- tab.inactiveForeground#4E6070
- tab.inactiveModifiedBorder#5A6F88
- terminal.ansiBlack#181818
- terminal.ansiBlue#6DAAFF
- terminal.ansiBrightBlack#4E6070
- terminal.ansiBrightBlue#9ABCFF
- terminal.ansiBrightCyan#7FD4E8
- terminal.ansiBrightGreen#A7F2E1
- terminal.ansiBrightMagenta#A89ED4
- terminal.ansiBrightRed#C07080
- terminal.ansiBrightWhite#C2D4E0
- terminal.ansiBrightYellow#ECA86A
- terminal.ansiCyan#4EC9E4
- terminal.ansiGreen#7FE7D0
- terminal.ansiMagenta#A28CF4
- terminal.ansiRed#A05060
- terminal.ansiWhite#A8BFCF
- terminal.ansiYellow#E0924A
- terminal.background#181818
- terminal.foreground#A8BFCF
- terminalCursor.foreground#6DAAFF
- textBlockQuote.background#181818
- textBlockQuote.border#2b2b2b
- textCodeBlock.background#161616
- textLink.foreground#6DAAFF
- titleBar.activeBackground#141414
- titleBar.activeForeground#8AABB8
- titleBar.inactiveBackground#141414
- titleBar.inactiveForeground#3A4E60
- window.activeBorder#000000
- window.inactiveBorder#000000
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #4E6070 | italic |
| variable, variable.other, variable.other.readwrite, variable.other.readwrite.ts, variable.other.readwrite.tsx, meta.block variable.other, support.other.variable, string constant.other.placeholder | #85AADF | — |
| variable.other.object, variable.other.object.ts, variable.other.object.tsx | #85AADF | — |
| variable.other.property, variable.other.property.ts, variable.other.property.tsx, variable.other.object.property, variable.other.object.property.ts, variable.other.object.property.tsx, support.variable.property, meta.property-access variable, meta.property-access entity.name, entity.name.property | #50B0C4 | — |
| variable.language | #85AADF | italic |
| variable.parameter, variable.parameter.function, meta.function.parameters variable.other, meta.parameters variable.parameter | #85AADF | — |
| storage.type, storage.modifier, storage.type.ts, keyword.type, keyword.type.ts, keyword.type.tsx | #A28CF4 | — |
| keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as, keyword.control.default | #A28CF4 | — |
| keyword.control, keyword.control.flow, keyword.control.conditional, keyword.control.loop, keyword.control.trycatch, keyword.control.switch | #50B0C4 | — |
| keyword | #A28CF4 | — |
| keyword.operator, keyword.operator.arithmetic, keyword.operator.assignment, keyword.operator.comparison, keyword.operator.logical, keyword.operator.bitwise, keyword.operator.spread, keyword.operator.rest | #607A90 | — |
| keyword.operator.type, keyword.operator.type.annotation, keyword.operator.optional, keyword.operator.nullable | #5A7A90 | — |
| punctuation.section.embedded | #607A90 | — |
| punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end | #7FE7D0 | — |
| entity.name.function, variable.function, support.function, keyword.other.special-method | #6DAAFF | — |
| entity.name.method.js, meta.class-method.js entity.name.function.js, variable.function.constructor, entity.name.function.member | #6DAAFF | — |
| tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js, meta.decorator, meta.decorator punctuation.decorator, entity.name.function.decorator, punctuation.decorator | #4EC9E4 | italic |
| entity.name.class, entity.name.type, entity.name.type.class, entity.name.type.interface, entity.name.type.enum, entity.name.type.alias, entity.name.type.ts, entity.name.type.tsx, entity.other.inherited-class | #4EC9E4 | — |
| support.class, support.type, support.type.primitive.ts, support.type.builtin.ts, support.type.builtin, support.type.object.module, support.type.sys-types | #4EC9E4 | — |
| meta.type.annotation, meta.type.parameters, meta.type.declaration, support.other.namespace.use.php, meta.use.php, support.other.namespace.php | #4EC9E4 | — |
| entity.name, markup.changed.git_gutter | #4EC9E4 | — |
| entity.name.module.js, variable.import.parameter.js, variable.other.class.js | #4EC9E4 | — |
| string, constant.other.symbol, constant.other.key, string.other.link, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js | #7FE7D0 | — |
| string.regexp | #7FE7D0 | — |
| constant.character.escape | #7FE7D0 | — |
| constant.numeric | #9D8FD8 | — |
| constant.language.boolean, constant.language, constant.language.null, constant.language.undefined, constant.language.nan, constant.language.infinity | #9D8FD8 | — |
| support.constant | #9D8FD8 | — |
| constant.character, constant.escape | #9D8FD8 | — |
| keyword.other.unit | #7FE7D0 | — |
| source.css constant.numeric, source.scss constant.numeric, source.sass constant.numeric, source.less constant.numeric, meta.property-value.css constant.numeric, meta.property-value.scss constant.numeric | #7FE7D0 | — |
| constant.other.color | #85AADF | — |
| keyword.other | #A28CF4 | — |
| entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter | #6DAEFF | — |
| text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name, entity.other.attribute-name.jsx, entity.other.attribute-name.tsx, meta.jsx.prop.name, meta.tsx.prop.name | #6AAAE0 | — |
| support.class.component, support.class.component.js, support.class.component.tsx | #4EC9E4 | — |
| source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name, support.type.vendored.property-name.css, meta.property-name.css | #C0CFDC | — |
| meta.property-value.css, meta.property-value.scss | #85AADF | — |
| variable.parameter.keyframe-list.css, variable.parameter.url.scss | #7FE7D0 | — |
| entity.other.attribute-name.class, entity.other.attribute-name.id, variable.parameter.misc.css | #6DAEFF | — |
| source.css.scss entity.name.tag, entity.name.tag.reference.scss, entity.name.tag.nesting.css | #4EC9E4 | — |
| keyword.control.at-rule, entity.other.attribute-name.pseudo-class, entity.other.attribute-name.pseudo-element, source.sass keyword.control | #A28CF4 | — |
| entity.other.attribute-name, meta.property-list.scss, meta.attribute-selector.scss, entity.other.keyframe-offset.css, meta.selector.css, punctuation.separator.key-value.css | #7A9AAE | — |
| variable.scss, variable.sass | #85AADF | — |
| source.json meta.structure.dictionary.json support.type.property-name.json | #6DAAFF | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #4EC9E4 | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #50B0C4 | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #7FE7D0 | — |
| text.html.markdown, punctuation.definition.list_item.markdown | #849DB0 | — |
| markup.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown, markup.inserted.git_gutter | #6DAAFF | — |
| markup.italic | #849DB0 | italic |
| markup.bold, markup.bold string | #A8BFCF | bold |
| markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string | #A8BFCF | bold italic |
| markup.underline | #6DAEFF | underline |
| markup.quote punctuation.definition.blockquote.markdown | #4E6070 | — |
| markup.quote | — | — |
| text.html.markdown markup.inline.raw.markdown | #4EC9E4 | — |
| text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown | #4E6070 | — |
| string.other.link.title.markdown | #6DAAFF | — |
| string.other.link.description.title.markdown | #50B0C4 | — |
| constant.other.reference.link.markdown | #7FE7D0 | — |
| markup.raw.block | #50B0C4 | — |
| markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.definition.fenced.markdown, punctuation.section.class.end | #4E6070 | — |
| variable.language.fenced.markdown | #50B0C4 | — |
| meta.separator | #4E6070 | bold |
| markup.table | #849DB0 | — |
| markup.inserted | #7FE7D0 | — |
| markup.deleted | #A05870 | — |
| markup.changed | #9D8FD8 | — |
| *url*, *link*, *uri* | — | underline |
| source.js constant.other.object.key.js string.unquoted.label.js | #50B0C4 | italic |
| invalid, invalid.illegal | #E06C75 | — |
| punctuation.definition.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.definition.tag.begin.jsx, punctuation.definition.tag.end.jsx, punctuation.definition.tag.begin.tsx, punctuation.definition.tag.end.tsx | #7B8FA0 | — |
| punctuation.curlybrace.open, punctuation.curlybrace.close, punctuation.parenthesis.open, punctuation.parenthesis.close, punctuation.squarebracket.open, punctuation.squarebracket.close, meta.brace.round, meta.brace.square, meta.brace.curly, punctuation.definition.block.begin, punctuation.definition.block.end, punctuation.section.block.begin, punctuation.section.block.end, punctuation.definition.parameters.begin, punctuation.definition.parameters.end, punctuation.definition.array.begin, punctuation.definition.array.end, punctuation.section.array.begin, punctuation.section.array.end, punctuation.section.function.begin.bracket.round, punctuation.section.function.end.bracket.round, punctuation.section.property-list.begin.bracket.curly.css, punctuation.section.property-list.end.bracket.curly.css, punctuation.section.property-list.begin.bracket.curly.scss, punctuation.section.property-list.end.bracket.curly.scss | #7B8FA0 | — |