Sketch Company Color Theme
Publisher: Sketch CompanyThemes in package: 1
Custom Color Theme for VS Code made by the Sketch Company
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#0b1c31
- activityBar.activeBorder#d0ebee
- activityBar.background#08111d
- activityBar.border#0e1e33
- activityBar.foreground#d0ebee
- activityBar.inactiveForeground#506c6e
- activityBarBadge.background#00c076
- badge.background#1e7ac5
- badge.foreground#d0ebee
- banner.background#060d16
- banner.foreground#d0ebee
- banner.iconForeground#d0ebee
- button.background#0b1c31
- button.hoverBackground#0f2746
- debugConsole.errorForeground#ff2245
- debugConsole.infoForeground#2fa1ff
- debugConsole.sourceForeground#d0ebee
- debugConsole.warningForeground#ffbd2f
- dropdown.background#050c14
- dropdown.border#0e1e33
- dropdown.foreground#d0ebee
- dropdown.listBackground#050c14
- editor.background#050c14
- editor.findMatchBackground#d83aff41
- editor.findMatchHighlightBackground#d83aff41
- editor.foldBackground#132d4d81
- editor.foreground#acc5c7
- editor.inactiveSelectionBackground#132d4d81
- editor.lineHighlightBackground#132d4d10
- editor.lineHighlightBorder#0e203681
- editor.selectionBackground#132d4d81
- editor.selectionHighlightBackground#132d4d81
- editorCursor.foreground#d0ebee
- editorError.foreground#ff2245
- editorGhostText.foreground#395f85
- editorGroup.border#0e1e33
- editorGroup.dropBackground#0f274694
- editorGroup.dropIntoPromptForeground#d0ebee
- editorGroupHeader.tabsBackground#060d16
- editorHint.foreground#00c076
- editorHoverWidget.background#0b1c31
- editorHoverWidget.border#0e1e33
- editorHoverWidget.foreground#d0ebee
- editorHoverWidget.highlightForeground#0f2746
- editorInfo.foreground#00c076
- editorLineNumber.activeForeground#d0ebee
- editorLineNumber.foreground#5e7a7e
- editorSuggestWidget.background#0b1c31
- editorSuggestWidget.border#0e1e33
- editorSuggestWidget.foreground#d0ebee
- editorSuggestWidget.selectedBackground#0f2746
- editorWarning.foreground#ffbd2f
- editorWidget.background#0b1c31
- editorWidget.border#0e1e33
- editorWidget.foreground#d0ebee
- editorWidget.resizeBorder#0e1e33
- input.background#060d16
- input.border#0e1e33
- input.foreground#d0ebee
- list.activeSelectionBackground#0b1c31
- list.dropBackground#0f2746
- list.errorForeground#ff2245
- list.hoverBackground#0b1c31
- list.inactiveSelectionBackground#0b1c31
- list.warningForeground#ffbd2f
- menu.background#060d16
- menu.foreground#d0ebee
- notificationCenter.border#0e1e33
- notificationCenterHeader.background#0b1c31
- notificationCenterHeader.foreground#d0ebee
- notifications.background#08111d
- notifications.border#0e1e33
- notifications.foreground#d0ebee
- notificationsErrorIcon.foreground#ff2245
- notificationsInfoIcon.foreground#1e7ac5
- notificationsWarningIcon.foreground#ffbd2f
- notificationToast.border#0e1e33
- outputView.background#050c14
- panel.background#060d16
- panel.border#0e1e33
- panelInput.border#0e1e33
- panelTitle.activeBorder#00c076
- panelTitle.activeForeground#d0ebee
- panelTitle.inactiveForeground#709196
- ports.iconRunningProcessForeground#d0ebee
- problemsErrorIcon.foreground#ff2245
- problemsInfoIcon.foreground#2fa1ff
- problemsWarningIcon.foreground#ffbd2f
- scrollbarSlider.activeBackground#08111dad
- scrollbarSlider.background#08111db2
- scrollbarSlider.hoverBackground#0b1c31b7
- sideBar.background#060d16
- sideBar.border#0e1e33
- sideBar.dropBackground#060d16
- sideBarSectionHeader.background#0e1e33
- sideBarSectionHeader.foreground#d0ebee
- sideBarTitle.background#060d16
- sideBarTitle.foreground#d0ebee
- sideBySideEditor.horizontalBorder#0e1e33
- sideBySideEditor.verticalBorder#0e1e33
- statusBar.background#08111d
- statusBar.foreground#d0ebee
- statusBarItem.activeBackground#08111d
- statusBarItem.errorBackground#ff2245
- statusBarItem.prominentBackground#1e7ac5
- statusBarItem.warningBackground#ffbd2f
- tab.activeBackground#050c14
- tab.activeBorder#050c14
- tab.activeBorderTop#00c076
- tab.activeForeground#d0ebee
- tab.border#0e1e33
- tab.hoverBackground#08111d
- tab.inactiveBackground#060d16
- tab.inactiveForeground#9fcfd6
- tab.lastPinnedBorder#00c076
- terminal.background#050c14
- terminal.border#0e1e33
- terminal.findMatchBackground#d83aff41
- terminal.findMatchHighlightBackground#d83aff41
- terminal.foreground#d0ebee
- terminal.selectionBackground#132d4d
- terminal.tab.activeBorder#00c076
- titleBar.activeBackground#04090f
- titleBar.activeForeground#d0ebee
- titleBar.border#0e1e33
- titleBar.inactiveBackground#091624
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| support.type.property-name.css | #9CDCFE | — |
| entity.other.attribute-name, entity.other.inherited-class | #9CDCFE | — |
| entity.name.tag | #3f92ff | — |
| meta.tag | #d0ebee | — |
| support.type.property-name.json | #9CDCFE | — |
| meta.function, meta.class | #7158ff | — |
| variable.language | #8671ff | bold |
| string, string.other, string.quoted, string.quoted.other, string.quoted.double, string.quoted.single, string.quoted.triple, string.unquoted, string.interpolated, string.regexp, punctuation.definition.string.begin, punctuation.definition.string.end | #c48066 | — |
| comment, comment.block, comment.block.documentation, comment.line | #437986 | italic |
| entity.name.function, support.function, support.constant.handlebars, source.powershell variable.other.member, entity.name.operator.custom-literal | #DCDCAA | — |
| support.class, support.type, entity.name.type, entity.name.namespace, entity.other.attribute, entity.name.scope-resolution, entity.name.class, storage.type.numeric.go, storage.type.byte.go, storage.type.boolean.go, storage.type.string.go, storage.type.uintptr.go, storage.type.error.go, storage.type.rune.go, storage.type.cs, storage.type.generic.cs, storage.type.modifier.cs, storage.type.variable.cs, storage.type.annotation.java, storage.type.generic.java, storage.type.java, storage.type.object.array.java, storage.type.primitive.array.java, storage.type.primitive.java, storage.type.token.java, storage.type.groovy, storage.type.annotation.groovy, storage.type.parameters.groovy, storage.type.generic.groovy, storage.type.object.array.groovy, storage.type.primitive.array.groovy, storage.type.primitive.groovy | #44c7ad | — |
| meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json, entity.other.inherited-class | #4EC9B0 | — |
| keyword.control, source.cpp keyword.operator.new, keyword.operator.delete, keyword.other.using, keyword.other.directive.using, keyword.other.operator, entity.name.operator | #c769bf | — |
| variable, meta.definition.variable.name, support.variable, entity.name.variable, constant.other.placeholder | #9CDCFE | — |
| variable.other.constant, variable.other.enummember | #4FC1FF | — |
| meta.object-literal.key | #9CDCFE | — |
| support.constant.property-value, support.constant.font-name, support.constant.media-type, support.constant.media, constant.other.color.rgb-value, constant.other.rgb-value, support.constant.color | #CE9178 | — |
| punctuation.definition.group.regexp, punctuation.definition.group.assertion.regexp, punctuation.definition.character-class.regexp, punctuation.character.set.begin.regexp, punctuation.character.set.end.regexp, keyword.operator.negation.regexp, support.other.parenthesis.regexp | #CE9178 | — |
| constant.character.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.regexp, constant.character.set.regexp | #d16969 | — |
| keyword.operator.or.regexp, keyword.control.anchor.regexp | #DCDCAA | — |
| keyword.operator.quantifier.regexp | #d7ba7d | — |
| constant.character, constant.other.option | #569cd6 | — |
| constant.character.escape | #d7ba7d | — |
| entity.name.label | #C8C8C8 | — |