Correia Dark

Name: Correia Dark
Author: Correia Dark

Publisher: Correia DarkThemes in package: 9

Dark theme

GitHub

Color themes

VS Code preview

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

Correia Dark — Correia Dark 3

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

Problems1

Output

Debug Console

Terminal

Ports

~/my-project $ pnpm dev
▲ Next.js ready on http://localhost:3000
✓ compiled client and server successfully in 412ms
wait - compiling /theme/vscode...
~/my-project

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBorder#ec775c
activityBar.background#22272e
activityBar.border#444c56
activityBar.foreground#adbac7
activityBar.inactiveForeground#768390
activityBarBadge.background#316dca
activityBarBadge.foreground#cdd9e5
badge.background#316dca
badge.foreground#cdd9e5
breadcrumb.activeSelectionForeground#768390
breadcrumb.focusForeground#adbac7
breadcrumb.foreground#768390
breadcrumbPicker.background#2d333b
button.background#347d39
button.foreground#ffffff
button.hoverBackground#46954a
button.secondaryBackground#3d444d
button.secondaryForeground#adbac7
button.secondaryHoverBackground#444c56
checkbox.background#2d333b
checkbox.border#444c56
debugToolBar.background#2d333b
descriptionForeground#768390
diffEditor.insertedTextBackground#46954a26
diffEditor.removedTextBackground#e5534b26
dropdown.background#2d333b
dropdown.border#444c56
dropdown.foreground#adbac7
dropdown.listBackground#2d333b
editor.background#22272e
editor.findMatchBackground#966600
editor.findMatchHighlightBackground#eac55f80
editor.focusedStackFrameHighlightBackground#46954a66
editor.foldBackground#636e7b1a
editor.foreground#adbac7
editor.inactiveSelectionBackground#539bf512
editor.lineHighlightBackground#636e7b1a
editor.linkedEditingBackground#539bf512
editor.selectionBackground#539bf533
editor.selectionHighlightBackground#57ab5a40
editor.stackFrameHighlightBackground#ae7c1466
editor.wordHighlightBackground#636e7b80
editor.wordHighlightBorder#636e7b99
editor.wordHighlightStrongBackground#636e7b4d
editor.wordHighlightStrongBorder#636e7b99
editorBracketMatch.background#57ab5a40
editorBracketMatch.border#57ab5a99
editorCursor.foreground#539bf5
editorGroup.border#444c56
editorGroupHeader.tabsBackground#1c2128
editorGroupHeader.tabsBorder#444c56
editorGutter.addedBackground#46954a66
editorGutter.deletedBackground#e5534b66
editorGutter.modifiedBackground#ae7c1466
editorIndentGuide.activeBackground#444c56
editorIndentGuide.background#373e47
editorLineNumber.activeForeground#adbac7
editorLineNumber.foreground#768390
editorOverviewRuler.border#1c2128
editorWhitespace.foreground#545d68
editorWidget.background#2d333b
errorForeground#e5534b
focusBorder#316dca
foreground#adbac7
gitDecoration.addedResourceForeground#57ab5a
gitDecoration.conflictingResourceForeground#cc6b2c
gitDecoration.deletedResourceForeground#e5534b
gitDecoration.ignoredResourceForeground#545d68
gitDecoration.modifiedResourceForeground#c69026
gitDecoration.submoduleResourceForeground#768390
gitDecoration.untrackedResourceForeground#57ab5a
input.background#22272e
input.border#444c56
input.foreground#adbac7
input.placeholderForeground#545d68
list.activeSelectionBackground#636e7b66
list.activeSelectionForeground#adbac7
list.focusBackground#4184e426
list.focusForeground#adbac7
list.highlightForeground#539bf5
list.hoverBackground#636e7b1a
list.hoverForeground#adbac7
list.inactiveFocusBackground#4184e426
list.inactiveSelectionBackground#636e7b66
list.inactiveSelectionForeground#adbac7
notificationCenterHeader.background#2d333b
notificationCenterHeader.foreground#768390
notifications.background#2d333b
notifications.border#444c56
notifications.foreground#adbac7
notificationsErrorIcon.foreground#e5534b
notificationsInfoIcon.foreground#539bf5
notificationsWarningIcon.foreground#c69026
panel.background#1c2128
panel.border#444c56
panelInput.border#444c56
panelTitle.activeBorder#ec775c
panelTitle.activeForeground#adbac7
panelTitle.inactiveForeground#768390
peekViewEditor.background#636e7b1a
peekViewEditor.matchHighlightBackground#ae7c1466
peekViewResult.background#22272e
peekViewResult.matchHighlightBackground#ae7c1466
pickerGroup.border#444c56
pickerGroup.foreground#768390
progressBar.background#316dca
quickInput.background#2d333b
quickInput.foreground#adbac7
scrollbar.shadow#545d6833
scrollbarSlider.activeBackground#636e7b87
scrollbarSlider.background#636e7b33
scrollbarSlider.hoverBackground#636e7b45
settings.headerForeground#768390
settings.modifiedItemIndicator#ae7c1466
sideBar.background#1c2128
sideBar.border#444c56
sideBar.foreground#adbac7
sideBarSectionHeader.background#1c2128
sideBarSectionHeader.border#444c56
sideBarSectionHeader.foreground#adbac7
sideBarTitle.foreground#adbac7
statusBar.background#22272e
statusBar.border#444c56
statusBar.debuggingBackground#c93c37
statusBar.debuggingForeground#cdd9e5
statusBar.foreground#768390
statusBar.noFolderBackground#22272e
statusBarItem.prominentBackground#2d333b
tab.activeBackground#22272e
tab.activeBorder#22272e
tab.activeBorderTop#ec775c
tab.activeForeground#adbac7
tab.border#444c56
tab.hoverBackground#22272e
tab.inactiveBackground#1c2128
tab.inactiveForeground#768390
tab.unfocusedActiveBorder#22272e
tab.unfocusedActiveBorderTop#444c56
tab.unfocusedHoverBackground#636e7b1a
terminal.ansiBlack#545d68
terminal.ansiBlue#539bf5
terminal.ansiBrightBlack#636e7b
terminal.ansiBrightBlue#6cb6ff
terminal.ansiBrightCyan#56d4dd
terminal.ansiBrightGreen#6bc46d
terminal.ansiBrightMagenta#dcbdfb
terminal.ansiBrightRed#ff938a
terminal.ansiBrightWhite#cdd9e5
terminal.ansiBrightYellow#daaa3f
terminal.ansiCyan#39c5cf
terminal.ansiGreen#57ab5a
terminal.ansiMagenta#b083f0
terminal.ansiRed#f47067
terminal.ansiWhite#909dab
terminal.ansiYellow#c69026
terminal.foreground#768390
textBlockQuote.background#1c2128
textBlockQuote.border#444c56
textCodeBlock.background#636e7b66
textLink.activeForeground#539bf5
textLink.foreground#539bf5
textPreformat.foreground#768390
textSeparator.foreground#373e47
titleBar.activeBackground#22272e
titleBar.activeForeground#768390
titleBar.border#444c56
titleBar.inactiveBackground#1c2128
titleBar.inactiveForeground#768390
tree.indentGuidesStroke#373e47

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment, string.comment	#768390	—
constant, entity.name.constant, variable.other.constant, variable.language, entity	#6CB6FF	—
entity.name, meta.export.default, meta.definition.variable	#F69D50	—
variable.parameter.function, meta.jsx.children, meta.block, meta.tag.attributes, entity.name.constant, meta.object.member, meta.embedded.expression	#F69D50	—
entity.name.function	#DCBDFB	—
entity.name.tag, support.class.component	#8DDB8C	—
keyword	#FF938A	—
storage, storage.type	#FF938A	—
storage.modifier.package, storage.modifier.import, storage.type.java	#ADBAC7	—
string, punctuation.definition.string, string punctuation.section.embedded source	#96D0FF	—
support	#6CB6FF	—
meta.property-name	#6CB6FF	—
variable	#F69D50	—
variable.other, source.dart	#edf1f5	—
punctuation.definition.variable.php	#DCBDFB	—
invalid.broken	#FF938A	italic
invalid.deprecated	#FF938A	italic
invalid.illegal	#FF938A	italic
invalid.unimplemented	#FF938A	italic
carriage-return	#CDD9E5	italic underline
message.error	#FF938A	—
string source	#ADBAC7	—
string variable	#6CB6FF	—
source.regexp, string.regexp	#96D0FF	—
string.regexp.character-class, string.regexp constant.character.escape, string.regexp source.ruby.embedded, string.regexp string.regexp.arbitrary-repitition	#96D0FF	—
string.regexp constant.character.escape	#8DDB8C	bold
support.constant	#6CB6FF	—
support.variable	#6CB6FF	—
meta.module-reference	#6CB6FF	—
punctuation.definition.list.begin.markdown	#F69D50	—
markup.heading, markup.heading entity.name	#6CB6FF	bold
markup.quote	#8DDB8C	—
markup.italic	#ADBAC7	italic
markup.bold	#ADBAC7	bold
markup.raw	#6CB6FF	—
markup.deleted, meta.diff.header.from-file, punctuation.definition.deleted	#FF938A	—
markup.inserted, meta.diff.header.to-file, punctuation.definition.inserted	#8DDB8C	—
markup.changed, punctuation.definition.changed	#F69D50	—
markup.ignored, markup.untracked	#2D333B	—
meta.diff.range	#DCBDFB	bold
meta.diff.header	#6CB6FF	—
meta.separator	#6CB6FF	bold
meta.output	#6CB6FF	—
brackethighlighter.tag, brackethighlighter.curly, brackethighlighter.round, brackethighlighter.square, brackethighlighter.angle, brackethighlighter.quote	#768390	—
brackethighlighter.unmatched	#FF938A	—
constant.other.reference.link, string.other.link	#96D0FF	underline
token.info-token	#6796E6	—
token.warn-token	#CD9731	—
token.error-token	#F44747	—
token.debug-token	#B267E6	—

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