ICE CUBE 🧊

Name: ICE CUBE 🧊
Author: ncfrak

Publisher: ncfrakThemes in package: 2

VS Code them for my frozen community 🧊

GitHub

Color themes

VS Code preview

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

ICE CUBE 🧊 — ICE CUBE light

fetchUser.ts

index.ts

README.md

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Light+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBorder#18e8d5b3
activityBar.background#FFFEF9
activityBar.border#6b7d8f1f
activityBar.foreground#8a9199cc
activityBar.inactiveForeground#8a919999
activityBarBadge.background#18e8d5
activityBarBadge.foreground#FFFEF7
badge.background#18e8d533
badge.foreground#C46E6E
button.background#18e8d5
button.foreground#FFFEF7
button.hoverBackground#0FF3E0
button.secondaryBackground#8a919933
button.secondaryForeground#5C6166
button.secondaryHoverBackground#8a919980
debugConsoleInputIcon.foreground#18e8d5
debugExceptionWidget.background#f3f4f5
debugExceptionWidget.border#6b7d8f1f
debugIcon.breakpointDisabledForeground#C46E6E80
debugIcon.breakpointForeground#C46E6E
debugToolBar.background#f3f4f5
descriptionForeground#8a9199
diffEditor.diagonalFill#6b7d8f1f
diffEditor.insertedTextBackground#6cbf431f
diffEditor.removedTextBackground#ff73831f
dropdown.background#FFFEF9
dropdown.border#8a919945
dropdown.foreground#8a9199
editor.background#FFFEF9
editor.findMatchBackground#9f40ff2b
editor.findMatchBorder#9f40ff2b
editor.findMatchHighlightBackground#22D37D40
editor.findMatchHighlightBorder#22D37D
editor.findRangeHighlightBackground#9f40ff40
editor.foreground#5C6166
editor.inactiveSelectionBackground#035bd612
editor.lineHighlightBackground#8a91991a
editor.rangeHighlightBackground#9f40ff33
editor.selectionBackground#035bd626
editor.selectionHighlightBackground#6cbf4326
editor.selectionHighlightBorder#6cbf4300
editor.snippetTabstopHighlightBackground#6cbf4333
editor.wordHighlightBackground#478acc14
editor.wordHighlightBorder#478acc80
editor.wordHighlightStrongBackground#6cbf4314
editor.wordHighlightStrongBorder#6cbf4380
editorBracketMatch.background#8a91994d
editorBracketMatch.border#8a91994d
editorCodeLens.foreground#787b8099
editorCursor.foreground#18e8d5
editorError.foreground#e65050
editorGroup.border#6b7d8f1f
editorGroupHeader.noTabsBackground#FFFEF7
editorGroupHeader.tabsBackground#FFFEF7
editorGroupHeader.tabsBorder#6b7d8f1f
editorGutter.addedBackground#6cbf43cc
editorGutter.deletedBackground#ff7383cc
editorGutter.modifiedBackground#478acccc
editorHoverWidget.background#FFFEF7
editorHoverWidget.border#6b7d8f1f
editorIndentGuide.activeBackground1#8a919959
editorIndentGuide.background1#8a91992e
editorLineNumber.activeForeground#8a9199cc
editorLineNumber.foreground#8a919966
editorLink.activeForeground#18e8d5
editorMarkerNavigation.background#f3f4f5
editorOverviewRuler.addedForeground#6cbf43
editorOverviewRuler.border#6b7d8f1f
editorOverviewRuler.bracketMatchForeground#8a9199b3
editorOverviewRuler.deletedForeground#ff7383
editorOverviewRuler.errorForeground#e65050
editorOverviewRuler.findMatchForeground#9f40ff2b
editorOverviewRuler.modifiedForeground#478acc
editorOverviewRuler.warningForeground#18e8d5
editorOverviewRuler.wordHighlightForeground#478acc66
editorOverviewRuler.wordHighlightStrongForeground#6cbf4366
editorRuler.foreground#8a91992e
editorSuggestWidget.background#f3f4f5
editorSuggestWidget.border#6b7d8f1f
editorSuggestWidget.highlightForeground#18e8d5
editorSuggestWidget.selectedBackground#56728f1f
editorWarning.foreground#18e8d5
editorWhitespace.foreground#8a919966
editorWidget.background#FFFEF7
editorWidget.border#6b7d8f1f
errorForeground#e65050
extensionButton.prominentBackground#18e8d5
extensionButton.prominentForeground#FFFEF9
extensionButton.prominentHoverBackground#0FF3E0
focusBorder#18e8d5b3
foreground#8a9199
gitDecoration.conflictingResourceForeground
gitDecoration.deletedResourceForeground#ff7383b3
gitDecoration.ignoredResourceForeground#8a919980
gitDecoration.modifiedResourceForeground#478accb3
gitDecoration.submoduleResourceForeground#ff33dab3
gitDecoration.untrackedResourceForeground#6cbf43b3
icon.foreground#8a9199
input.background#FFFEF9
input.border#8a919945
input.foreground#5C6166
input.placeholderForeground#8a919980
inputOption.activeBackground#18e8d533
inputOption.activeBorder#16DFCE4d
inputOption.activeForeground#16DFCE
inputValidation.errorBackground#FFFEF9
inputValidation.errorBorder#e65050
inputValidation.infoBackground#FFFEF7
inputValidation.infoBorder#0B81AD
inputValidation.warningBackground#FFFEF7
inputValidation.warningBorder#14CCBD
keybindingLabel.background#8a91991a
keybindingLabel.border#5C61661a
keybindingLabel.bottomBorder#5C61661a
keybindingLabel.foreground#5C6166
list.activeSelectionBackground#56728f1f
list.activeSelectionForeground#5C6166
list.deemphasizedForeground#e65050
list.errorForeground#e65050
list.filterMatchBackground#8f30efcc
list.filterMatchBorder#9f40ffcc
list.focusBackground#56728f1f
list.focusForeground#5C6166
list.focusOutline#56728f1f
list.highlightForeground#18e8d5
list.hoverBackground#56728f1f
list.inactiveSelectionBackground#6b7d8f1f
list.inactiveSelectionForeground#8a9199
list.invalidItemForeground#8a91994d
listFilterWidget.background#f3f4f5
listFilterWidget.noMatchesOutline#e65050
listFilterWidget.outline#18e8d5
minimap.background#FFFEF9
minimap.errorHighlight#e65050
minimap.findMatchHighlight#9f40ff2b
minimap.selectionHighlight#035bd626
minimapGutter.addedBackground#6cbf43
minimapGutter.deletedBackground#ff7383
minimapGutter.modifiedBackground#478acc
panel.background#FFFEF7
panel.border#6b7d8f1f
panelTitle.activeBorder#18e8d5
panelTitle.activeForeground#5C6166
panelTitle.inactiveForeground#8a9199
peekView.border#56728f1f
peekViewEditor.background#FFFEF7
peekViewEditor.matchHighlightBackground#9f40ffcc
peekViewEditor.matchHighlightBorder#8f30efcc
peekViewResult.background#FFFEF7
peekViewResult.fileForeground#5C6166
peekViewResult.lineForeground#8a9199
peekViewResult.matchHighlightBackground#9f40ffcc
peekViewResult.selectionBackground#56728f1f
peekViewTitle.background#56728f1f
peekViewTitleDescription.foreground#8a9199
peekViewTitleLabel.foreground#5C6166
pickerGroup.border#6b7d8f1f
pickerGroup.foreground#8a919980
progressBar.background#18e8d5
scrollbar.shadow#18e8d5
scrollbarSlider.activeBackground#18e8d5b3
scrollbarSlider.background#18e8d566
scrollbarSlider.hoverBackground#18e8d599
selection.background#035bd626
settings.headerForeground#5C6166
settings.modifiedItemIndicator#478acc
sideBar.background#FFFEF7
sideBar.border#6b7d8f1f
sideBarSectionHeader.background#FFFEF7
sideBarSectionHeader.border#6b7d8f1f
sideBarSectionHeader.foreground#8a9199
sideBarTitle.foreground#8a9199
statusBar.background#FFFEF7
statusBar.border#6b7d8f1f
statusBar.debuggingBackground#C46E6E
statusBar.debuggingForeground#FFFEF9
statusBar.foreground#1E17E8
statusBar.noFolderBackground#FFFEF7
statusBar.noFolderForeground#1E17E8
statusBarItem.activeBackground#8a919933
statusBarItem.hoverBackground#8a919933
statusBarItem.prominentBackground#6b7d8f1f
statusBarItem.prominentHoverBackground#00000030
statusBarItem.remoteBackground#18e8d5
statusBarItem.remoteForeground#000
tab.activeBackground#FFFEF9
tab.activeBorder#FFFEF9
tab.activeBorderTop#18e8d5
tab.activeForeground#5C6166
tab.border#6b7d8f1f
tab.inactiveBackground#FFFEF7
tab.inactiveForeground#8a9199
tab.unfocusedActiveBorderTop#8a9199
tab.unfocusedActiveForeground#8a9199
tab.unfocusedInactiveForeground#8a9199
terminal.ansiBlack#000000
terminal.ansiBlue#0095ff
terminal.ansiBrightBlack#686868
terminal.ansiBrightBlue#0B00E0
terminal.ansiBrightCyan#18e8d5
terminal.ansiBrightGreen#02ce9e
terminal.ansiBrightMagenta#FF33DA
terminal.ansiBrightRed#f07171
terminal.ansiBrightWhite#d1d1d1
terminal.ansiBrightYellow#ECC846
terminal.ansiCyan#46ba94
terminal.ansiGreen#4fbf43
terminal.ansiMagenta#9e75c7
terminal.ansiRed#ff1414
terminal.ansiWhite#c7c7c7
terminal.ansiYellow#ffa012
terminal.background#FFFEF7
terminal.foreground#5C6166
textBlockQuote.background#f3f4f5
textLink.activeForeground#18e8d5
textLink.foreground#18e8d5
textPreformat.foreground#5C6166
titleBar.activeBackground#FFFEF7
titleBar.activeForeground#5C6166
titleBar.border#6b7d8f1f
titleBar.inactiveBackground#FFFEF7
titleBar.inactiveForeground#8a9199
tree.indentGuidesStroke#8a919959
walkThrough.embeddedEditorBackground#f3f4f5
welcomePage.progress.background#8a91991a
welcomePage.tileBackground#FFFEF7
widget.shadow#00000026

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
—	#5C6166	—
comment	#787b8099	italic
string.regexp, constant.character, constant.other, text.html.markdown markup.inline.raw, punctuation.accessor	#C46E6E	—
support.constant, markup.quote	#C46E6E	italic
constant.numeric	#E32643	—
constant.language	#03B591	—
variable.language	#03B591	italic
variable, variable.parameter.function-call, punctuation.section, punctuation.separator, punctuation.terminator, meta.embedded	#5C6166	—
variable.member	#f07171	—
keyword, storage, support.class.component, variable.parameter, meta.parameter	#470FF4	—
source.java storage.type, source.haskell storage.type, source.c storage.type, storage.type.js	#3208AF	—
entity.name.type.class	#3208AF	bold
meta.decorator.js, entity.name.section.markdown, markup.heading.markdown	#3208AFaa	—
variable.other.constant.object.js, variable.other.object.js, keyword.operator	#050066	—
entity.name.function	#0ea1d6	—
support.function, support.macro	#f07171	—
invalid	#e65050	—
source.ruby variable.other.readwrite, variable.function, variable.annotation, meta.function-call.generic, support.function.go, markup.list punctuation.definition.list.begin	#14CCBD	—
source.css entity.name.tag, source.sass entity.name.tag, source.scss entity.name.tag, source.less entity.name.tag, source.stylus entity.name.tag, meta.decorator variable.other, meta.decorator punctuation.decorator, storage.type.annotation, entity.name, entity.name.import, entity.name.package, string, constant.other.symbol, markup.inline.raw.string.markdown, markup.fenced_code.block.markdown, entity.name.filename.find-in-files, meta.diff, meta.diff.header	#B77B9F	—
markup.heading, markup.heading entity.name	#B77B9F	bold
source.css support.type, source.sass support.type, source.scss support.type, source.less support.type, source.stylus support.type, constant.numeric.line-number.find-in-files - match	#787b8099	—
support.type.property-name, constant.numeric.line-number.match, markup.underline.link, string.other.link, markup.bold.markdown, markup.table, punctuation.definition.template-expression, support.type, support.class, source.go storage.type, entity.other.attribute-name, entity.name.tag, meta.tag.sgml, storage.type.function, source.java storage.type.primitive, entity.other.inherited-class, punctuation.section.embedded, variable.other.property.js, punctuation.definition.tag.end, punctuation.definition.tag.begin, punctuation.definition.tag	#0B81AD	—
message.error	#e65050	—
markup.italic	#f07171	italic
markup.bold	#f07171	bold
markup.italic markup.bold, markup.bold markup.italic	—	bold italic
meta.separator	#787b8099	bold
markup.inserted	#6cbf43	—
markup.changed	#478acc	—
markup.deleted	#ff7383	—
markup.strike	#e6ba7e	—
text.html.markdown meta.dummy.line-break	#787b8099	—
punctuation.definition.markdown	#787b8099	—

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}!`;
}