Dark Frost

Name: Dark Frost
Author: Sandrico Provo

Publisher: Sandrico ProvoThemes in package: 2

A theme inspired by the colours of Atlantic Canada in the winter.

Open in VS Code GitHub

Color themes

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

Dark Frost — Dark Frost Atlantic Midnight

fetchUser.ts

index.ts

README.md

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#272629
activityBar.border#272629
activityBar.foreground#ddd
activityBarBadge.background#64B5F6
activityBarBadge.foreground#000
badge.background#64B5F6
badge.foreground#000
breadcrumb.activeSelectionForeground#ddd
breadcrumb.background#272629
breadcrumb.focusForeground#bfc7d5
breadcrumb.foreground#ddd
breadcrumbPicker.background#2b3545
button.background#738fbacc
button.foreground#ddd
button.hoverBackground#738fba
contrastBorder#282B3C
debugExceptionWidget.background#292D3E
debugExceptionWidget.border#738fba
debugToolBar.background#272629
diffEditor.insertedTextBackground#99b76d23
diffEditor.insertedTextBorder#a9c77d33
diffEditor.removedTextBackground#ef535033
diffEditor.removedTextBorder#ef53504d
dropdown.background#272629
dropdown.border#272629
dropdown.foreground#ddd
dropdown.listBackground#344053
editor.background#272629
editor.findMatchBackground#3440535a
editor.findMatchHighlightBackground#34405366
editor.findRangeHighlightBackground#272629cc
editor.foreground#ddd
editor.hoverHighlightBackground#41516988
editor.inactiveSelectionBackground#738fba5a
editor.lineHighlightBackground#0003
editor.lineHighlightBorder#272629
editor.rangeHighlightBackground#738fba66
editor.selectionBackground#7580B850
editor.selectionHighlightBackground#383D51
editor.wordHighlightBackground#32374D
editor.wordHighlightStrongBackground#2E3250
editorBracketMatch.background#272629
editorBracketMatch.border#272629
editorCodeLens.foreground#FFCA28
editorCursor.foreground#FFC857
editorError.border#ff0000
editorError.foreground#EF5350
editorGroup.border#272629
editorGroup.dropBackground#7e57c273
editorGroupHeader.noTabsBackground#32374C
editorGroupHeader.tabsBackground#272629
editorGroupHeader.tabsBorder#262A39
editorGutter.addedBackground#9CCC65
editorGutter.background#272629
editorGutter.deletedBackground#EF5350
editorGutter.modifiedBackground#e2b93d
editorHoverWidget.background#272629
editorHoverWidget.border#738fba
editorIndentGuide.background#272629
editorLineNumber.activeForeground#eeffff
editorLineNumber.foreground#dddddd30
editorLink.activeForeground#ddd
editorMarkerNavigation.background#31364a
editorMarkerNavigationError.background#EF5350
editorMarkerNavigationWarning.background#FFCA28
editorOverviewRuler.commonContentForeground#ddd
editorOverviewRuler.currentContentForeground#ddd
editorOverviewRuler.incomingContentForeground#ddd
editorRuler.foreground#ddd
editorSuggestWidget.background#2C3043
editorSuggestWidget.border#738fba
editorSuggestWidget.foreground#ddd
editorSuggestWidget.highlightForeground#ffffff
editorSuggestWidget.selectedBackground#415169
editorWarning.border#ff0000
editorWarning.foreground#FFCA28
editorWhitespace.foreground#dddddd20
editorWidget.background#272629
editorWidget.border#272629
errorForeground#EF5350
extensionButton.prominentBackground#9dc4ffcc
extensionButton.prominentForeground#ddd
extensionButton.prominentHoverBackground#344053
focusBorder#282B3C
foreground#ddd
gitDecoration.conflictingResourceForeground#FFEB95CC
gitDecoration.deletedResourceForeground#EF535090
gitDecoration.ignoredResourceForeground#69709890
gitDecoration.modifiedResourceForeground#FFC857e6
gitDecoration.untrackedResourceForeground#a9c77dff
input.background#344053
input.border#272629
input.foreground#ddd
input.placeholderForeground#ddd
inputOption.activeBorder#ddd
inputValidation.errorBackground#901e2d
inputValidation.errorBorder#901e2d
inputValidation.infoBackground#64b5f6f2
inputValidation.infoBorder#64B5F6
inputValidation.warningBackground#ba9240f2
inputValidation.warningBorder#ba9240
list.activeSelectionBackground#415169aa
list.activeSelectionForeground#ffffff
list.dropBackground#2E3245
list.focusBackground#415169
list.focusForeground#ffffff
list.highlightForeground#ffffff
list.hoverBackground#344053aa
list.hoverForeground#ffffff
list.inactiveSelectionBackground#929ac90d
list.inactiveSelectionForeground#929ac9
merge.currentContentBackground#272629
merge.currentHeaderBackground#3440535a
merge.incomingHeaderBackground#3440535a
notificationLink.foreground#9dc4ff
notifications.background#344053
notifications.foreground#ddd
panel.background#272629
panel.border#272629
panelTitle.activeBorder#738fba
panelTitle.activeForeground#ddd
panelTitle.inactiveForeground#bfc7d580
peekView.border#738fba
peekViewEditor.background#272629
peekViewEditor.matchHighlightBackground#ae9dcc5a
peekViewResult.background#272629
peekViewResult.fileForeground#ddd
peekViewResult.lineForeground#ddd
peekViewResult.matchHighlightBackground#3440535a
peekViewResult.selectionBackground#2E3250
peekViewResult.selectionForeground#ddd
peekViewTitle.background#292D3E
peekViewTitleDescription.foreground#ddd
peekViewTitleLabel.foreground#ddd
pickerGroup.border#272629
pickerGroup.foreground#ddd
progressBar.background#9dc4ff
quickInput.background#272629
scrollbar.shadow#292D3E00
scrollbarSlider.activeBackground#738fba
scrollbarSlider.background#738fba20
scrollbarSlider.hoverBackground#738fba80
selection.background#9dc4ff
settings.dropdownBorder#272629
settings.modifiedItemIndicator#9dc4ff
sideBar.background#272629
sideBar.border#272629
sideBar.foreground#ddd
sideBarSectionHeader.background#272629
sideBarSectionHeader.foreground#dddddd50
sideBarTitle.foreground#ddd
statusBar.background#272629
statusBar.debuggingBackground#738fba
statusBar.debuggingForeground#ddd
statusBar.foreground#ddd
statusBar.noFolderBackground#292D3E
statusBarItem.activeBackground#202431
statusBarItem.hoverBackground#333742
statusBarItem.prominentBackground#202431
statusBarItem.prominentHoverBackground#202431
tab.activeBackground#272629
tab.activeBorder#738fba
tab.activeForeground#ddd
tab.border#272629
tab.hoverBackground#344053
tab.inactiveBackground#272629
tab.inactiveForeground#ddd
tab.unfocusedActiveBorder#272629
terminal.ansiBlack#676E95
terminal.ansiBlue#82AAFF
terminal.ansiBrightBlack#676E95
terminal.ansiBrightBlue#82AAFF
terminal.ansiBrightCyan#89DDFF
terminal.ansiBrightGreen#C3E88D
terminal.ansiBrightMagenta#C792EA
terminal.ansiBrightRed#ff5572
terminal.ansiBrightWhite#ffffff
terminal.ansiBrightYellow#FFCB6B
terminal.ansiCyan#89DDFF
terminal.ansiGreen#a9c77d
terminal.ansiMagenta#C792EA
terminal.ansiRed#ff5572
terminal.ansiWhite#ffffff
terminal.ansiYellow#FFCB6B
titleBar.activeBackground#30364c
titleBar.activeForeground#ddd
walkThrough.embeddedEditorBackground#232635
widget.shadow#272629

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment, string.quoted.docstring	#aaaaaa80	italic
variable, string constant.other.placeholder	#ddd	—
constant.other.php	#FFCB6B	—
constant.other.color	#ffffff	—
invalid, invalid.illegal	#FF5370	—
invalid.deprecated	#d597f2	—
keyword, storage.type, storage.modifier	#9dc4ff	—
Keyword, Storage	—	italic
keyword.control, constant.other.color, punctuation.definition.tag, punctuation, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution	#98e7fc	—
punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html	#9dc4ff	—
keyword.control	—	italic
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter	#ef586c	—
entity.name.function, variable.function, support.function, keyword.other.special-method	#d597f2	—
source.cpp meta.block variable.other	#f07178	—
variable.other.constant	#ddd	—
support.type.property-name.css	#d0ddef	—
support.other.variable, string.other.link	#f07178	—
constant.numeric, constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, support.function.gradient.css, keyword.other	#e98c6e	—
constant.language.null.js	#e9724c	—
variable.parameter.function.language.special, variable.parameter	#ffc142	—
string, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js	#b4e47d	—
entity.name, support.type, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types	#ffc142	—
support.type	#B2CCD6	—
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	#B2CCD6	—
entity.name.module.js, variable.import.parameter.js, variable.other.class.js	#FF5370	—
variable.language	#ef586c	italic
entity.name.method.js	#82AAFF	italic
meta.class-method.js entity.name.function.js, variable.function.constructor	#82AAFF	—
entity.other.attribute-name	#ffc857	italic
entity.other.attribute-name.class	#FFCB6B	—
source.sass keyword.control	#82AAFF	—
markup.inserted	#C3E88D	—
markup.deleted	#FF5370	—
markup.changed	#d597f2	—
string.regexp	#89DDFF	—
constant.character.escape	#89DDFF	—
url, link, uri	—	underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js	#82AAFF	italic
punctuation.definition.entity.css	#9dc4ff	italic
source.js constant.other.object.key.js string.unquoted.label.js	#FF5370	italic
source.json meta.structure.dictionary.json support.type.property-name.json	#d597f2	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#FFCB6B	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#F78C6C	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#FF5370	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#C17E70	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#82AAFF	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#f07178	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#d597f2	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#C3E88D	—
text.html.markdown, punctuation.definition.list_item.markdown	#A6ACCD	—
text.html.markdown markup.inline.raw.markdown	#d597f2	—
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown	#4E5579	—
text.html.markdown meta.dummy.line-break	—	—
markdown.heading, markup.heading \| markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown	#C3E88D	—
markup.italic	#f07178	italic
markup.bold, markup.bold string	#f07178	bold
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string	#f07178	bold
markup.underline	#F78C6C	underline
markup.strike	—	italic
markup.quote punctuation.definition.blockquote.markdown	#4E5579	—
markup.quote	—	italic
string.other.link.title.markdown	#82AAFF	—
string.other.link.description.title.markdown	#d597f2	—
constant.other.reference.link.markdown	#FFCB6B	—
markup.raw.block	#d597f2	—
markup.fenced_code.block.markdown, markup.inline.raw.string.markdown	#A6ACCD90	—
variable.language.fenced.markdown	#4E5579	—
meta.separator	#4E5579	bold
markup.table	#A6ACCD	—

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

export interface User {
  id: string;
  name: string;
  role: "admin" | "member";
  tags: string[];
}

/**
 * Fetch user data by ID
 * @param id  
 * @returns User object or null if ID is invalid
 */
export async function fetchUser(id: string): Promise<User | null> {
  if (!id) {
    return null;
  }

  const response = await fetch(`/api/users/${id}`, {
    method: "GET",
    headers: { Accept: "application/json" },
  });

  if (!response.ok) {
    throw new Error(`HTTP ${response.status}`);
  }

  return (await response.json()) as User;
}

function greet(user: User): string {
  // Simple greeting function that uses the user's name
  return `Hello, ${user.name}!`;
}