KUKA KRL Extension

Name: KUKA KRL Extension
Author: LiskinLabs

Publisher: LiskinLabsThemes in package: 67

Professional language support for KUKA Robot Language (KRL) in VS Code

Color themes

VS Code preview

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

KUKA KRL Extension — KRL Bearded Black And Amethyst Soft

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.activeBackground#a85ff126
activityBar.activeBorder#a85ff1
activityBar.background#13121f
activityBar.border#0b0b13
activityBar.dropBorder#49467633
activityBar.foreground#a85ff1
activityBar.inactiveForeground#4a4864
activityBarBadge.background#a85ff1
activityBarBadge.foreground#13121f
activityBarTop.activeBorder#a85ff1
activityBarTop.dropBorder#49467633
activityBarTop.foreground#a85ff1
activityBarTop.inactiveForeground#464457
badge.background#a85ff1
badge.foreground#13121f
breadcrumb.background#171626
breadcrumbPicker.background#211f36
button.background#a85ff180
button.border#ffffff26
button.foreground#e0c6fa
button.hoverBackground#a85ff199
button.secondaryBackground#25233d
button.secondaryForeground#c6c5dccc
button.secondaryHoverBackground#2b2946
button.separator#ffffff4d
charts.blue#11B7D4
charts.foreground#c6c5dc
charts.green#00a884
charts.lines#c6c5dc
charts.orange#d4770c
charts.purple#d46ec0
charts.red#E35535
charts.yellow#c7910c
checkbox.foreground#c6c5dc
commandCenter.activeBackground#211f3661
commandCenter.activeForeground#a7a5c98f
commandCenter.background#171626
commandCenter.border#0b0b13
commandCenter.foreground#494676
contrastActiveBorder#00000000
contrastBorder#00000000
debugConsole.errorForeground#E35535
debugConsole.infoForeground#11B7D4
debugConsole.warningForeground#d4770c
debugExceptionWidget.background#211f36
debugExceptionWidget.border#0b0b13
debugIcon.breakpointCurrentStackframeForeground#E35535
debugIcon.breakpointDisabledForeground#e3553580
debugIcon.breakpointForeground#E35535
debugIcon.continueForeground#11B7D4
debugIcon.disconnectForeground#E35535
debugIcon.pauseForeground#E35535
debugIcon.restartForeground#00a884
debugIcon.startForeground#00a884
debugIcon.stepBackForeground#11B7D4
debugIcon.stepIntoForeground#11B7D4
debugIcon.stepOutForeground#11B7D4
debugIcon.stepOverForeground#11B7D4
debugIcon.stopForeground#E35535
debugToolBar.background#241d37
descriptionForeground#c6c5dc80
diffEditor.border#0b0b13
diffEditor.diagonalFill#211f36
diffEditor.insertedLineBackground#00a8841a
diffEditor.insertedTextBackground#00a8841a
diffEditor.insertedTextBorder#00000000
diffEditor.move.border#c7910c4d
diffEditor.moveActive.border#c7910cb3
diffEditor.removedLineBackground#f44a241a
diffEditor.removedTextBackground#f44a241a
diffEditor.removedTextBorder#00000000
diffEditor.unchangedCodeBackground#11101c
diffEditor.unchangedRegionBackground#11101c
diffEditor.unchangedRegionShadow#00000066
diffEditorGutter.insertedLineBackground#00000000
diffEditorGutter.removedLineBackground#00000000
diffEditorOverview.insertedForeground#00a88426
diffEditorOverview.removedForeground#e3553530
disabledForeground#c6c5dc4d
dropdown.background#1c1b2e
dropdown.border#373553
dropdown.foreground#c6c5dc
dropdown.listBackground#1c1b2e
editor.background#171626
editor.findMatchBackground#a85ff130
editor.findMatchBorder#a85ff161
editor.findMatchHighlightBackground#a85ff13d
editor.findMatchHighlightBorder#a85ff15c
editor.foldBackground#00000033
editor.foldPlaceholderForeground#494676
editor.foreground#c6c5dc
editor.hoverHighlightBackground#a85ff14d
editor.inactiveSelectionBackground#a85ff14d
editor.lineHighlightBackground#a85ff10f
editor.lineHighlightBorder#a85ff126
editor.linkedEditingBackground#00c3e533
editor.rangeHighlightBackground#a85ff13d
editor.selectionBackground#a85ff14d
editor.selectionForeground#c6c5dc
editor.selectionHighlightBackground#a85ff114
editor.selectionHighlightBorder#a85ff14d
editor.wordHighlightBackground#a85ff173
editor.wordHighlightBorder#a85ff18a
editor.wordHighlightStrongBackground#a85ff14d
editorBracketHighlight.foreground1#c7910c
editorBracketHighlight.foreground2#d46ec0
editorBracketHighlight.foreground3#11B7D4
editorBracketHighlight.foreground4#a85ff1
editorBracketHighlight.foreground5#38c7bd
editorBracketHighlight.foreground6#c62f52
editorBracketHighlight.unexpectedBracket.foreground#E35535
editorBracketMatch.background#a85ff14d
editorBracketMatch.border#a85ff173
editorCodeLens.foreground#a7a5c980
editorCursor.background#a85ff1
editorCursor.foreground#c7910c
editorError.border#00000000
editorError.foreground#E35535
editorGhostText.border#00000000
editorGhostText.foreground#c6c5dc70
editorGroup.border#0b0b13
editorGroup.dropBackground#a85ff114
editorGroupHeader.border#00000000
editorGroupHeader.noTabsBackground#171626
editorGroupHeader.tabsBackground#13121f
editorGroupHeader.tabsBorder#0b0b13
editorGutter.addedBackground#00a884cc
editorGutter.background#171626
editorGutter.commentRangeForeground#211f36
editorGutter.deletedBackground#e35535cc
editorGutter.modifiedBackground#11b7d4cc
editorHoverWidget.background#211f36
editorHoverWidget.border#0b0b13
editorIndentGuide.activeBackground1#494676cc
editorIndentGuide.background1#49467633
editorInfo.border#00000000
editorInlayHint.background#a7a5c91a
editorInlayHint.foreground#a7a5c9b3
editorInlayHint.parameterBackground#a7a5c91a
editorInlayHint.parameterForeground#a7a5c9b3
editorInlayHint.typeBackground#a7a5c91a
editorInlayHint.typeForeground#a7a5c9b3
editorLineNumber.activeForeground#8885b0
editorLineNumber.foreground#3a3952
editorLink.activeForeground#c6c5dc
editorMarkerNavigation.background#13121f
editorMarkerNavigationError.background#e355358f
editorMarkerNavigationInfo.background#11b7d48f
editorMarkerNavigationWarning.background#d4770c8f
editorOverviewRuler.addedForeground#00a88480
editorOverviewRuler.border#0b0b13
editorOverviewRuler.deletedForeground#e3553580
editorOverviewRuler.errorForeground#E35535
editorOverviewRuler.incomingContentForeground#00a88480
editorOverviewRuler.infoForeground#11b7d480
editorOverviewRuler.modifiedForeground#11b7d480
editorOverviewRuler.selectionHighlightForeground#a85ff180
editorOverviewRuler.warningForeground#d4770c
editorRuler.foreground#49467633
editorStickyScroll.shadow#00000066
editorStickyScrollHover.background#1d1c30
editorSuggestWidget.background#1b1a2c
editorSuggestWidget.border#0b0b13
editorSuggestWidget.foreground#a7a5c9
editorSuggestWidget.highlightForeground#c7910c
editorSuggestWidget.selectedBackground#2b2946
editorSuggestWidget.selectedIconForeground#c6c5dc
editorUnnecessaryCode.border#00000000
editorUnnecessaryCode.opacity#000000aa
editorWarning.border#00000000
editorWarning.foreground#c7910c
editorWhitespace.foreground#49467660
editorWidget.background#211f36
editorWidget.border#2b2946
editorWidget.resizeBorder#a85ff150
errorForeground#E35535
errorLens.errorForeground#e35535fc
errorLens.hintForeground#11b7d4fc
errorLens.infoForeground#11b7d4fc
errorLens.warningForeground#d4770cfc
extensionButton.background#a85ff180
extensionButton.foreground#e0c6fa
extensionButton.hoverBackground#a85ff199
extensionButton.prominentBackground#a85ff19d
extensionButton.prominentForeground#c6c5dc
extensionButton.prominentHoverBackground#a85ff1
focusBorder#3e3b67
foreground#a7a5c9
gitDecoration.conflictingResourceForeground#a85ff1
gitDecoration.deletedResourceForeground#E35535
gitDecoration.ignoredResourceForeground#494676
gitDecoration.modifiedResourceForeground#11B7D4
gitDecoration.untrackedResourceForeground#00a884
icon.foreground#a7a5c9ab
inlineChat.background#211f36
inlineChat.border#2b2946
inlineChatInput.background#1b1a2c
inlineChatInput.border#2b2946
inlineChatInput.focusBorder#3e3b67
inlineEdit.gutterIndicator.background#a7a5c980
inlineEdit.gutterIndicator.primaryBackground#674b06b3
inlineEdit.gutterIndicator.primaryBorder#674b06
inlineEdit.gutterIndicator.primaryForeground#030306
inlineEdit.gutterIndicator.secondaryBackground#7513d7b3
inlineEdit.gutterIndicator.secondaryBorder#7513d7
inlineEdit.gutterIndicator.secondaryForeground#000000
inlineEdit.gutterIndicator.successfulBackground#004234b3
inlineEdit.gutterIndicator.successfulBorder#004234
inlineEdit.gutterIndicator.successfulForeground#000000
inlineEdit.modifiedBackground#00a88426
inlineEdit.modifiedBorder#00a884cc
inlineEdit.modifiedChangedLineBackground#00a88414
inlineEdit.modifiedChangedTextBackground#00000000
inlineEdit.originalBackground#e3553526
inlineEdit.originalBorder#e35535cc
inlineEdit.originalChangedLineBackground#e35535cc
inlineEdit.originalChangedTextBackground#00000000
inlineEdit.tabWillAcceptModifiedBorder#00a884
inlineEdit.tabWillAcceptOriginalBorder#E35535
input.background#1c1b2e
input.border#373553
input.foreground#c6c5dc
input.placeholderForeground#565382
inputOption.activeBackground#524e87
inputOption.activeBorder#00000000
inputOption.activeForeground#c6c5dc
inputOption.hoverBackground#2b2946
inputValidation.errorBackground#211f36
inputValidation.errorBorder#c7910c
inputValidation.infoBackground#211f36
inputValidation.infoBorder#a85ff1
inputValidation.warningBackground#211f36
inputValidation.warningBorder#c7910c
keybindingLabel.background#211f36
keybindingLabel.border#504e6d
keybindingLabel.bottomBorder#504e6d
keybindingLabel.foreground#817ea3
list.activeSelectionBackground#35325673
list.activeSelectionForeground#c6c5dc
list.dropBackground#a85ff115
list.errorForeground#E35535
list.focusBackground#a85ff140
list.focusForeground#a7a5c9
list.highlightForeground#c7910c
list.hoverBackground#3532564d
list.hoverForeground#f5f5f8
list.inactiveSelectionBackground#35325640
list.inactiveSelectionForeground#c6c5dc
list.warningForeground#d4770c
menu.background#211f36
menu.border#0b0b13
menu.foreground#9e9cb9
menu.selectionForeground#f5f5f8
menu.separatorBackground#0b0b1365
menubar.selectionBackground#211f36
menubar.selectionForeground#a7a5c9
merge.border#0b0b13
merge.commonContentBackground#c7910c30
merge.commonHeaderBackground#c7910c80
merge.currentContentBackground#00a88430
merge.currentHeaderBackground#00a88480
merge.incomingContentBackground#11b7d430
merge.incomingHeaderBackground#11b7d480
minimap.background#171626
minimap.errorHighlight#E35535
minimap.findMatchHighlight#a85ff1
minimap.selectionHighlight#a85ff1
minimap.selectionOccurrenceHighlight#a85ff1
minimap.warningHighlight#d4770c
minimapGutter.addedBackground#00a884
minimapGutter.deletedBackground#E35535
minimapGutter.modifiedBackground#11B7D4
multiDiffEditor.border#0b0b13
multiDiffEditor.headerBackground#211f36
notificationCenterHeader.background#211f36
notificationCenterHeader.foreground#c6c5dc
notificationLink.foreground#c7910c
notifications.background#211f36
notifications.border#0b0b13
notifications.foreground#a7a5c9
notificationsErrorIcon.foreground#E35535
notificationsInfoIcon.foreground#11B7D4
notificationsWarningIcon.foreground#d4770c
panel.background#151422
panel.border#0b0b13
panel.dropBorder#49467680
panelInput.border#2b2946
panelSection.border#0b0b13
panelSectionHeader.background#1b1a2c
panelSectionHeader.border#0b0b13
panelSectionHeader.foreground#c6c5dc
panelTitle.activeBorder#a85ff1
panelTitle.activeForeground#a85ff1
panelTitle.inactiveForeground#494676
peekView.border#0b0b13
peekViewEditor.background#1f1d33
peekViewEditor.matchHighlightBackground#211f3640
peekViewEditor.matchHighlightBorder#00000000
peekViewEditorGutter.background#1f1d33
peekViewEditorStickyScroll.background#1d1c30
peekViewResult.background#1c1b2e
peekViewResult.fileForeground#c6c5dc
peekViewResult.lineForeground#a7a5c9
peekViewResult.matchHighlightBackground#a85ff180
peekViewResult.selectionBackground#a85ff133
peekViewResult.selectionForeground#c6c5dc
peekViewTitle.background#211f36
peekViewTitleDescription.foreground#c6c5dc
peekViewTitleLabel.foreground#c6c5dc
pickerGroup.border#0b0b13
pickerGroup.foreground#c6c5dc
profileBadge.background#a85ff1
profileBadge.foreground#171626
progressBar.background#c7910c
quickInput.background#1d1c30
quickInput.foreground#c6c5dcb3
quickInputList.focusBackground#49447773
quickInputList.focusForeground#f5f5f8
quickInputList.focusIconForeground#c6c5dc
quickInputTitle.background#13121f
sash.hoverBorder#a85ff150
scmGraph.foreground1#11B7D4
scmGraph.foreground2#d46ec0
scmGraph.foreground3#3585bb
scmGraph.foreground4#38c7bd
scmGraph.foreground5#c62f52
scmGraph.historyItemBaseRefColor#a85ff1
scmGraph.historyItemHoverAdditionsForeground#00a884
scmGraph.historyItemHoverDefaultLabelBackground#a7a5c9
scmGraph.historyItemHoverDefaultLabelForeground#000000
scmGraph.historyItemHoverDeletionsForeground#E35535
scmGraph.historyItemHoverLabelForeground#000000
scmGraph.historyItemRefColor#c7910c
scmGraph.historyItemRemoteRefColor#11B7D4
scrollbar.shadow#00000066
scrollbarSlider.activeBackground#c6c5dc4d
scrollbarSlider.background#c6c5dc26
scrollbarSlider.hoverBackground#c6c5dc33
selection.background#a85ff161
settings.headerForeground#c6c5dc
settings.modifiedItemIndicator#a85ff1
settings.settingsHeaderHoverForeground#c6c5dc
sideBar.background#13121f
sideBar.border#0b0b13
sideBar.foreground#a7a5c9cc
sideBarSectionHeader.background#13121f
sideBarSectionHeader.border#0b0b13
sideBarSectionHeader.foreground#c6c5dc
sideBarStickyScroll.background#0f0e19
sideBarStickyScroll.shadow#00000066
sideBarTitle.foreground#494676
statusBar.background#171626
statusBar.border#0b0b13
statusBar.debuggingBackground#312449
statusBar.debuggingForeground#ac86dc
statusBar.foreground#a7a5c980
statusBar.noFolderBackground#13121f
statusBar.noFolderBorder#0b0b13
statusBar.noFolderForeground#a7a5c9cc
statusBarItem.activeBackground#211f36
statusBarItem.compactHoverBackground#a85ff1cc
statusBarItem.errorBackground#E35535
statusBarItem.errorForeground#160703
statusBarItem.errorHoverBackground#e97b62
statusBarItem.errorHoverForeground#171626
statusBarItem.hoverBackground#3e2b5c
statusBarItem.hoverForeground#c6c5dc
statusBarItem.offlineBackground#d46ec0
statusBarItem.offlineForeground#340f2d
statusBarItem.offlineHoverBackground#e095d1
statusBarItem.offlineHoverForeground#171626
statusBarItem.prominentBackground#171626
statusBarItem.prominentForeground#000000
statusBarItem.prominentHoverBackground#2b2946
statusBarItem.prominentHoverForeground#171626
statusBarItem.remoteBackground#38c7bd
statusBarItem.remoteForeground#000000
statusBarItem.remoteHoverBackground#60d2ca
statusBarItem.remoteHoverForeground#171626
statusBarItem.warningBackground#d4770c
statusBarItem.warningForeground#000000
statusBarItem.warningHoverBackground#f29121
statusBarItem.warningHoverForeground#171626
tab.activeBackground#171626
tab.activeBorder#171626
tab.activeBorderTop#a85ff1
tab.activeForeground#c6c5dc
tab.border#0b0b13
tab.hoverBackground#171626
tab.inactiveBackground#13121f
tab.inactiveForeground#494676
tab.lastPinnedBorder#0b0b13
tab.unfocusedActiveBorder#171626
tab.unfocusedActiveForeground#a85ff1
tab.unfocusedHoverBackground#171626
tab.unfocusedInactiveForeground#494676
terminal.ansiBlack#171626
terminal.ansiBlue#11B7D4
terminal.ansiBrightBlack#3d3a62
terminal.ansiBrightBlue#00c3e5
terminal.ansiBrightCyan#12edde
terminal.ansiBrightGreen#00a884
terminal.ansiBrightMagenta#f052d1
terminal.ansiBrightRed#ff4319
terminal.ansiBrightWhite#ffffff
terminal.ansiBrightYellow#d39600
terminal.ansiCyan#38c7bd
terminal.ansiGreen#00a884
terminal.ansiMagenta#d46ec0
terminal.ansiRed#E35535
terminal.ansiWhite#c6c5dc
terminal.ansiYellow#c7910c
terminal.background#151422
terminal.foreground#c6c5dc
terminal.selectionForeground#c6c5dc
terminalCursor.background#171626
terminalCursor.foreground#c7910c
terminalStickyScrollHover.background#1d1c30
textBlockQuote.background#11b7d433
textBlockQuote.border#11b7d4b9
textCodeBlock.background#11b7d433
textLink.activeForeground#a85ff1
textLink.foreground#a85ff1
textPreformat.background#392b28
textPreformat.foreground#c7910c
textSeparator.foreground#a85ff1
titleBar.activeBackground#0d0c15
titleBar.activeForeground#c6c5dc66
titleBar.border#0b0b13
titleBar.inactiveBackground#0d0c15
titleBar.inactiveForeground#494676
toolbar.activeBackground#49467680
toolbar.hoverBackground#4946764d
tree.indentGuidesStroke#49467670
walkThrough.embeddedEditorBackground#171626
welcomePage.progress.background#211f36
welcomePage.progress.foreground#a85ff1
welcomePage.tileBackground#a7a5c91a
welcomePage.tileBorder#a7a5c933
welcomePage.tileHoverBackground#a7a5c933
widget.shadow#00000033

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#646372	—
string	#00a884	—
constant.numeric	#d4770c	—
constant.language, constant.other	#E35535	—
keyword.operator	#a7a5c9	—
storage.type, storage.modifier	#38c7bd	—
support.function	#11B7D4	—
comment punctuation	#646372	—
comment.line	#646372	italic
comment.line, comment.line.semicolon.krl, comment.line.ampersand.krl, comment.line.bug.krl, comment.line.fixme.krl, comment.line.hack.krl, comment.line.note.krl, comment.line.todo.krl	#646372	italic
comment.line.fold.krl, meta.fold.krl, keyword.control.fold.krl	#578189	italic
keyword.control.krl	#d46ec0	bold
keyword.function.movement.krl	#11B7D4	bold
storage.type.krl, storage.type.interrupt.krl, storage.type.trigger.krl	#38c7bd	italic
variable.language.system.krl	#E35535
constant.numeric.krl, constant.numeric.hex.krl, constant.numeric.binary.krl	#d4770c	—
string.quoted.double.krl	#00a884	—
variable.function.krl	#11B7D4	—
constant.language.enum.krl, variable.other.enummember.krl	#E35535	—
support.function.builtin.krl	#11B7D4	—
keyword.operator.krl, keyword.operator.comparison.krl, keyword.operator.arithmetic.krl, keyword.operator.bitwise.krl, keyword.operator.logical.krl	#a7a5c9	—

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