Stockholm
Publisher: Ludvig LundgrenThemes in package: 1
A theme for Visual Studio Code inspierd by codesandbox.io
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#1c2022
- activityBar.border#0000004d
- activityBar.foreground#D7DAE0
- activityBarBadge.background#4D78CC
- activityBarBadge.foreground#F8FAFD
- badge.background#282d34
- button.background#404754
- debugToolBar.background#21252b
- diffEditor.insertedTextBackground#00809B33
- dropdown.background#1d1f23
- dropdown.border#181A1F
- editor.background#1c2022
- editor.editor.findMatchBackground#42557B
- editor.findMatchHighlightBackground#314365
- editor.lineHighlightBackground#14161b
- editor.selectionBackground#484e5b
- editor.selectionHighlightBackground#484e5b
- editor.wordHighlightBackground#484e5b
- editor.wordHighlightStrongBackground#abb2bf26
- editorCursor.foreground#f8f8f0
- editorError.foreground#c24038
- editorGroup.background#181A1F
- editorGroup.border#181A1F
- editorGroupHeader.tabsBackground#141618
- editorHoverWidget.background#21252B
- editorHoverWidget.border#181A1F
- editorIndentGuide.background#3B4048
- editorLineNumber.foreground#495162
- editorMarkerNavigation.background#21252b
- editorRuler.foreground#abb2bf26
- editorSuggestWidget.background#21252B
- editorSuggestWidget.border#181A1F
- editorSuggestWidget.selectedBackground#2c313a
- editorWhitespace.foreground#3B4048
- editorWidget.background#21252B
- input.background#1d1f23
- list.activeSelectionBackground#2c313a
- list.activeSelectionForeground#6caedd
- list.focusBackground#383E4A
- list.highlightForeground#C5C5C5
- list.hoverBackground#292d35
- list.inactiveSelectionBackground#2c313a
- list.inactiveSelectionForeground#d7dae0
- notification.background#21252b
- peekViewEditor.matchHighlightBackground#29244b
- scrollbarSlider.activeBackground#747D9180
- scrollbarSlider.background#4E566680
- scrollbarSlider.hoverBackground#5A637580
- sideBar.background#24282a
- sideBar.border#0000004d
- sideBarSectionHeader.background#24282a
- sideBarSectionHeader.foreground#e0e0e0
- sideBarTitle.foreground#6caedd
- statusBar.background#21252B
- statusBar.debuggingBackground#7e0097
- statusBar.debuggingBorder#66017a
- statusBar.debuggingForeground#d4d4d4
- statusBar.foreground#9da5b4
- statusBar.noFolderBackground#21252B
- statusBarItem.hoverBackground#2c313a
- tab.activeBackground#1c2022
- tab.activeBorder#6caedd
- tab.border#181A1F
- tab.inactiveBackground#141618
- terminal.ansiBlack#2D3139
- terminal.ansiBlue#2e8ccf
- terminal.ansiGreen#98c379ff
- terminal.ansiYellow#B4881D
- terminal.foreground#C8C8C8
- titleBar.activeBackground#282d34
- titleBar.activeForeground#9da5b4
- titleBar.inactiveBackground#282d34
- titleBar.inactiveForeground#6B717D
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| — | #D4D4D4 | — |
| comment, punctuation.definition.comment | #7f7f7f | — |
| variable.language | #6caedd | — |
| tag.decorator.js punctuation.definition.tag.js | #e0e0e0 | — |
| tag.decorator.js, entity.name.tag.js, tag.decorator.js | #fac863 | — |
| source.js constant.other.object.key.js string.unquoted.label.js | #E15A60 | — |
| variable-meta.export.default, variable.parameter | #D4D4D4 | — |
| variable.other.readwrite | #fac863 | — |
| meta.group.braces.curly meta.group.braces.round meta.group.braces.curly variable.other.readwrite | #fac863 | — |
| keyword-meta.tag.attributes, keyword.operator.new, storage.type, storage.modifier, keyword.control | #6caedd | — |
| constant.other.color, meta.tag - meta.tag.without-attributes, keyword.other.template, keyword.other.substitution | #e0e0e0 | — |
| meta.tag.attributes - meta.embedded.expression | #cecece | — |
| punctuation - punctuation.definition.string.begin, punctuation.separator.key-value-punctuation.separator.key-value.css, punctuation.definition.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.separator.inheritance.php | #ec5f67 | — |
| punctuation - punctuation.definition.block, punctuation.terminator.statement, punctuation.separator.comma, punctuation.section.embedded, punctuation.definition.parameters | #e0e0e0 | — |
| support.module.node.js | #fac863 | — |
| support.function, support.constant | #fac863 | — |
| keyword.operator - keyword.operator.assignment | #6caedd | — |
| keyword.operator.assignment - meta.tag.attributes, keyword.operator.arithmetic, punctuation.separator.key-value.css | #d7deea | — |
| entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter | #ec5f67 | — |
| meta.tag.without-attributes, meta.embedded.expression, meta.jsx.children | #d4d4d4 | — |
| meta.tag | #e0e0e0 | — |
| entity.name.function, variable.function, keyword.other.special-method, meta.block-level | #fac863 | — |
| variable.other.object | #aa759f | — |
| meta.export.default | #fac863 | — |
| variable.other.object.property, support.variable.property.dom | #d7deea | — |
| meta.object-literal.key | #d4d4d4 | — |
| meta.function-call.js - support.variable.dom.js | #fac863 | — |
| support.function.dom.js | #fac863 | — |
| support.other.variable, string.other.link | #F2777A | — |
| constant.numeric, constant.language, constant.character, keyword.other.unit | #fac863 | — |
| string, constant.other.symbol, constant.other.key, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js | #99c794 | — |
| entity.name.class, entity.other.inherited-class, entity.name.type, entity.name.type.class, support.type, support.class, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter | #FAC863 | — |
| entity.name.module.js, variable.import.parameter.js, variable.other.class.js | #E15A60 | — |
| entity.name.method.js | #D8DEE9 | — |
| meta.class-method.js entity.name.function.js, variable.function.constructor | #D8DEE9 | — |
| entity.other.attribute-name | #aa759f | — |
| markup.inserted | #99c794 | — |
| markup.deleted | #E15A60 | — |
| markup.changed | #BB80B3 | — |
| string.regexp | #e0e0e0 | — |
| constant.character.escape | #e0e0e0 | — |
| *url*, *link*, *uri* | — | underline |
| constant.numeric.line-number.find-in-files - match | #AB7967 | — |
| entity.name.filename.find-in-files | #99c794 | — |
| token.info-token | #6796e6 | — |
| token.warn-token | #cd9731 | — |
| token.error-token | #f44747 | — |
| token.debug-token | #b267e6 | — |
| meta.brace.round | #e0e0e0 | — |
| meta.definition.variable-entity.name.function | #d4d4d4 | — |
| meta.class.body meta.function.method entity.name.function.method | #aa759f | — |
| meta.class.body meta.group.braces.curly entity.name.function | #6caedd | — |
| meta.property.object variable.other.property | #aa759f | — |
| meta.class.body meta.group.braces.curly meta.group.braces.round variable.other.readwrite | #6caedd | — |
| meta.class meta.method.declaration meta.definition.method intity.name.function | #aa759f | — |
| meta.class meta.method.declaration meta.return.type support.type.primitive | #aa759f | — |
| meta.group.braces.curly constant.other.object.key string.unquoted | #aa759f | — |
| meta.function.arrow storage.type.function | #aa759f | — |
| meta.class meta.method.declaration meta.var.expr meta.function-call support.function.dom | #aa759f | — |
| meta.group.braces.curly variable.other.constant | #fac863 | — |
| variable.other.constant | #fac863 | — |
| support.type.object.process | #aa759f | — |
| meta.group.braces.round meta.group.braces.curly variable.other.constant | #fac863 | — |
| meta.group.braces.round meta.group.braces.curly variable.other.readwrite | #6caedd | — |
| meta.group.braces.curly meta.function-call.with-arguments entity.name.function | #6caedd | — |
| meta.group.braces.round variable.other.readwrite | #6caedd | — |
| meta.group.braces.curly meta.function-call.with-arguments meta.function-call.without-arguments entity.name.function | #fac863 | — |
| meta.group.braces.curly meta.group.braces.round meta.group.braces.curly meta.function-call.with-arguments meta.function-call.with-arguments entity.name.function | #fac863 | — |
| meta.group.braces.curly meta.function-call.static.with-arguments entity.name.function | #aa759f | — |
| meta.group.braces.curly meta.function-call.method.with-arguments entity.name.function | #aa759f | — |
| meta.group.braces.curly meta.group.braces.round meta.group.braces.curly meta.group.braces.round variable.other.readwrite | #6caedd | — |
| meta.group.braces.curly meta.group.braces.round meta.group.braces.curly meta.group.braces.round variable.other.readwrite | #6caedd | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...