Blue Moves Theme

Name: Blue Moves Theme
Author: 🧪 ovct 🧪

Publisher: 🧪 ovct 🧪Themes in package: 2

A theme designed to relax your eyes.

GitHub

Color themes

VS Code preview

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

Blue Moves Theme — Blue Moves

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#05162a
activityBar.border#111721
activityBar.foreground#8196b5
activityBar.inactiveForeground#576375AA
activityBarBadge.background#8196b5
activityBarBadge.foreground#05162a
badge.background#8196b5
badge.foreground#0c1f3c
breadcrumb.background#0c1f3c
breadcrumbPicker.background#0c1f3c
button.background#8196b575
button.foreground#a5abb3
button.hoverBackground#8196b590
button.secondaryBackground#8196b520
button.secondaryForeground#a5abb3
button.secondaryHoverBackground#8196b535
charts.blue#7096c2
charts.foreground#a5abb3
charts.green#51bd99
charts.lines#a5abb3
charts.orange#be9164
charts.purple#c08fd4
charts.red#be9164
charts.yellow#adb96e
checkbox.foreground#a5abb3
commandCenter.activeBackground#05162a60
commandCenter.activeForeground#ABB7C190
commandCenter.background#0c1f3c
commandCenter.border#111721
commandCenter.foreground#576375
contrastActiveBorder#00000000
contrastBorder#111721
dart.closingLabels#ABB7C1aa
debugExceptionWidget.background#05162a
debugExceptionWidget.border#111721
debugToolBar.background#05162a
descriptionForeground#a5abb3
diffEditor.border#111721
diffEditor.diagonalFill#11172180
diffEditor.insertedTextBackground#689c8b20
diffEditor.removedTextBackground#be916425
diffEditorGutter.insertedLineBackground#00000000
diffEditorGutter.removedLineBackground#00000000
dropdown.background#0c1f3c
dropdown.border#57637550
dropdown.foreground#a5abb3
dropdown.listBackground#0c1f3c
editor.background#0c1f3c
editor.findMatchBackground#8196b520
editor.findMatchBorder#8196b560
editor.findMatchHighlightBackground#8196b520
editor.findMatchHighlightBorder#8196b540
editor.foreground#a5abb3
editor.hoverHighlightBackground#8196b540
editor.inactiveSelectionBackground#8196b520
editor.lineHighlightBackground#8196b50c
editor.lineHighlightBorder#8196b51a
editor.rangeHighlightBackground#8196b520
editor.selectionBackground#8196b525
editor.selectionForeground#8196b5
editor.selectionHighlightBackground#00000000
editor.selectionHighlightBorder#8196b560
editor.wordHighlightBackground#8196b520
editor.wordHighlightStrongBackground#8196b540
editorBracketHighlight.foreground1#adb96e
editorBracketHighlight.foreground2#adb96e
editorBracketHighlight.foreground3#7096c2
editorBracketMatch.background#8196b520
editorBracketMatch.border#8196b540
editorCodeLens.foreground#a5abb3
editorCursor.background#8196b5
editorCursor.foreground#adb96e
editorError.border#00000000
editorError.foreground#be9164
editorGhostText.background#689c8b10
editorGhostText.border#00000000
editorGhostText.foreground#689c8b70
editorGroup.border#111721
editorGroup.dropBackground#8196b515
editorGroupHeader.border#00000000
editorGroupHeader.noTabsBackground#0c1f3c
editorGroupHeader.tabsBackground#05162a
editorGroupHeader.tabsBorder#111721
editorGutter.addedBackground#689c8bcc
editorGutter.background#0c1f3c
editorGutter.commentRangeForeground#05162a
editorGutter.deletedBackground#be9164cc
editorGutter.modifiedBackground#6e87a3cc
editorHoverWidget.background#05162a
editorHoverWidget.border#111721
editorIndentGuide.activeBackground#576375bb
editorIndentGuide.background#57637530
editorInlayHint.background#ABB7C120
editorInlayHint.foreground#ABB7C190
editorInlayHint.typeBackground#66618530
editorInlayHint.typeForeground#666185aa
editorLineNumber.activeForeground#576375
editorLineNumber.foreground#57637590
editorLink.activeForeground#a5abb3
editorMarkerNavigation.background#05162a
editorMarkerNavigationError.background#be916490
editorMarkerNavigationInfo.background#6e87a390
editorMarkerNavigationWarning.background#cf9e5790
editorOverviewRuler.border#111721
editorOverviewRuler.commonContentForeground#adb96e
editorOverviewRuler.currentContentForeground#be9164
editorOverviewRuler.incomingContentForeground#51bd99
editorRuler.foreground#11172140
editorSuggestWidget.background#0c1f3c
editorSuggestWidget.border#111721
editorSuggestWidget.foreground#ABB7C1
editorSuggestWidget.highlightForeground#adb96e
editorSuggestWidget.selectedBackground#8196b54d
editorWarning.foreground#adb96e
editorWhitespace.foreground#57637560
editorWidget.background#05162a
editorWidget.resizeBorder#8196b550
errorForeground#be9164
errorLens.errorForeground#be916499
errorLens.hintForeground#6e87a399
errorLens.infoForeground#6e87a399
errorLens.warningForeground#cf9e5799
extensionButton.prominentBackground#8196b59d
extensionButton.prominentForeground#05162a
extensionButton.prominentHoverBackground#8196b5
focusBorder#8196b540
foreground#ABB7C1AA
gitDecoration.conflictingResourceForeground#8196b5
gitDecoration.deletedResourceForeground#be9164
gitDecoration.ignoredResourceForeground#576375
gitDecoration.modifiedResourceForeground#7096c2
gitDecoration.untrackedResourceForeground#51bd99
icon.foreground#ABB7C1AA
input.background#00000000
input.border#57637550
input.foreground#a5abb3
input.placeholderForeground#a5abb360
inputOption.activeBorder#8196b5
inputValidation.errorBackground#05162a
inputValidation.errorBorder#adb96e
inputValidation.infoBackground#05162a
inputValidation.infoBorder#8196b5
inputValidation.warningBackground#05162a
inputValidation.warningBorder#adb96e
list.activeSelectionBackground#57637530
list.activeSelectionForeground#a5abb3
list.dropBackground#8196b515
list.errorForeground#be9164
list.focusBackground#8196b540
list.focusForeground#ABB7C1
list.highlightForeground#adb96e
list.hoverBackground#57637515
list.hoverForeground#a5abb3
list.inactiveSelectionBackground#57637530
list.warningForeground#cf9e57
menu.background#05162a
menu.border#111721
menu.foreground#ABB7C1
menu.selectionForeground#ABB7C1
menu.separatorBackground#111721
menubar.selectionBackground#05162a
menubar.selectionForeground#ABB7C1
merge.border#111721
merge.commonContentBackground#7a825130
merge.commonHeaderBackground#7a825180
merge.currentContentBackground#689c8b30
merge.currentHeaderBackground#689c8b80
merge.incomingContentBackground#6e87a330
merge.incomingHeaderBackground#6e87a380
notificationCenterHeader.background#05162a
notificationCenterHeader.foreground#a5abb3
notificationLink.foreground#adb96e
notifications.background#05162a
notifications.border#111721
notifications.foreground#ABB7C1
notificationsErrorIcon.foreground#be9164
notificationsInfoIcon.foreground#7096c2
notificationsWarningIcon.foreground#be9164
panel.background#0c1f3c
panel.border#111721
panelInput.border#576375
panelSection.border#111721
panelSectionHeader.background#57637520
panelSectionHeader.border#111721
panelSectionHeader.foreground#a5abb3
panelTitle.activeBorder#8196b5
panelTitle.activeForeground#8196b5
panelTitle.inactiveForeground#576375
peekView.border#8196b5
peekViewEditor.background#05162a40
peekViewEditor.matchHighlightBackground#05162a40
peekViewEditorGutter.background#05162a40
peekViewResult.background#05162a40
peekViewResult.fileForeground#a5abb3
peekViewResult.lineForeground#a5abb3
peekViewResult.matchHighlightBackground#05162a
peekViewResult.selectionBackground#05162a
peekViewResult.selectionForeground#a5abb3
peekViewTitle.background#111721
peekViewTitleDescription.foreground#a5abb3
peekViewTitleLabel.foreground#a5abb3
pickerGroup.border#111721
pickerGroup.foreground#a5abb3
progressBar.background#adb96e
sash.hoverBorder#8196b550
scrollbar.shadow#11172180
scrollbarSlider.activeBackground#8196b540
scrollbarSlider.background#8196b520
scrollbarSlider.hoverBackground#8196b530
selection.background#8196b560
settings.headerForeground#8196b5
settings.modifiedItemIndicator#8196b5
sideBar.background#05162a
sideBar.border#111721
sideBar.foreground#ABB7C1CC
sideBarSectionHeader.background#05162a
sideBarSectionHeader.border#111721
sideBarSectionHeader.foreground#a5abb3
sideBarTitle.foreground#576375
statusBar.background#05162a
statusBar.border#111721
statusBar.debuggingBackground#8196b544
statusBar.debuggingForeground#a5abb3
statusBar.foreground#ABB7C1BB
statusBar.noFolderBackground#111721
statusBar.noFolderBorder#8196b5
statusBar.noFolderForeground#a5abb3
statusBarItem.activeBackground#05162a
statusBarItem.errorBackground#be9164
statusBarItem.hoverBackground#57637530
statusBarItem.prominentBackground#111721
statusBarItem.prominentHoverBackground#05162a
tab.activeBackground#0c1f3c
tab.activeBorderTop#8196b5
tab.activeForeground#8196b5
tab.border#111721
tab.hoverBackground#0c1f3ccc
tab.hoverBorder#00000000
tab.inactiveBackground#05162a
tab.inactiveForeground#576375
tab.lastPinnedBorder#111721
tab.unfocusedActiveForeground#a5abb3
tab.unfocusedHoverBackground#8196b510
tab.unfocusedHoverBorder#00000000
tab.unfocusedInactiveForeground#a5abb3
terminal.ansiBlack#0c1f3c
terminal.ansiBlue#7096c2
terminal.ansiBrightBlack#7096c2
terminal.ansiBrightBlue#7096c2
terminal.ansiBrightCyan#51adbb
terminal.ansiBrightGreen#51bd99
terminal.ansiBrightMagenta#c08fd4
terminal.ansiBrightRed#be9164
terminal.ansiBrightWhite#a5abb3
terminal.ansiBrightYellow#adb96e
terminal.ansiCyan#51adbb
terminal.ansiGreen#51bd99
terminal.ansiMagenta#c08fd4
terminal.ansiRed#be9164
terminal.ansiWhite#a5abb3
terminal.ansiYellow#adb96e
terminal.background#0c1f3c
terminal.foreground#a5abb3
terminal.selectionForeground#a5abb3
terminalCursor.background#adb96e
terminalCursor.foreground#adb96e
textBlockQuote.background#6e87a334
textBlockQuote.border#6e87a3b9
textCodeBlock.background#6e87a334
textLink.activeForeground#7096c2
textLink.foreground#7096c2
textPreformat.foreground#adb96e
textSeparator.foreground#8196b5
titleBar.activeBackground#05162a
titleBar.activeForeground#576375
titleBar.border#111721
titleBar.inactiveBackground#111721
titleBar.inactiveForeground#576375
toolbar.hoverBackground#57637560
tree.indentGuidesStroke#57637570
walkThrough.embeddedEditorBackground#0c1f3c
widget.shadow#11172130

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
support.module.elm, entity.other.inherited-class.python, variable.other.object, support.other.namespace.php, entity.other.attribute-name.namespace.xml, record.accessor, entity.name.record.field.accessor, storage.modifier.import.java, storage.modifier.import.groovy, meta.import.swift entity.name.type.swift, entity.name.variable.parameter.cs, meta.member.access.python, variable.other.property.ts, variable.other.property.js, constant.language.symbol.elixir	#be9164	—
entity.name.type	#A4EF58	—
comment, punctuation.definition.comment, string.quoted.docstring.multi, comment.block.documentation source	#576375	italic
constant	#be9164	—
source, support, constant.character.entity.named, meta.jsx.children, source.lua, text.html.derivative	#ABB7C1	—
entity.name.function.decorator, meta.decorator entity.name.function, meta.decorator punctuation.decorator, punctuation.definition.decorator, meta.decorator variable.other.readwrite.ts	#c08fd4	—
keyword.control.export, support.type.object.module	#adb96e	—
support.function, entity.name.function, meta.function-call, meta.function, meta.method.declaration, meta.function-call support, meta.decorator meta.definition.method entity.name.function, meta.decorator meta.method.declaration entity.name.function, variable.language.super.ts, source.directive, meta.function-call.generic, meta.method-call.static.php, meta.method-call.php, meta.class storage.type, meta.method.groovy, meta.bracket.square.access, entity.name.function-call.elixir	#7096c2	—
keyword.control.import, meta.module.name.elm support, meta.import.elm support, keyword.control.at-rule, punctuation.definition.keyword, variable.control.import.include, keyword.other.import.java	#adb96e	—
keyword.control, keyword.control.conditional, storage.modifier, keyword.operator.new, keyword.operator.expression, keyword.begin.blade, keyword.end.blade, keyword.blade, keyword.type-alias, keyword.type, support.class.console, keyword.other.await, storage.type.class.jsdoc, punctuation.definition.block.tag.jsdoc, keyword.other.new, keyword.other.phpdoc, keyword.other.use.php, keyword.operator.logical.python, keyword.other.import.static.groovy, keyword.other.import.groovy, punctuation.definition.attribute.swift, source.svelte meta.scope.tag.main.svelte meta.tag.start.svelte variable.function.svelte, meta.directive.on.svelte entity.name.type.svelte, keyword.other.special-method.elixir	#adb96e	—
meta.object-literal.key, variable.object.property	#a5abb3	—
keyword.other.definition.ini, support.type.property-name, entity.name.tag.yaml	#adb96e	—
keyword.operator.comparison, storage.type.function.arrow, keyword.operator.lua, keyword.operator.assignment, keyword.operator.relational, keyword.operator.increment, keyword.operator.decrement, keyword.operator.logical, keyword.operator.arithmetic, keyword.operator.math	#adb96e	—
punctuation, attribute_value, meta.brace, punctuation.definition.parameters, punctuation.definition.template-expression, keyword.operator, keyword.other, punctuation.terminator, punctuation.separator, punctuation.definition.generic.begin, punctuation.definition.generic.end, meta.function.type-declaration, keyword.other.colon.elm, meta.record.field.elm keyword.other.elm, keyword.other.period.elm, meta.tag.xml, meta.tag.preprocessor.xml, punctuation.definition.block, punctuation.accessor, constant.name.attribute.tag.pug, string.interpolated.pug, keyword.other.whitespace.liquid, meta.tag.template.block.twig, meta.tag.template.value.twig, begin.bracket, end.bracket, text.html.twig meta.tag.inline.any, text.html.twig meta.tag.block.any, support.function.construct.begin.blade, support.function.construct.end.blade source.php, support.function.construct.end.blade, meta.function.echo.blade source.php, punctuation.definition.list.begin.python, punctuation.definition.list.end.python, text.html.vue-html meta.tag.block.any, entity.name.variable.tuple-element.cs, keyword.operator.assignment.tsx, meta.definition.method.signature.java, meta.class.body.groovy, meta.definition.method.groovy meta.method.body.java meta.declaration.assertion.groovy, punctuation.definition.list.begin.erlang, meta.expression.parenthesized, meta.definition.function.swift meta.parameter-clause.swift, source.swift meta.function-call.swift, punctuation.section.embedded.end.swift source.swift, source.lua, meta.function.lua, punctuation.definition.keyword.svelte, source.svelte meta.scope.tag.SpeakerPicture.svelte meta.tag.start.svelte entity.other.attribute-name.svelte, expression.embbeded.vue punctuation.definition.tag.begin.html.vue, expression.embbeded.vue punctuation.definition.tag.end.html.vue	#9690c0	—
variable.language.this, variable.language.special.self, variable.parameter.function.language.special.self, variable.language.this.php punctuation.definition.variable.php, meta.class.body.php storage.type.php, variable.parameter.function.swift entity.name.function.swift, variable.other.jsdoc	#be9164	—
storage, meta.var.expr storage.type, storage.type.function, keyword.function, storage.type.class, storage.type.property, keyword.other, keyword.local.lua, entity.name.class, meta.function.lua keyword.control.lua, storage.type.enum, storage.type.interface, storage.type.type, entity.name.type.class.java, support.class.php, entity.name.type.class.php, entity.other.inherited-class.php, entity.name.type.class.groovy, storage.type.rust , entity.name.type.class.swift, source.svelte meta.script.svelte source.ts entity.name.label.ts, meta.directive.on.svelte keyword.control.svelte	#51adbb	—
string, string.template, string.quoted.single, punctuation.definition.string, punctuation.definition.string.template, punctuation.definition.string.begin, punctuation.definition.string.end.html source.js-ignored-vscode, punctuation.definition.string.end, string.other.link, constant.character.escape.regexp, variable.parameter.url, constant.other.symbol.quoted.single.erlang, constant.other.symbol.quoted.single.erlang punctuation.definition.symbol.begin.erlang, constant.other.symbol.quoted.single.erlang punctuation.definition.symbol.end.erlang, meta.import.ts punctuation.definition.variable.svelte, punctuation.definition.string.end.html source.css-ignored-vscode	#51bd99	—
string.quoted.docstring.multi.python, string.quoted.double.block.python punctuation.definition.string.end.python, string.quoted.double.block.python punctuation.definition.string.begin.python, string.quoted.double.block.python	#689c8b60	—
support.type, entity.other.inherited-class, keyword.type, storage.type.java, storage.type.primitive.java, storage.type.generic.java, keyword.other.type, punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php source.php, punctuation.section.embedded.end.php, storage.type.object.array.java, storage.type.primitive.groovy, storage.type.groovy, meta.definition.type.body.swift meta.function-call.swift, meta.definition.type.class.swift meta.inheritance-clause.swift, variable.other.constant.elixir, entity.name.type, support.class	#9690c0	—
variable, variable.language, entity.name.type.class.js, entity.name.variable, support.variable.magic, meta.method.body, entity.name.variable, punctuation.definition.variable, meta.class variable.object.property, variable.other.constant entity.name.function, entity.name.variable.tuple-element.cs punctuation.separator.colon.cs, meta.definition.variable.name.groovy, meta.body.struct.cpp, parameter.variable.function.elixir	#d38098	—
source.elm constant.type-constructor	#d38098	—
source.elm storage.type	#adb96e	normal
entity.name.tag.other.html, meta.tag.other.html punctuation.definition.tag.end.html, meta.tag.other.html punctuation.definition.tag.begin.html, entity.name.tag support.class.component, support.class.component.html	#7096c2	—
support.variable.liquid, support.class.liquid	#d38098	—
text.html.basic entity.name, source.js-ignored-vscode, entity.name.tag, meta.embedded.block.blade constant.other.php, meta.embedded.block.blade keyword.operator.comparison.php, meta.embedded.block.blade keyword.operator.arithmetic.php, meta.tag.start.svelte keyword.control.svelte, meta.tag.end.svelte keyword.control.svelte	#7096c2	—
meta.tag.sgml.doctype.html, punctuation.definition.tag, meta.tag.block.any, meta.tag.block.any.html, meta.tag.inline.any, source.css-ignored-vscode, meta.tag.metadata.style.end.html, text.html.vue invalid.illegal.character-not-allowed-here.html, meta.tag.inline.i.start.html, meta.tag.structure.div.start.html, punctuation.definition.tag.end.html.vue, invalid.illegal.character-not-allowed-here.html	#6e87a3aa	—
entity.other.attribute-name, entity.name.tag.liquid, invalid.deprecated.entity.other.attribute-name, meta.embedded.block.blade storage.type.php	#adb96e	—
markup.inline.raw.string.markdown, punctuation.definition.raw.markdown, markup.fenced_code.block.markdown, markup.fenced_code.block.markdown punctuation, markup.raw.block.markdown	#adb96e	—
fenced_code.block.language	#adb96e	—
punctuation.definition.list.begin	#7096c2	—
punctuation.definition.list.begin	#7096c2	—
entity.name.section, markup.heading.setext	#adb96e	—
punctuation.definition.heading	#adb96e	—
markup.underline.link, markup.underline.link.image	#7096c2	—
markup.bold, punctuation.definition.bold	#d38098	bold
markup.strikethrough, punctuation.definition.strikethrough	#be9164	—
markup.italic, punctuation.definition.italic	#be9164	italic
markup.quote, markup.quote.markdown punctuation.definition.quote.begin	#c08fd4	—
punctuation.definition.quote.begin	#7096c2	—
meta.embedded.block.frontmatter punctuation.definition.tag.begin, meta.embedded.block.frontmatter punctuation.definition.tag.end, meta.embedded.block.frontmatter string.unquoted.plain.out	#576375	italic
entity.other.attribute-name.pseudo-class	#c08fd4	—
entity.other.attribute-name.pseudo-element	#c08fd4	—
entity.other.attribute-name.class, entity.other.attribute-name.class punctuation.definition.entity	#51adbb	—
entity.other.attribute-name.parent-selector-suffix punctuation.definition.entity	#51adbb	—
support.type.property-name.css, support.type.vendored.property-name, meta.property-list entity.name.tag.css, meta.property-list.scss meta.property-list.scss entity.name.tag.css, meta.property-list meta.property-name, source.css.scss meta.property-list.scss entity.name.tag.css	#a5abb3	—
source.css.scss entity.other.attribute-name.id , source.css entity.other.attribute-name.id , entity.other.attribute-name.id punctuation.definition.entity	#adb96e	—
entity.name.tag.reference, meta.property-list	#be9164	—
keyword.other.unit	#be9164	—
support.constant.property-value, support.constant.font-name, meta.property-value.css, meta.attribute.style.html	#be9164	—
constant.numeric	#be9164	—
entity.name.tag.css, meta.property-list.scss entity.name.tag.css	#7096c2	—

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