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 H C Wonderland Wood

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#fbe7c333
activityBar.activeBorder#fbe7c3
activityBar.background#1b192f
activityBar.border#141222
activityBar.dropBorder#504b8833
activityBar.foreground#fbe7c3
activityBar.inactiveForeground#555174
activityBarBadge.background#fbe7c3
activityBarBadge.foreground#1b192f
activityBarTop.activeBorder#fbe7c3
activityBarTop.dropBorder#504b8833
activityBarTop.foreground#fbe7c3
activityBarTop.inactiveForeground#615f77
badge.background#fbe7c3
badge.foreground#1b192f
breadcrumb.background#1F1D36
breadcrumbPicker.background#292647
button.background#fbe7c380
button.border#ffffff26
button.foreground#ffffff
button.hoverBackground#fbe7c399
button.secondaryBackground#2c294d
button.secondaryForeground#d3d2e6cc
button.secondaryHoverBackground#322f57
button.separator#ffffff4d
charts.blue#92b4ff
charts.foreground#d3d2e6
charts.green#91d6a7
charts.lines#d3d2e6
charts.orange#e4a792
charts.purple#de98ae
charts.red#ff7e70
charts.yellow#fbe7c3
checkbox.foreground#d3d2e6
commandCenter.activeBackground#52426a61
commandCenter.activeForeground#b4b1d48f
commandCenter.background#1F1D36
commandCenter.border#141222
commandCenter.foreground#504b88
contrastActiveBorder#00000000
contrastBorder#00000000
debugConsole.errorForeground#ff7e70
debugConsole.infoForeground#92b4ff
debugConsole.warningForeground#e4a792
debugExceptionWidget.background#52426a
debugExceptionWidget.border#141222
debugIcon.breakpointCurrentStackframeForeground#ff7e70
debugIcon.breakpointDisabledForeground#ff7e7080
debugIcon.breakpointForeground#ff7e70
debugIcon.continueForeground#92b4ff
debugIcon.disconnectForeground#ff7e70
debugIcon.pauseForeground#ff7e70
debugIcon.restartForeground#91d6a7
debugIcon.startForeground#91d6a7
debugIcon.stepBackForeground#92b4ff
debugIcon.stepIntoForeground#92b4ff
debugIcon.stepOutForeground#92b4ff
debugIcon.stepOverForeground#92b4ff
debugIcon.stopForeground#ff7e70
debugToolBar.background#332e43
descriptionForeground#d3d2e680
diffEditor.border#141222
diffEditor.diagonalFill#292647
diffEditor.insertedLineBackground#86e1a31a
diffEditor.insertedTextBackground#86e1a31a
diffEditor.insertedTextBorder#00000000
diffEditor.move.border#fbe7c34d
diffEditor.moveActive.border#fbe7c3b3
diffEditor.removedLineBackground#ff7e701a
diffEditor.removedTextBackground#ff7e701a
diffEditor.removedTextBorder#00000000
diffEditor.unchangedCodeBackground#19172c
diffEditor.unchangedRegionBackground#19172c
diffEditor.unchangedRegionShadow#00000066
diffEditorGutter.insertedLineBackground#00000000
diffEditorGutter.removedLineBackground#00000000
diffEditorOverview.insertedForeground#91d6a726
diffEditorOverview.removedForeground#ff7e7030
disabledForeground#d3d2e64d
dropdown.background#24213e
dropdown.border#3f3c64
dropdown.foreground#d3d2e6
dropdown.listBackground#24213e
editor.background#1F1D36
editor.findMatchBackground#fbe7c330
editor.findMatchBorder#fbe7c361
editor.findMatchHighlightBackground#fbe7c33d
editor.findMatchHighlightBorder#fbe7c35c
editor.foldBackground#00000033
editor.foldPlaceholderForeground#504b88
editor.foreground#d3d2e6
editor.hoverHighlightBackground#fbe7c34d
editor.inactiveSelectionBackground#fbe7c34d
editor.lineHighlightBackground#fbe7c30f
editor.lineHighlightBorder#fbe7c326
editor.linkedEditingBackground#92b4ff33
editor.rangeHighlightBackground#fbe7c33d
editor.selectionBackground#fbe7c34d
editor.selectionForeground#d3d2e6
editor.selectionHighlightBackground#fbe7c314
editor.selectionHighlightBorder#fbe7c34d
editor.wordHighlightBackground#fbe7c373
editor.wordHighlightBorder#fbe7c38a
editor.wordHighlightStrongBackground#fbe7c34d
editorBracketHighlight.foreground1#fbe7c3
editorBracketHighlight.foreground2#de98ae
editorBracketHighlight.foreground3#92b4ff
editorBracketHighlight.foreground4#9a94e9
editorBracketHighlight.foreground5#7ddcbf
editorBracketHighlight.foreground6#ed98cb
editorBracketHighlight.unexpectedBracket.foreground#ff7e70
editorBracketMatch.background#fbe7c34d
editorBracketMatch.border#fbe7c373
editorCodeLens.foreground#b4b1d480
editorCursor.background#fbe7c3
editorCursor.foreground#fbe7c3
editorError.border#00000000
editorError.foreground#ff7e70
editorGhostText.border#00000000
editorGhostText.foreground#d3d2e670
editorGroup.border#141222
editorGroup.dropBackground#fbe7c314
editorGroupHeader.border#00000000
editorGroupHeader.noTabsBackground#1F1D36
editorGroupHeader.tabsBackground#1b192f
editorGroupHeader.tabsBorder#141222
editorGutter.addedBackground#91d6a7cc
editorGutter.background#1F1D36
editorGutter.commentRangeForeground#52426a
editorGutter.deletedBackground#ff7e70cc
editorGutter.modifiedBackground#92b4ffcc
editorHoverWidget.background#52426a
editorHoverWidget.border#141222
editorIndentGuide.activeBackground1#504b88e6
editorIndentGuide.background1#504b8866
editorInfo.border#00000000
editorInlayHint.background#b4b1d41a
editorInlayHint.foreground#b4b1d4b3
editorInlayHint.parameterBackground#b4b1d41a
editorInlayHint.parameterForeground#b4b1d4b3
editorInlayHint.typeBackground#b4b1d41a
editorInlayHint.typeForeground#b4b1d4b3
editorLineNumber.activeForeground#9490bc
editorLineNumber.foreground#444162
editorLink.activeForeground#d3d2e6
editorMarkerNavigation.background#1b192f
editorMarkerNavigationError.background#ff7e708f
editorMarkerNavigationInfo.background#92b4ff8f
editorMarkerNavigationWarning.background#e4a7928f
editorOverviewRuler.addedForeground#91d6a780
editorOverviewRuler.border#141222
editorOverviewRuler.deletedForeground#ff7e7080
editorOverviewRuler.errorForeground#ff7e70
editorOverviewRuler.incomingContentForeground#91d6a780
editorOverviewRuler.infoForeground#92b4ff80
editorOverviewRuler.modifiedForeground#92b4ff80
editorOverviewRuler.selectionHighlightForeground#fbe7c380
editorOverviewRuler.warningForeground#e4a792
editorRuler.foreground#504b8833
editorStickyScroll.shadow#00000066
editorStickyScrollHover.background#252240
editorSuggestWidget.background#23213d
editorSuggestWidget.border#141222
editorSuggestWidget.foreground#b4b1d4
editorSuggestWidget.highlightForeground#fbe7c3
editorSuggestWidget.selectedBackground#322f57
editorSuggestWidget.selectedIconForeground#d3d2e6
editorUnnecessaryCode.border#b4b1d499
editorUnnecessaryCode.opacity#000000aa
editorWarning.border#00000000
editorWarning.foreground#fbe7c3
editorWhitespace.foreground#504b8860
editorWidget.background#52426a
editorWidget.border#322f57
editorWidget.resizeBorder#fbe7c350
errorForeground#ff7e70
errorLens.errorForeground#ff7e70fc
errorLens.hintForeground#92b4fffc
errorLens.infoForeground#92b4fffc
errorLens.warningForeground#e4a792fc
extensionButton.background#fbe7c380
extensionButton.foreground#ffffff
extensionButton.hoverBackground#fbe7c399
extensionButton.prominentBackground#fbe7c39d
extensionButton.prominentForeground#d3d2e6
extensionButton.prominentHoverBackground#fbe7c3
focusBorder#454178
foreground#b4b1d4
gitDecoration.conflictingResourceForeground#fbe7c3
gitDecoration.deletedResourceForeground#ff7e70
gitDecoration.ignoredResourceForeground#504b88
gitDecoration.modifiedResourceForeground#92b4ff
gitDecoration.untrackedResourceForeground#91d6a7
icon.foreground#b4b1d4ab
inlineChat.background#292647
inlineChat.border#322f57
inlineChatInput.background#23213d
inlineChatInput.border#322f57
inlineChatInput.focusBorder#454178
inlineEdit.gutterIndicator.background#b4b1d480
inlineEdit.gutterIndicator.primaryBackground#f5c163b3
inlineEdit.gutterIndicator.primaryBorder#f5c163
inlineEdit.gutterIndicator.primaryForeground#0c0b15
inlineEdit.gutterIndicator.secondaryBackground#f5c163b3
inlineEdit.gutterIndicator.secondaryBorder#f5c163
inlineEdit.gutterIndicator.secondaryForeground#241802
inlineEdit.gutterIndicator.successfulBackground#47ba6cb3
inlineEdit.gutterIndicator.successfulBorder#47ba6c
inlineEdit.gutterIndicator.successfulForeground#000000
inlineEdit.modifiedBackground#91d6a726
inlineEdit.modifiedBorder#91d6a7cc
inlineEdit.modifiedChangedLineBackground#91d6a714
inlineEdit.modifiedChangedTextBackground#00000000
inlineEdit.originalBackground#ff7e7026
inlineEdit.originalBorder#ff7e70cc
inlineEdit.originalChangedLineBackground#ff7e70cc
inlineEdit.originalChangedTextBackground#00000000
inlineEdit.tabWillAcceptModifiedBorder#91d6a7
inlineEdit.tabWillAcceptOriginalBorder#ff7e70
input.background#24213e
input.border#3f3c64
input.foreground#d3d2e6
input.placeholderForeground#5d5894
inputOption.activeBackground#58529a
inputOption.activeBorder#00000000
inputOption.activeForeground#d3d2e6
inputOption.hoverBackground#322f57
inputValidation.errorBackground#52426a
inputValidation.errorBorder#fbe7c3
inputValidation.infoBackground#52426a
inputValidation.infoBorder#fbe7c3
inputValidation.warningBackground#52426a
inputValidation.warningBorder#fbe7c3
keybindingLabel.background#52426a
keybindingLabel.border#867999
keybindingLabel.bottomBorder#867999
keybindingLabel.foreground#bab3c5
list.activeSelectionBackground#6a568973
list.activeSelectionForeground#d3d2e6
list.dropBackground#fbe7c315
list.errorForeground#ff7e70
list.focusBackground#fbe7c340
list.focusForeground#b4b1d4
list.highlightForeground#fbe7c3
list.hoverBackground#6a56894d
list.hoverForeground#ffffff
list.inactiveSelectionBackground#6a568940
list.inactiveSelectionForeground#d3d2e6
list.warningForeground#e4a792
menu.background#52426a
menu.border#141222
menu.foreground#d4d0db
menu.selectionForeground#ffffff
menu.separatorBackground#14122265
menubar.selectionBackground#52426a
menubar.selectionForeground#b4b1d4
merge.border#141222
merge.commonContentBackground#fbe7c330
merge.commonHeaderBackground#fbe7c380
merge.currentContentBackground#91d6a730
merge.currentHeaderBackground#91d6a780
merge.incomingContentBackground#92b4ff30
merge.incomingHeaderBackground#92b4ff80
minimap.background#1F1D36
minimap.errorHighlight#ff7e70
minimap.findMatchHighlight#fbe7c3
minimap.selectionHighlight#fbe7c3
minimap.selectionOccurrenceHighlight#fbe7c3
minimap.warningHighlight#e4a792
minimapGutter.addedBackground#91d6a7
minimapGutter.deletedBackground#ff7e70
minimapGutter.modifiedBackground#92b4ff
multiDiffEditor.border#141222
multiDiffEditor.headerBackground#292647
notificationCenterHeader.background#52426a
notificationCenterHeader.foreground#d3d2e6
notificationLink.foreground#fbe7c3
notifications.background#52426a
notifications.border#141222
notifications.foreground#b4b1d4
notificationsErrorIcon.foreground#ff7e70
notificationsInfoIcon.foreground#92b4ff
notificationsWarningIcon.foreground#e4a792
panel.background#1d1b32
panel.border#141222
panel.dropBorder#504b8880
panelInput.border#322f57
panelSection.border#141222
panelSectionHeader.background#23203c
panelSectionHeader.border#141222
panelSectionHeader.foreground#d3d2e6
panelTitle.activeBorder#fbe7c3
panelTitle.activeForeground#fbe7c3
panelTitle.inactiveForeground#504b88
peekView.border#141222
peekViewEditor.background#272443
peekViewEditor.matchHighlightBackground#52426a40
peekViewEditor.matchHighlightBorder#00000000
peekViewEditorGutter.background#272443
peekViewEditorStickyScroll.background#252240
peekViewResult.background#24213e
peekViewResult.fileForeground#d3d2e6
peekViewResult.lineForeground#b4b1d4
peekViewResult.matchHighlightBackground#fbe7c380
peekViewResult.selectionBackground#fbe7c333
peekViewResult.selectionForeground#d3d2e6
peekViewTitle.background#292647
peekViewTitleDescription.foreground#d3d2e6
peekViewTitleLabel.foreground#d3d2e6
pickerGroup.border#141222
pickerGroup.foreground#d3d2e6
profileBadge.background#fbe7c3
profileBadge.foreground#1F1D36
progressBar.background#fbe7c3
quickInput.background#252240
quickInput.foreground#d3d2e6b3
quickInputList.focusBackground#846ea473
quickInputList.focusForeground#ffffff
quickInputList.focusIconForeground#d3d2e6
quickInputTitle.background#1b192f
sash.hoverBorder#fbe7c350
scmGraph.foreground1#92b4ff
scmGraph.foreground2#de98ae
scmGraph.foreground3#A4EF58
scmGraph.foreground4#7ddcbf
scmGraph.foreground5#ed98cb
scmGraph.historyItemBaseRefColor#9a94e9
scmGraph.historyItemHoverAdditionsForeground#91d6a7
scmGraph.historyItemHoverDefaultLabelBackground#b4b1d4
scmGraph.historyItemHoverDefaultLabelForeground#030205
scmGraph.historyItemHoverDeletionsForeground#ff7e70
scmGraph.historyItemHoverLabelForeground#030205
scmGraph.historyItemRefColor#fbe7c3
scmGraph.historyItemRemoteRefColor#92b4ff
scrollbar.shadow#00000066
scrollbarSlider.activeBackground#d3d2e64d
scrollbarSlider.background#d3d2e626
scrollbarSlider.hoverBackground#d3d2e633
selection.background#fbe7c361
settings.headerForeground#d3d2e6
settings.modifiedItemIndicator#fbe7c3
settings.settingsHeaderHoverForeground#d3d2e6
sideBar.background#1b192f
sideBar.border#141222
sideBar.foreground#b4b1d4cc
sideBarSectionHeader.background#1b192f
sideBarSectionHeader.border#141222
sideBarSectionHeader.foreground#d3d2e6
sideBarStickyScroll.background#171528
sideBarStickyScroll.shadow#00000066
sideBarTitle.foreground#504b88
statusBar.background#1F1D36
statusBar.border#141222
statusBar.debuggingBackground#474050
statusBar.debuggingForeground#e5cbb3
statusBar.foreground#b4b1d480
statusBar.noFolderBackground#1b192f
statusBar.noFolderBorder#141222
statusBar.noFolderForeground#b4b1d4cc
statusBarItem.activeBackground#52426a
statusBarItem.compactHoverBackground#fbe7c3cc
statusBarItem.errorBackground#ff7e70
statusBarItem.errorForeground#700b00
statusBarItem.errorHoverBackground#ffaca3
statusBarItem.errorHoverForeground#1f1d36
statusBarItem.hoverBackground#5b525e
statusBarItem.hoverForeground#d3d2e6
statusBarItem.offlineBackground#de98ae
statusBarItem.offlineForeground#5a1d30
statusBarItem.offlineHoverBackground#eabfcc
statusBarItem.offlineHoverForeground#1f1d36
statusBarItem.prominentBackground#1F1D36
statusBarItem.prominentForeground#000000
statusBarItem.prominentHoverBackground#322f57
statusBarItem.prominentHoverForeground#1f1d36
statusBarItem.remoteBackground#7ddcbf
statusBarItem.remoteForeground#134737
statusBarItem.remoteHoverBackground#a5e7d3
statusBarItem.remoteHoverForeground#1f1d36
statusBarItem.warningBackground#e4a792
statusBarItem.warningForeground#5f2a18
statusBarItem.warningHoverBackground#eec8bb
statusBarItem.warningHoverForeground#1f1d36
tab.activeBackground#332e43
tab.activeBorder#1F1D36
tab.activeBorderTop#fbe7c3
tab.activeForeground#d3d2e6
tab.border#141222
tab.hoverBackground#1F1D36
tab.inactiveBackground#1b192f
tab.inactiveForeground#504b88
tab.lastPinnedBorder#141222
tab.unfocusedActiveBorder#1F1D36
tab.unfocusedActiveForeground#fbe7c3
tab.unfocusedHoverBackground#1F1D36
tab.unfocusedInactiveForeground#504b88
terminal.ansiBlack#1F1D36
terminal.ansiBlue#92b4ff
terminal.ansiBrightBlack#433f74
terminal.ansiBrightBlue#92b4ff
terminal.ansiBrightCyan#64f5c9
terminal.ansiBrightGreen#7aed9f
terminal.ansiBrightMagenta#f284a6
terminal.ansiBrightRed#ff7e70
terminal.ansiBrightWhite#ffffff
terminal.ansiBrightYellow#ffe8bf
terminal.ansiCyan#7ddcbf
terminal.ansiGreen#91d6a7
terminal.ansiMagenta#de98ae
terminal.ansiRed#ff7e70
terminal.ansiWhite#d3d2e6
terminal.ansiYellow#fbe7c3
terminal.background#1d1b32
terminal.foreground#d3d2e6
terminal.selectionForeground#d3d2e6
terminalCursor.background#1F1D36
terminalCursor.foreground#fbe7c3
terminalStickyScrollHover.background#252240
textBlockQuote.background#92b4ff33
textBlockQuote.border#92b4ffb9
textCodeBlock.background#92b4ff33
textLink.activeForeground#fbe7c3
textLink.foreground#fbe7c3
textPreformat.background#474050
textPreformat.foreground#fbe7c3
textSeparator.foreground#fbe7c3
titleBar.activeBackground#151425
titleBar.activeForeground#d3d2e666
titleBar.border#141222
titleBar.inactiveBackground#151425
titleBar.inactiveForeground#504b88
toolbar.activeBackground#504b8880
toolbar.hoverBackground#504b884d
tree.indentGuidesStroke#504b8870
walkThrough.embeddedEditorBackground#1F1D36
welcomePage.progress.background#52426a
welcomePage.progress.foreground#fbe7c3
welcomePage.tileBackground#b4b1d41a
welcomePage.tileBorder#b4b1d433
welcomePage.tileHoverBackground#b4b1d433
widget.shadow#00000033

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#504b88	italic
string	#AFEA7B	—
constant.numeric	#ffaa7d	—
comment.line	#504b88	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	#504b88	italic
comment.line.fold.krl, meta.fold.krl, keyword.control.fold.krl	#827783	italic
keyword.control.krl	#bc98ff	bold
keyword.function.movement.krl	#7fd7f5	bold
storage.type.krl, storage.type.interrupt.krl, storage.type.trigger.krl	#F5DF76	italic
variable.language.system.krl	#fd604f
constant.numeric.krl, constant.numeric.hex.krl, constant.numeric.binary.krl	#ffaa7d	—
string.quoted.double.krl	#AFEA7B	—
variable.function.krl	—	—
constant.language.enum.krl, variable.other.enummember.krl	—	—
support.function.builtin.krl	—	—
keyword.operator.krl, keyword.operator.comparison.krl, keyword.operator.arithmetic.krl, keyword.operator.bitwise.krl, keyword.operator.logical.krl	—	—

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