Nord Theme by Zam
Publisher: ZamBamThemes in package: 1
Theme based on the Nord colorway
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#3b4252
- activityBar.border#3b425260
- activityBar.foreground#d8dee9
- activityBarBadge.background#b48ead
- activityBarBadge.foreground#3b4252
- badge.background#3b425230
- badge.foreground#8fbcbb
- breadcrumb.activeSelectionForeground#8fbcbb
- breadcrumb.background#3b4252
- breadcrumb.focusForeground#d8dee9
- breadcrumb.foreground#d8dee9
- breadcrumbPicker.background#3b4252
- button.background#8fbcbb50
- contrastBorder#8fbcbb40
- debugToolBar.background#3b4252
- diffEditor.insertedTextBackground#3E97C115
- diffEditor.removedTextBackground#ebcb8b20
- dropdown.background#3b4252
- dropdown.border#C7C0B310
- editor.background#2e3440
- editor.findMatchBackground#3b4252
- editor.findMatchBorder#8fbcbb
- editor.findMatchHighlightBackground#9f8fbc93
- editor.findMatchHighlightBorder#C7C0B330
- editor.foreground#d8dee9
- editor.lineHighlightBackground#3b425250
- editor.selectionBackground#81a1c130
- editor.selectionHighlightBackground#8fbcbb6b
- editor.selectionHighlightBorder#b48eadf0
- editorBracketMatch.background#3b4252
- editorBracketMatch.border#81a1c17f
- editorCursor.foreground#81a1c1
- editorError.foreground#BE717970
- editorGroup.border#3b425230
- editorGroupHeader.tabsBackground#3b4252
- editorGutter.addedBackground#3E97C160
- editorGutter.deletedBackground#BE717960
- editorGutter.modifiedBackground#b48ead60
- editorHoverWidget.background#3b4252
- editorHoverWidget.border#C7C0B310
- editorIndentGuide.activeBackground#636A6B
- editorIndentGuide.background#636A6B70
- editorInfo.foreground#b48ead70
- editorLineNumber.activeForeground#b48ead
- editorLineNumber.foreground#81a1c1c0
- editorLink.activeForeground#d8dee9
- editorMarkerNavigation.background#d8dee905
- editorOverviewRuler.border#3b4252
- editorOverviewRuler.errorForeground#ebcb8b40
- editorOverviewRuler.findMatchForeground#8fbcbb
- editorOverviewRuler.infoForeground#b48ead40
- editorOverviewRuler.warningForeground#81a1c170
- editorRuler.foreground#636A6B
- editorSuggestWidget.background#3b4252
- editorSuggestWidget.border#C7C0B310
- editorSuggestWidget.foreground#d8dee9
- editorSuggestWidget.highlightForeground#81a1c1
- editorSuggestWidget.selectedBackground#8fbcbb20
- editorWarning.foreground#3E97C1
- editorWhitespace.foreground#d8dee940
- editorWidget.background#3b4252
- editorWidget.border#81a1c1
- editorWidget.resizeBorder#8fbcbb
- extensionButton.prominentBackground#3E97C190
- extensionButton.prominentHoverBackground#ebcb8b
- focusBorder#C7C0B300
- gitDecoration.conflictingResourceForeground#81a1c1
- gitDecoration.deletedResourceForeground#ebcb8b
- gitDecoration.ignoredResourceForeground#8fbcbb
- gitDecoration.modifiedResourceForeground#B6C9B9
- gitDecoration.untrackedResourceForeground#b48ead
- input.background#484F62
- input.border#C7C0B310
- input.foreground#d8dee9
- input.placeholderForeground#d8dee960
- inputOption.activeBackground#d8dee930
- inputOption.activeBorder#d8dee930
- inputValidation.errorBorder#ebcb8b50
- inputValidation.infoBorder#b48ead50
- inputValidation.warningBorder#81a1c150
- list.activeSelectionBackground#3b4252
- list.activeSelectionForeground#8fbcbb
- list.focusBackground#484F62
- list.focusForeground#b48ead
- list.highlightForeground#8fbcbb
- list.hoverBackground#636A6B
- list.hoverForeground#C7C0B3
- list.inactiveSelectionBackground#3b425230
- list.inactiveSelectionForeground#8fbcbb
- list.warningForeground#81a1c1
- listFilterWidget.background#3b425230
- listFilterWidget.noMatchesOutline#3b425230
- listFilterWidget.outline#3b425230
- menu.background#3b4252f8
- menu.border#8fbcbb50
- menu.foreground#d8dee9
- menu.selectionBackground#484F62
- menu.selectionBorder#3b425230
- menu.selectionForeground#d8dee9
- menu.separatorBackground#d8dee9
- menubar.selectionBackground#484F62
- menubar.selectionBorder#8fbcbb50
- menubar.selectionForeground#d8dee9
- minimap.background#3b4252
- minimapGutter.addedBackground#ebcb8b
- minimapGutter.deletedBackground#81a1c1
- minimapGutter.modifiedBackground#3E97C1
- minimapSlider.activeBackground#3E97C1b0
- minimapSlider.background#3E97C180
- minimapSlider.hoverBackground#3E97C1a0
- notificationLink.foreground#8fbcbb
- notifications.background#3b4252
- notifications.foreground#d8dee9
- panel.background#3b4252
- panel.border#3b425260
- panelTitle.activeBorder#8fbcbb
- panelTitle.activeForeground#C7C0B3
- panelTitle.inactiveForeground#d8dee9
- peekView.border#3b425230
- peekViewEditor.background#d8dee905
- peekViewEditor.matchHighlightBackground#8fbcbb50
- peekViewEditorGutter.background#d8dee905
- peekViewResult.background#d8dee905
- peekViewResult.matchHighlightBackground#8fbcbb50
- peekViewResult.selectionBackground#8fbcbb70
- peekViewTitle.background#d8dee905
- peekViewTitleDescription.foreground#d8dee960
- pickerGroup.foreground#8fbcbb
- progressBar.background#8fbcbb
- scrollbar.shadow#3b425200
- scrollbarSlider.activeBackground#b48eadcc
- scrollbarSlider.background#b48eadbb
- scrollbarSlider.hoverBackground#b48eadee
- selection.background#8fbcbb70
- settings.checkboxBackground#3b4252
- settings.checkboxForeground#d8dee9
- settings.dropdownBackground#3b4252
- settings.dropdownForeground#d8dee9
- settings.headerForeground#8fbcbb
- settings.modifiedItemIndicator#8fbcbb
- settings.numberInputBackground#3b4252
- settings.numberInputForeground#d8dee9
- settings.textInputBackground#3b4252
- settings.textInputForeground#d8dee9
- sideBar.background#3b4252
- sideBar.border#8fbcbb50
- sideBar.foreground#81a1c1
- sideBarSectionHeader.background#434c5e
- sideBarSectionHeader.border#3b425260
- sideBarSectionHeader.foreground#ebcb8b
- sideBarTitle.foreground#d8dee9
- statusBar.background#484F62
- statusBar.border#3b425260
- statusBar.debuggingBackground#81a1c1
- statusBar.debuggingForeground#3b4252
- statusBar.foreground#d8dee9
- statusBar.noFolderBackground#3b4252
- statusBarItem.hoverBackground#8fbcbb20
- statusBarItem.remoteBackground#8fbcbb
- statusBarItem.remoteForeground#3b4252
- tab.activeBackground#81a1c150
- tab.activeBorder#b48ead
- tab.activeForeground#81a1c1
- tab.activeModifiedBorder#b48ead
- tab.border#3b4252
- tab.inactiveBackground#d8dee920
- tab.inactiveForeground#d8dee9
- tab.unfocusedActiveBackground#8fbcbb40
- tab.unfocusedActiveBorder#8fbcbb
- tab.unfocusedActiveForeground#d8dee9
- tab.unfocusedInactiveBackground#8fbcbb10
- tab.unfocusedInactiveForeground#d8dee9
- terminal.ansiBlack#2e3440
- terminal.ansiBlue#5E81AC
- terminal.ansiBrightBlack#3b4252
- terminal.ansiBrightBlue#81a1c1
- terminal.ansiBrightCyan#88c0d0
- terminal.ansiBrightGreen#8fbcbb
- terminal.ansiBrightMagenta#b48ead
- terminal.ansiBrightRed#BE7179
- terminal.ansiBrightWhite#d8dee9
- terminal.ansiBrightYellow#ebcb8b
- terminal.ansiCyan#E9C8E9
- terminal.ansiGreen#8fbcbb
- terminal.ansiMagenta#b48ead
- terminal.ansiRed#BE7179
- terminal.ansiWhite#d8dee9
- terminal.ansiYellow#ebcb8b
- terminalCursor.background#3b4252
- terminalCursor.foreground#81a1c1
- textLink.activeForeground#d8dee9
- textLink.foreground#8fbcbb
- titleBar.activeBackground#3b4252
- titleBar.activeForeground#81a1c1
- titleBar.border#3b425260
- titleBar.inactiveBackground#3b4252
- titleBar.inactiveForeground#8fbcbb
- tree.indentGuidesStroke#636A6B
- widget.shadow#3b425230
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| variable, string constant.other.placeholder, invalid.deprecated, keyword, storage.type, storage.modifier | #81a1c1 | — |
| variable | #88c0d0 | — |
| variable, string constant.other.placeholder, entity.name.function, punctuation.definition.interpolation.end.bracket.curly.scss, punctuation.definition.interpolation.begin.bracket.curly.scss | — | italic |
| punctuation.definition.interpolation.end.bracket.curly.scss, punctuation.definition.interpolation.begin.bracket.curly.scss | #3E97C1 | — |
| constant.other.php | #81a1c1 | — |
| constant.other.color | #ebcb8b | — |
| invalid, invalid.illegal | #ebcb8b | — |
| Keyword, Storage | — | italic |
| 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 | #7c91a2 | — |
| punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, entity.name.type.module.js | #ebcb8b | — |
| keyword.control.at-rule, punctuation.terminator.rule.css, keyword.control.operator, punctuation.definition.entity.css | #b48ead | — |
| keyword.control.import.python, keyword.control.import.include.php, keyword.control.if.php, keyword.control.flow.python | #ebca89 | — |
| keyword.operator.comparison.js, keyword.operator.assignment.js, keyword.operator.comparison.python, keyword.operator.assignment.python, punctuation.separator.comma.js, punctuation.definition.string.begin.js, punctuation.definition.string.end.js, punctuation.definition.binding-pattern.object.js | #ebcb8b | — |
| string.quoted.single.css, string.quoted.single.scss, string.quoted.single.sass, string.quoted.double.css, string.quoted.double.scss, string.quoted.double.sass | #b48ead | — |
| punctuation.definition | #ebcb8b | — |
| keyword.control | — | bold |
| comment.line.scss, comment.line.double-slash.js, comment.line.double-slash.php, comment.line.number-sign.python, comment.block.html, comment.block.css, comment.block.documentation.phpdoc.php | #d08670cc | — |
| punctuation.definition.comment.begin.css, punctuation.definition.comment.end.css, punctuation.definition.comment.scss, punctuation.definition.comment.js, punctuation.definition.comment.php, punctuation.definition.comment.phps, punctuation.definition.comment.html, punctuation.definition.comment.python | #5e81ac | — |
| text.html.derivative, text.html.php | #81a1c1 | — |
| entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter | #b48ead | — |
| entity.name.tag.html | — | bold |
| variable.parameter.js, variable.parameter.keyframe-list.css | #81a1c1 | — |
| string.other.link.title.markdown | #88c0d0 | |
| variable.other.readwrite.js, variable.other.property.js, variable.other.constant.js, variable.other.object.property.js | #88c0d0 | |
| variable.other.object.js | #d8dee9 | — |
| support.variable.property.js | #ebcb8b | — |
| storage.type.js | #b48ead | — |
| string, string.quoted.double.json, markup.fenced_code.block.markdown, markup.inline.raw.string.markdown, variable.function, keyword.other.special-method, 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 | #8fbcbb | — |
| string.quoted.double.html, string.quoted.single.html | #88c0d0 | — |
| entity.name.function | #81a1c1 | — |
| punctuation.definition.string.begin.html, punctuation.definition.string.end.html | #E9C8E9 | — |
| support.other.variable, string.other.link, markup.table | #d8dee9 | — |
| constant.numeric, constant.language, constant.character, constant.escape, keyword.other, punctuation.separator.key-value.html | #81a1c1 | — |
| variable.parameter.function.language.special, variable.parameter | #ebcb8b | — |
| constant.other.symbol, constant.other.key, entity.other.inherited-class, keyword.other.unit, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly, constant.other.object.key.js, string.unquoted.label.js | #ebcb8b | |
| 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 | #81a1c1 | — |
| support.type | #B2CCD6 | — |
| source.css support.type.property-name, source.python, 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 | #8fbcbb | — |
| meta.property-name.css | #d8dee9 | — |
| entity.name.module.js, variable.import.parameter.js, variable.other.class.js | #ebcb8b | — |
| entity.name.method.js, tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js | #b48ead | italic |
| entity.other.attribute-name, support.function, meta.attribute.python | #81a1c1 | — |
| 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, meta.object-literal.key | #8fbcbb | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.class.scss, entity.other.attribute-name.class.sass | #b48ead | — |
| support.constant.property-value.css, support.constant.property-value.scss, support.constant.property-value.sass | #a3be8c | — |
| keyword.control.conditional.js | #b48ead | — |
| string.quoted.single.js, string.quoted.double.js | #8fbcbb | — |
| storage.type.function.js, storage.type.function.python | #a3be8c | — |
| meta.function-call.generic.python, meta.function-call.python | #88c0d0 | — |
| source.scss keyword.control | #81a1c1 | — |
| markup.inserted | #3E97C1 | — |
| markup.deleted | #ebcb8b | — |
| markup.changed | #81a1c1 | — |
| string.regexp | #E9C8E9 | — |
| constant.character.escape | #E9C8E9 | — |
| *url*, *link*, *uri* | — | underline |
| source.js constant.other.object.key.js string.unquoted.label.js | #d8dee9 | italic |
| support.type.property-name.json | #d8dee9 | — |
| text.html.markdown, punctuation.definition.list_item.markdown | #d8dee9 | — |
| text.html.markdown markup.inline.raw.markdown | #81a1c1 | — |
| text.html.markdown markup.inline.raw.markdown, punctuation.definition.raw.markdown | #8fbcbb50 | — |
| 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 | #B6C9B9 | bold |
| markup.underline | #b48ead | underline |
| markup.strike | — | |
| markup.quote punctuation.definition.blockquote.markdown | #8fbcbb50 | — |
| markup.quote | — | italic |
| string.other.link.description.title.markdown | #81a1c1 | — |
| constant.other.reference.link.markdown | #81a1c1 | — |
| markup.raw.block | #81a1c1 | — |
| punctuation.definition.raw.markdown, punctuation.definition.markdown | #E9C8E9 | — |
| variable.language.fenced.markdown | #8fbcbb | — |
| meta.separator | #A7A8AF | bold |
| token.info-token | #8fbcbb | — |
| token.warn-token | #81a1c1 | — |
| token.error-token | #BE7179 | — |
| token.debug-token | #E9C8E9 | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...