vikoala-dark
Publisher: vikoalaThemes in package: 1
a theme for vscode
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#121212
- activityBar.border#1e1e1e60
- activityBar.foreground#dddddd7a
- activityBarBadge.background#ACACAC
- activityBarBadge.foreground#121212
- badge.background#12121230
- badge.foreground#999A97
- breadcrumb.activeSelectionForeground#999A97
- breadcrumb.background#121212
- breadcrumb.focusForeground#DDDDDD
- breadcrumb.foreground#b7b6b6
- breadcrumbPicker.background#121212
- button.background#999A9750
- contrastBorder#999A9740
- debugToolBar.background#121212
- diffEditor.insertedTextBackground#327AA415
- diffEditor.removedTextBackground#f1ededc7
- dropdown.background#121212
- dropdown.border#CDCACA10
- editor.background#121212
- editor.findMatchBackground#121212
- editor.findMatchBorder#999A97
- editor.findMatchHighlightBackground#999A9793
- editor.findMatchHighlightBorder#CDCACA30
- editor.foreground#DDDDDD
- editor.lineHighlightBackground#12121250
- editor.selectionBackground#ACACAC30
- editor.selectionHighlightBackground#999A976b
- editor.selectionHighlightBorder#ACACACf0
- editorBracketMatch.background#121212
- editorBracketMatch.border#b1aeae
- editorCursor.foreground#eee
- editorError.foreground#f0b3ae70
- editorGroup.border#12121230
- editorGroupHeader.tabsBackground#121212
- editorGutter.addedBackground#327AA460
- editorGutter.deletedBackground#fc9292bb
- editorGutter.modifiedBackground#ACACAC60
- editorHoverWidget.background#121212
- editorHoverWidget.border#CDCACA10
- editorIndentGuide.activeBackground#C9BFBF
- editorIndentGuide.background#C9BFBF70
- editorInfo.foreground#ACACAC70
- editorLineNumber.activeForeground#ACACAC
- editorLineNumber.foreground#999A97c0
- editorLink.activeForeground#DDDDDD
- editorMarkerNavigation.background#DDDDDD05
- editorOverviewRuler.border#121212
- editorOverviewRuler.errorForeground#fc9292bb
- editorOverviewRuler.findMatchForeground#999A97
- editorOverviewRuler.infoForeground#ACACAC40
- editorOverviewRuler.warningForeground#09B96C70
- editorRuler.foreground#C9BFBF
- editorSuggestWidget.background#121212
- editorSuggestWidget.border#CDCACA10
- editorSuggestWidget.foreground#DDDDDD
- editorSuggestWidget.highlightForeground#68acbd
- editorSuggestWidget.selectedBackground#999A9720
- editorWarning.foreground#327AA4
- editorWhitespace.foreground#DDDDDD40
- editorWidget.background#121212
- editorWidget.border#89e7ffb7
- editorWidget.resizeBorder#999A97
- extensionButton.prominentBackground#327AA490
- extensionButton.prominentHoverBackground#fc9292bb
- focusBorder#CDCACA00
- gitDecoration.conflictingResourceForeground#89e7ffb7
- gitDecoration.deletedResourceForeground#92fcb7bb
- gitDecoration.ignoredResourceForeground#999A97
- gitDecoration.modifiedResourceForeground#fdca83c5
- gitDecoration.untrackedResourceForeground#ACACAC
- input.background#181818
- input.border#CDCACA10
- input.foreground#DDDDDD
- input.placeholderForeground#DDDDDD60
- inputOption.activeBackground#DDDDDD30
- inputOption.activeBorder#DDDDDD30
- inputValidation.errorBorder#ed7e7650
- inputValidation.infoBorder#ACACAC50
- inputValidation.warningBorder#9fffc89c
- list.activeSelectionBackground#595858c7
- list.activeSelectionForeground#d6d6d5
- list.focusBackground#2B180D
- list.focusForeground#ACACAC
- list.highlightForeground#999A97
- list.hoverBackground#292929
- list.hoverForeground#cacdcd
- list.inactiveSelectionBackground#3e3d3d3b
- list.inactiveSelectionForeground#999A97
- list.warningForeground#fc9292bb
- listFilterWidget.background#12121230
- listFilterWidget.noMatchesOutline#12121230
- listFilterWidget.outline#12121230
- menu.background#121212f8
- menu.border#999A9750
- menu.foreground#afadad
- menu.selectionBackground#272525
- menu.selectionForeground#c3c2c2
- menu.separatorBackground#DDDDDD
- menubar.selectionBackground#f1eded24
- menubar.selectionBorder#999A9750
- menubar.selectionForeground#DDDDDD
- minimap.background#121212
- minimapGutter.addedBackground#fc9292bb
- minimapGutter.deletedBackground#89e7ffb7
- minimapGutter.modifiedBackground#327AA4
- minimapSlider.activeBackground#327AA4b0
- minimapSlider.background#327AA480
- minimapSlider.hoverBackground#327AA4a0
- notificationLink.foreground#999A97
- notifications.background#121212
- notifications.foreground#DDDDDD
- panel.background#121212
- panel.border#12121260
- panelTitle.activeBorder#999A97
- panelTitle.activeForeground#CDCACA
- panelTitle.inactiveForeground#DDDDDD
- peekView.border#12121230
- peekViewEditor.background#DDDDDD05
- peekViewEditor.matchHighlightBackground#999A9750
- peekViewEditorGutter.background#DDDDDD05
- peekViewResult.background#DDDDDD05
- peekViewResult.matchHighlightBackground#999A9750
- peekViewResult.selectionBackground#999A9770
- peekViewTitle.background#DDDDDD05
- peekViewTitleDescription.foreground#DDDDDD60
- pickerGroup.foreground#999A97
- progressBar.background#999A97
- scrollbar.shadow#12121200
- scrollbarSlider.activeBackground#585858cc
- scrollbarSlider.background#282727bb
- scrollbarSlider.hoverBackground#2f2f2fee
- selection.background#999A97
- settings.checkboxBackground#121212
- settings.checkboxForeground#DDDDDD
- settings.dropdownBackground#121212
- settings.dropdownForeground#DDDDDD
- settings.headerForeground#999A97
- settings.modifiedItemIndicator#999A97
- settings.numberInputBackground#121212
- settings.numberInputForeground#DDDDDD
- settings.textInputBackground#121212
- settings.textInputForeground#DDDDDD
- sideBar.background#121212
- sideBar.border#999A9750
- sideBar.foreground#ACACAC
- sideBarSectionHeader.background#121212
- sideBarSectionHeader.border#12121260
- sideBarSectionHeader.foreground#ACACAC
- sideBarTitle.foreground#DDDDDD
- statusBar.background#121212
- statusBar.border#12121260
- statusBar.debuggingBackground#121212
- statusBar.foreground#D7D4D4
- statusBar.noFolderBackground#121212
- statusBarItem.hoverBackground#999A9720
- statusBarItem.remoteBackground#999A97
- statusBarItem.remoteForeground#121212
- tab.activeBackground#181818
- tab.activeBorder#4d4e4d
- tab.activeForeground#cfcfcf
- tab.activeModifiedBorder#999A97
- tab.border#121212
- tab.inactiveBackground#121212
- tab.inactiveForeground#DDDDDDaf
- tab.unfocusedActiveBackground#999A9740
- tab.unfocusedActiveBorder#999A97
- tab.unfocusedActiveForeground#DDDDDD
- tab.unfocusedInactiveBackground#999A9710
- tab.unfocusedInactiveForeground#DDDDDD7f
- terminal.ansiBlack#121212
- terminal.ansiBlue#ACACAC
- terminal.ansiBrightBlack#999A97
- terminal.ansiBrightBlue#ACACAC
- terminal.ansiBrightCyan#CDBABA
- terminal.ansiBrightGreen#327AA4
- terminal.ansiBrightMagenta#68acbd
- terminal.ansiBrightRed#fc9292bb
- terminal.ansiBrightWhite#CDCACA
- terminal.ansiBrightYellow#68acbd
- terminal.ansiCyan#CDBABA
- terminal.ansiGreen#327AA4
- terminal.ansiMagenta#68acbd
- terminal.ansiRed#fc9292bb
- terminal.ansiWhite#CDCACA
- terminal.ansiYellow#68acbd
- terminalCursor.background#121212
- terminalCursor.foreground#68acbd
- textLink.activeForeground#DDDDDD
- textLink.foreground#999A97
- titleBar.activeBackground#121212
- titleBar.activeForeground#DDDDDD
- titleBar.border#12121260
- titleBar.inactiveBackground#121212
- titleBar.inactiveForeground#999A97
- tree.indentGuidesStroke#C9BFBF
- widget.shadow#12121230
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| storage.type | #68acbd | — |
| string constant.other.placeholder, invalid.deprecated, keyword, storage.modifier | #fdca83c5 | — |
| punctuation.definition.interpolation.end.bracket.curly.scss, punctuation.definition.interpolation.begin.bracket.curly.scss | #327AA4 | — |
| variable, constant.other.php, support.variable.property.importmeta.jssource.js, constant.numeric.float.yaml, constant.language.boolean.yaml, meta.property-value.css, keyword.other.unit.px.css, constant.numeric.css, string.quoted.single.css, support.constant.font-name.css | #fc9292bb | — |
| constant.other.color | #CDCACA | — |
| invalid, invalid.illegal | #fc9292bb | — |
| keyword.control, constant.other.color, punctuation.definition.tag, punctuation, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution, entity.name.tag.reference.scss | #868687 | — |
| comment.block.js, source.js, comment.block.documentation.js, comment.block.documentation.tsx, meta.arrow.tsx, meta.var.expr.tsx, punctuation.definition.comment.tsx, comment.line.double-slash.tsx, comment.line.double-slash.tsx, source.tsx, comment.block.js.jsx, meta.embedded.expression.js.jsx, meta.jsx.children.js.jsx, meta.tag.without-attributes.js.jsx, meta.block.js.jsx, meta.function.expression.js.jsx, meta.export.default.js.jsx, source.js.jsx, comment.block.css, punctuation.definition.comment.begin.css, punctuation.definition.comment.end.css, punctuation.definition.comment.ts, comment.line.double-slash.ts, source.ts, source.vue | #6D6F7C | — |
| punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, entity.name.type.module.js | #a9a9a989 | — |
| keyword.control.at-rule, punctuation.terminator.rule.css, keyword.control.operator, punctuation.definition.entity.css, keyword.operator.assignment.js, punctuation.separator.comma.js, punctuation.definition.string.begin.js, punctuation.definition.string.end.js, punctuation.definition.binding-pattern.object.js | #908d8d | — |
| punctuation.definition, string.quoted.single.scss | #A7A8AF | — |
| keyword.control, entity.name.tag.directive.ts, meta.tag.ts, comment.line.triple-slash.directive.ts | #80fdb686 | — |
| comment.line.scss, comment.line.double-slash.js, punctuation.definition.comment.scss, punctuation.definition.comment.js, punctuation.definition.comment.html, comment.block.html | #6D6F7C | — |
| meta.jsx.children.tsx, meta.tag.tsx, meta.jsx.children.tsx, meta.tag.without-attributes.tsx, meta.arrow.tsx, meta.export.default.tsx, meta.embedded.block.typescriptreact, markup.fenced_code.block.markdown, text.html.markdown, punctuation.definition.tag.begin.tsx, meta.tag.without-attributes.tsx, meta.block.tsx, meta.arrow.tsx, meta.block.tsx, meta.arrow.tsx, text.html.derivative | #A7A8AF | — |
| entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter | #DDDDDD | — |
| entity.name.tag.html | #9fffc89c | — |
| meta.jsx.children.js.jsx, meta.tag.without-attributes.js.jsx, meta.jsx.children.js.jsx, meta.tag.without-attributes.js.jsx, meta.block.js.jsx, meta.function.expression.js.jsx, meta.export.default.js.jsx, source.js.jsx | #f1ededc7 | — |
| entity.name.tag.yaml, string.unquoted.plain.out.yaml, source.yaml, storage.type.function.arrow.tsx, meta.arrow.tsx, meta.export.default.tsx, meta.embedded.block.typescriptreact, markup.fenced_code.block.markdown, text.html.markdown | #68acbd | — |
| meta.jsx.children.js, meta.tag.without-attributes.js, meta.jsx.children.js, meta.tag.without-attributes.js, meta.block.js, meta.function.js, source.js | #f1ededc7 | — |
| entity.name.tag.js, meta.tag.without-attributes.js, meta.block.js, meta.function.js, source.js | #9fffc89c | — |
| entity.name.tag.tsx, meta.tag.tsx, meta.block.tsx, meta.function.expression.tsx, meta.export.default.tsx, source.tsx, entity.name.tag.js.jsx, meta.tag.without-attributes.js.jsx, meta.tag.without-attributes.js.jsx, meta.block.js.jsx, meta.function.expression.js.jsx, meta.export.default.js.jsx, source.js.jsx | #9fffc89c | — |
| punctuation.accessor.js, source.js | #fc9292bb | — |
| variable.parameter.js, variable.parameter.keyframe-list.css, constant.other.object.key.js, variable.other.object.property.js | #9fffc89c | — |
| entity.name.tag.script.html.vue, entity.name.tag.template.html.vue, entity.name.tag.style.html.vue, source.vue | #9fffc89c | — |
| punctuation.definition.metadata.markdown, meta.link.inline.markdown, meta.paragraph.markdown, text.html.markdown | #f1ededc7 | — |
| meta.embedded.block.shellscript, markup.fenced_code.block.markdown, text.html.markdown | #fdca83c5 | — |
| storage.type.js, string.other.link.title.markdown | #68acbd | |
| variable.other.constant.js | #fc9292bb | — |
| string.quoted.double.json | #fc9292bb | — |
| string, string.quoted.double.html, markup.fenced_code.block.markdown, markup.inline.raw.string.markdown, variable.function, keyword.other.special-method, entity.name.function, markup.bold, markup.bold.markdown, markup.italic.markdown, meta.class-method.js entity.name.function.js, variable.function.constructor, entity.name.tag.other.html, entity.name.tag.block.any.html, source.sass keyword.control | #fdca83c5 | — |
| punctuation.definition.string.begin.html, punctuation.definition.string.end.html | #f1ededc7 | — |
| support.other.variable, string.other.link, markup.table | #DDDDDD | — |
| constant.numeric, constant.language, constant.character, constant.escape, source.ini | #9fffc89c | — |
| keyword.other.unit, keyword.other, punctuation.separator.key-value.html | #fc9292bb | — |
| variable.parameter.function.language.special, variable.parameter | #fc9292bb | — |
| constant.other.symbol, constant.other.key, entity.other.inherited-class, keyword.other.unit, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly, string.unquoted.label.js | #327AA4 | — |
| entity.name, support.type, support.class, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types, entity.other.attribute-name.html | #fc9292bb | — |
| meta.at-rule.media.header.css, source.css | #fc9292bb | — |
| support.type | #68acbd | — |
| 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, meta.object-literal.key | #fdca83c5 | — |
| entity.name.module.js, variable.import.parameter.js, variable.other.class.js | #fc9292bb | — |
| entity.name.method.js, tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js | #ACACAC | italic |
| entity.other.attribute-name, support.function | #68acbd | — |
| entity.other.attribute-name.id, entity.other.attribute-name.class, entity.other.attribute-name.pseudo-class, entity.name.tag.css, support.constant, entity.other.attribute-name.html, string.quoted.single.js, storage.type.function.js | #89e7ffb7 | — |
| source.scss keyword.control | #9fffc89c | — |
| markup.inserted | #327AA4 | — |
| markup.deleted | #fc9292bb | — |
| markup.changed | #9fffc89c | — |
| string.regexp | #CDBABA | — |
| constant.character.escape | #CDBABA | — |
| *url*, *link*, *uri* | — | underline |
| source.js constant.other.object.key.js string.unquoted.label.js | #DDDDDD | — |
| support.type.property-name.json | #89e7ffb7 | — |
| text.html.markdown, punctuation.definition.list_item.markdown | #DDDDDD | — |
| text.html.markdown markup.inline.raw.markdown | #9fffc89c | — |
| text.html.markdown markup.inline.raw.markdown, punctuation.definition.raw.markdown | #999A9750 | — |
| text.html.markdown meta.dummy.line-break | — | — |
| markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown, entity.name.section.markdown | #68acbd | bold |
| markup.underline | #ACACAC | underline |
| markup.strike | — | |
| markup.quote punctuation.definition.blockquote.markdown | #999A9750 | — |
| markup.quote | — | italic |
| string.other.link.description.title.markdown | #9fffc89c | — |
| constant.other.reference.link.markdown | #9fffc89c | — |
| markup.raw.block | #9fffc89c | — |
| punctuation.definition.raw.markdown, punctuation.definition.markdown | #CDBABA | — |
| variable.language.fenced.markdown | #999A97 | — |
| meta.separator | #A7A8AF | bold |
| token.info-token | #999A97 | — |
| token.warn-token | #9fffc89c | — |
| token.error-token | #fc9292bb | — |
| token.debug-token | #CDBABA | — |