Oscuro Theme & Color Scheme
Publisher: Brandon SaraThemes in package: 1
A dark UI theme & syntax color scheme with a focus on distinction between as many code elements as reasonably possible.
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.activeBackground#003c80
- activityBar.activeBorder#0077ff
- activityBar.activeFocusBorder#003c80
- activityBar.background#0b0c0d
- activityBar.border#141516
- activityBar.dropBorder#0077ff
- activityBar.foreground#b0bec5
- activityBar.inactiveForeground#b0bec5
- activityBarBadge.background#0077ff
- activityBarBadge.foreground#efefef
- badge.background#0077ff
- button.background#0077ff
- button.hoverBackground#003c80
- button.secondaryBackground#2a2a2a
- button.secondaryHoverBackground#003c80
- checkbox.background#2a2a2a
- checkbox.border#2a2a2a
- checkbox.selectBackground#0077ff
- checkbox.selectBorder#0077ff
- descriptionForeground#b0bec5
- disabledForeground#444444
- dropdown.background#2a2a2a
- dropdown.border#2a2a2a
- dropdown.listBackground#2a2a2a
- editor.background#000000
- editor.findMatchBackground#0077ff88
- editor.findMatchBorder#00ccff
- editor.findMatchHighlightBackground#00000000
- editor.findMatchHighlightBorder#00ccff
- editor.findRangeHighlightBackground#30374088
- editor.foreground#efefef
- editor.inactiveSelectionBackground#303740
- editor.lineHighlightBackground#111111
- editor.selectionBackground#0077ff88
- editor.selectionHighlightBackground#00000000
- editor.selectionHighlightBorder#0077ff
- editor.wordHighlightBackground#00000000
- editor.wordHighlightBorder#0077ff
- editor.wordHighlightStrongBackground#00000000
- editor.wordHighlightStrongBorder#0077ff
- editor.wordHighlightTextBackground#00000000
- editor.wordHighlightTextBorder#0077ff
- editorGroup.border#141516
- editorGroup.dropBackground#30374055
- editorGroup.dropIntoPromptBackground#00000000
- editorGroup.dropIntoPromptBorder#00000000
- editorGroup.emptyBackground#181818
- editorGroupHeader.border#141516
- editorGroupHeader.tabsBackground#141516
- editorGroupHeader.tabsBorder#141516
- editorGutter.addedBackground#00cc55
- editorGutter.background#111111
- editorGutter.deletedBackground#cccccc
- editorGutter.foldingControlForeground#efefef
- editorGutter.modifiedBackground#0077ff
- editorLineNumber.activeForeground#0077ff
- editorLineNumber.dimmedForeground#515151
- editorLineNumber.foreground#888888
- editorPane.background#181818
- errorForeground#cc2222
- focusBorder#0077ff
- foreground#b0bec5
- input.background#2a2a2a
- input.border#2a2a2a
- input.placeholderForeground#666666
- inputOption.activeBackground#444444
- inputOption.activeBorder#666666
- inputOption.activeForeground#b0bec5
- inputOption.hoverBackground#003c80
- inputValidation.errorBackground#4D2626
- inputValidation.errorBorder#cc2222
- inputValidation.errorForeground#efefef
- inputValidation.infoBackground#232426
- inputValidation.infoBorder#232426
- inputValidation.infoForeground#efefef
- inputValidation.warningBackground#483a05
- inputValidation.warningBorder#f2c40e
- inputValidation.warningForeground#efefef
- minimap.background#00000000
- minimap.errorHighlight#ff0000
- minimap.findMatchHighlight#00ccff
- minimap.selectionHighlight#0077ff
- minimap.selectionOccurrenceHighlight#0077ff
- minimap.warningHighlight#ff6622
- minimapGutter.addedBackground#00cc55
- minimapGutter.deletedBackground#cccccc
- minimapGutter.modifiedBackground#0077ff
- profileBadge.background#0077ff
- profileBadge.foreground#efefef
- progressBar.background#0077ff
- sash.hoverBorder#00244d
- scrollbar.shadow#00000000
- scrollbarSlider.activeBackground#003c8088
- scrollbarSlider.background#00244d88
- scrollbarSlider.hoverBackground#003c8088
- selection.background#0077ff
- sideBar.background#0b0c0d
- sideBar.border#141516
- sideBar.dropBackground#30374055
- sideBarSectionHeader.background#141516
- sideBarSectionHeader.border#141516
- sideBySideEditor.horizontalBorder#141516
- sideBySideEditor.verticalBorder#141516
- statusBar.background#0b0c0d
- statusBar.border#141516
- tab.activeBackground#141516
- tab.activeBorder#0077ff
- tab.border#181818
- tab.hoverBackground#00244d
- tab.hoverBorder#00244d
- tab.inactiveBackground#181818
- tab.lastPinnedBorder#303740
- titleBar.activeBackground#000000
- titleBar.inactiveBackground#181818
- widget.border#0b0c0d
- widget.shadow#00000000
- window.activeBorder#000000
- window.inactiveBorder#181818
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| #efefef | ||
| string.unquoted.alias.graphql | #00ff99 | |
| entity.name.function.decorator, entity.name.function.decorator punctuation, meta.decorator entity.name.function, punctuation.decorator, storage.type.annotation, entity.name.function.directive.graphql, meta.attribute.rust, meta.attribute.rust punctuation | #00ff99 | bold |
| entity.name.type, entity.name.type.alias, entity.name.type.class, entity.other.inherited-class, new.expr meta.function-call entity.name.function, storage.type.numeric.go, support.type.builtin.graphql, support.type.graphql, constant.other.key.puppet, meta.definition.resource.puppet storage.type.puppet | #0077ff | bold |
| comment, comment punctuation, comment.block, comment.block punctuation, keyword.command.rem.batchfile | #515151 | italic |
| comment.block.documentation, comment.block.documentation punctuation, comment.line.documentation, string.quoted.docstring.multi.python, string.quoted.docstring.multi.python punctuation.definition.string.begin, string.quoted.docstring.multi.python punctuation.definition.string.end | #737373 | italic |
| entity.name.type.instance.jsdoc, entity.name.type.instance.jsdoc punctuation, variable.other.jsdoc | #888888 | italic bold |
| storage.type.class.jsdoc, storage.type.class.jsdoc punctuation.definition.block.tag | #b0b0b0 | italic bold |
| constant.character.entity, constant.character.entity punctuation, constant.variable, variable.other.enummember, constant.other.unicode-range.css, support.constant.language-range.css, constant.character.enum.graphql, meta.directive.on.svelte support.function.svelte | #926Bff | italic |
| constant.other.caps.rust | #926Bff | |
| constant.other.color.rgb-value.hex.css, constant.other.color.rgb-value.hex.css punctuation, constant.other.rgb-value.css, support.function.magic.python, support.variable.magic.python, source.toml constant.other | #926Bff | |
| constant.language, variable.language, constant.other.boolean.toml | #cc0000 | bold |
| invalid.deprecated.entity.other.attribute-name.html | #666666 | strikethrough |
| meta.tag.metadata.doctype.html entity.name.tag.html, meta.tag.metadata.doctype.html entity.other.attribute-name.html, meta.tag.metadata.doctype.html punctuation.definition.tag, meta.tag.metadata.doctype.html string, meta.shebang.shell, punctuation.definition.comment.shebang.shell, meta.tag.sgml.doctype.xml punctuation.definition.tag, meta.tag.sgml.doctype.xml keyword, meta.tag.sgml.doctype.xml variable.language | #888888 | |
| entity.name.function, entity.other.attribute-name.class.mixin.css, support.function.go, meta.function-call.generic.python, meta.directive variable.function.svelte, source.svelte meta.directive entity.name.type | #00cc55 | — |
| support.function.builtin.go, support.function.builtin.python | #00cc55 | italic |
| constant.object.key.graphql string.unquoted.graphql, meta.arguments.graphql variable.parameter.graphql | #f17f0e | italic |
| variable.parameter, meta.arguments.graphql variable.graphql, meta.function.argument.puppet variable.other.puppet, meta.function.argument.puppet variable.other.puppet punctuation, meta.function.definition.rust variable.other.rust, punctuation.definition.variable.batchfile | #ff6622 | italic |
| entity.name.section.group-title.ini, entity.name.section.group-title.ini punctuation, heading.1.markdown, heading.1.markdown punctuation, markup.heading.setext.1.markdown, entity.other.attribute-name.table.toml, meta.tag.table.toml punctuation | #0077ff | bold |
| entity.name.type.interface, entity.name.type.trait.rust | #00bbee | italic |
| invalid.illegal | #bbbbbb | — |
| entity.name.type.numeric, keyword, keyword punctuation, keyword.operator.expression.in, keyword.operator.expression.typeof, keyword.operator.new, storage.modifier, storage.type, support.type, source.editorconfig keyword.operator, text.ignore invalid.illegal.symbol.negate, keyword.operator.comparison.batchfile, keyword.operator.expansion.shell, keyword.operator.heredoc.shell, keyword.operator.logical.shell, keyword.operator.pipe.shell, keyword.operator.redirect.shell, keyword.operator.redirect.stderr.shell, punctuation.definition.string.heredoc.shell, punctuation.separator.statement.background.shell | #cc0000 | bold |
| entity.name.label, punctuation.separator.label, keyword.other.special-method.batchfile, entity.name.type.lifetime.rust, punctuation.definition.lifetime.rust | #a34116 | bold |
| entity.name.module, entity.name.namespace, entity.name.scope-resolution, entity.name.type.module | #2baf90 | bold |
| constant.numeric, constant.integer | #f2c40e | |
| keyword.operator, operator, storage.type.function.arrow | #efefef | |
| support.type.property-name, support.type.property-name punctuation, source.editorconfig meta.rule keyword.other, keyword.other.definition.ini, support.constant.java-properties, keyword.key.toml, entity.name.tag.yaml | #00ff99 | |
| meta.brace.square, punctuation.brackets.square, punctuation.definition.array.begin, punctuation.definition.array.end, punctuation.definition.bracket.square, punctuation.definition.brace.bracket.square.begin, punctuation.definition.brace.bracket.square.end, punctuation.definition.entity.begin.bracket.square, punctuation.definition.entity.end.bracket.square, punctuation.section.brace.bracket.square.begin.editorconfig, punctuation.section.brace.bracket.square.end.editorconfig, punctuation.definition.attribute-selector.begin.bracket.square.scss, punctuation.definition.attribute-selector.end.bracket.square.scss, source.css.less punctuation.definition.begin.entity.css, source.css.less punctuation.definition.end.entity.css, punctuation.definition.logical-expression.shell, punctuation.definition.array.toml | #00ccff | bold |
| keyword.operator.assignment, punctuation, punctuation.definition.tag, source.css.less meta.brace.round.css | #efefef | — |
| punctuation.section.embedded.begin.erb, punctuation.section.embedded.end.erb, punctuation.section.embedded.begin.gotemplate, punctuation.section.embedded.end.gotemplate, support.constant.handlebars, punctuation.section.embedded.begin.js.jsx, punctuation.section.embedded.end.js.jsx, punctuation.definition.interpolation.begin.bracket.curly.scss, punctuation.definition.interpolation.end.bracket.curly.scss, punctuation.section.embedded.begin.svelte, punctuation.section.embedded.end.svelte, punctuation.definition.block.begin.svelte, source.svelte meta.special punctuation.definition.block.end.svelte, source.svelte meta.special punctuation.definition.keyword.svelte, text.html.derivative punctuation.definition.block.ts, punctuation.section.embedded.begin.tsx, punctuation.section.embedded.end.tsx, punctuation.definition.interpolation.begin.html.vue, punctuation.definition.interpolation.end.html.vue | #0077ff | bold |
| string.regexp.literal.puppet | #00ff99 | |
| string, punctuation.definition.string.begin, punctuation.definition.string.end, punctuation.definition.string.template.begin, punctuation.definition.string.template.end, entity.other.attribute-value.handlebars variable.parameter, text.ignore keyword.file.content, text.ignore markup.deleted.negate.content, punctuation.definition.char.rust, punctuation.definition.string.rust | #f2c40e | |
| constant.character.escape, string constant.character, string constant.character punctuation | #926Bff | |
| punctuation.definition.interpolation.rust | #926Bff | |
| variable.parameter.url.css, variable.parameter.url.scss | #0077ff | italic underline |
| variable.other.less, meta.embedded.line.puppet variable.other.readwrite.global.puppet, variable.scss, meta.embedded.expression.svelte variable | #efefef | — |
| entity.other.ng-binding-name.template, entity.other.ng-binding-name.template punctuation | #ff4253 | italic bold |
| entity.other.ng-binding-name.event, entity.other.ng-binding-name.event punctuation | #c7731f | italic |
| meta.ng-binding.template expression.ng entity.name.type | #efefef | |
| entity.other.ng-binding-name.property, entity.other.ng-binding-name.property punctuation | #e6a15c | italic |
| entity.other.ng-binding-name.two-way, entity.other.ng-binding-name.two-way punctuation | #eebf91 | italic |
| entity.other.attribute-name.class.css, entity.other.attribute-name.class.mixin.css, entity.other.attribute-name.class.svelte, meta.directive.class.svelte variable.parameter.svelte | #00cc55 | |
| support.constant.color.w3c-standard-color-name.css, support.constant.font-name.css, support.constant.property-value.css | #0077ff | italic |
| meta.property-list.css support.function, meta.property-list.scss support.function | #cc0000 | italic bold |
| entity.other.attribute-name.id.css, entity.other.attribute-name.id.css punctuation, source.css.less entity.other.attribute-name.id, source.css.less entity.other.attribute-name.id punctuation | #f17f0e | |
| support.type.property-name.css, support.type.property-name.less | #00ccff | |
| meta.property-value.css, meta.property-value.less, meta.property-value.scss | #0077ff | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-class.less, entity.other.attribute-name.pseudo-element.css, entity.other.attribute-name.pseudo-element.less, entity.other.attribute-name.pseudo-element.less punctuation.definition.entity.less | #e6a15c | |
| entity.name.tag.css | #e65c2e | |
| support.function.type-checking.less, entity.name.function.scss, support.function.misc.scss | #00cc55 | italic |
| keyword.other.definition.custom.editorconfig | #00ff99 | italic |
| entity.name.package.go | #00ccff | bold |
| entity.name.fragment.graphql, variable.fragment.graphql | #0077ff | italic |
| meta.tag entity.other.attribute-name, entity.other.attribute-name.css, entity.other.attribute-name.attribute.css, entity.other.attribute-name.attribute.scss | #00cc55 | italic |
| meta.tag entity.name.tag, meta.tag support.class.component.svelte, source.vue entity.name.tag | #00ccff | |
| string.unquoted.cdata.xml, string.unquoted.cdata punctuation.definition.string.begin.xml, string.unquoted.cdata punctuation.definition.string.end.xml | #efefef | |
| meta.tag entity.name.tag.namespace, meta.tag entity.other.attribute-name.namespace | #e65c2e | italic |
| text.ignore constant.character.directory, text.ignore markup.deleted.negate.content constant.separator.directory | #808080 | |
| markup.bold.markdown, markup.bold.markdown punctuation | #cc0000 | bold |
| markup.fenced_code.block.markdown, markup.fenced_code.block.markdown punctuation.definition.markdown, markup.inline.raw.string.markdown, markup.inline.raw.string.markdown punctuation, markup.raw.block.markdown | #7867e4 | — |
| markup.heading.setext.2.markdown, heading.2.markdown, heading.2.markdown punctuation | #00ccff | bold |
| heading.3.markdown, heading.3.markdown punctuation | #00ff99 | bold |
| heading.4.markdown, heading.4.markdown punctuation | #0dfc6c | bold |
| heading.5.markdown, heading.5.markdown punctuation | #00f248 | bold |
| heading.6.markdown, heading.6.markdown punctuation | #efefef | bold |
| heading.6.markdown, heading.6.markdown punctuation | #efefef | bold |
| meta.separator.markdown | #00ff99 | bold |
| constant.other.reference.link.markdown, meta.link.reference.markdown punctuation, meta.link.reference.def.markdown punctuation.definition.constant | #cc0000 | bold |
| punctuation.definition.link.description.begin.markdown, punctuation.definition.link.description.end.markdown, punctuation.definition.link.title.begin.markdown, punctuation.definition.link.title.end.markdown | #f1c40f | |
| markup.underline.link.markdown, punctuation.definition.link.markdown, markup.underline.link.image.markdown | #0077ff | italic underline |
| markup.list.bullet.asciidoc, markup.list.numbered.markdown, markup.list.numbered.markdown punctuation.definition.list.begin.markdown, markup.list.unnumbered.markdown, markup.list.unnumbered.markdown punctuation.definition.list.begin.markdown | #00cc55 | — |
| markup.quote.markdown, markup.quote.markdown punctuation.definition.quote.begin.markdown | #33cccc | italic |
| markup.strikethrough.markdown, markup.strikethrough.markdown punctuation | #666666 | strikethrough |
| constant.other.character-class.regexp | #e6a15c | |
| punctuation.definition.character-class.regexp | #00ccff | bold |
| keyword.other.back-reference.regexp | #a34116 | |
| keyword.control.anchor.regexp, keyword.operator.or.regexp | #cc0000 | bold |
| punctuation.definition.group.regexp | #f2c40e | bold |
| keyword.operator.quantifier.regexp | #f2c40e | |
| meta.import.rust | #00aaff | bold |
| entity.name.function.macro.rust | #ff4253 | bold |
| punctuation.definition.evaluation.arithmetic.begin.shell, punctuation.definition.evaluation.arithmetic.end.shell | #926Bff | |
| entity.name.command.shell, punctuation.definition.evaluation.backticks.shell, punctuation.definition.evaluation.parens.begin.shell, punctuation.definition.evaluation.parens.end.shell, keyword.command.batchfile | #0077ff | bold |
| variable.other.assignment.shell, variable.other.normal.shell, variable.other.readwrite.batchfile, punctuation.definition.variable.begin.batchfile, punctuation.definition.variable.end.batchfile, punctuation.section.bracket.curly.variable.begin.shell, punctuation.section.bracket.curly.variable.end.shell | #33ffff | |
| source.sparql entity.name.type, source.turtle entity.name.type | #00aaff | italic |
| storage.modifier.turtle | #e65c2e | italic |
| constant.other.database-name.sql | #00ccff | bold |
| constant.other.table-name.sql | #0077ff | bold |
| meta.directive keyword.control.svelte, meta.directive punctuation.definition.keyword.svelte, meta.directive storage.type.svelte, meta.directive.class.svelte entity.other.attribute-name, source.svelte meta.directive keyword.other | #ff4253 | italic bold |
| source.svelte meta.directive.on.svelte entity.name.type | #c7731f | italic |
| source.svelte meta.directive.bind.svelte entity.name.type | #eebf91 | italic |
| meta.attribute.directive.control.vue keyword | #ff4253 | italic bold |
| keyword.control.flow.block-scalar.folded.yaml, keyword.control.flow.block-scalar.literal, storage.modifier.chomping-indicator, string.unquoted.block | #e65c2e | |
| entity.name.type.anchor.yaml, keyword.control.flow.alias.yaml punctuation, keyword.control.property.anchor.yaml punctuation, variable.other.alias.yaml | #0077ff |