diff --git a/packages/console/package.json b/packages/console/package.json
index 77b1c0b1e..07bdedd30 100644
--- a/packages/console/package.json
+++ b/packages/console/package.json
@@ -105,6 +105,7 @@
     "react-loading-skeleton": "^1.1.2",
     "react-query": "3.3.0",
     "react-query-devtools": "3.0.0-beta.1",
+    "react-syntax-highlighter": "^15.5.0",
     "react-virtualized": "^9.21.1",
     "shallowequal": "^1.1.0",
     "traverse": "^0.6.7",
diff --git a/packages/console/src/components/Executions/ExecutionDetails/ExecutionNodeURL.tsx b/packages/console/src/components/Executions/ExecutionDetails/ExecutionNodeURL.tsx
new file mode 100644
index 000000000..76edb63e0
--- /dev/null
+++ b/packages/console/src/components/Executions/ExecutionDetails/ExecutionNodeURL.tsx
@@ -0,0 +1,64 @@
+import * as React from 'react';
+import { Core } from '@flyteorg/flyteidl-types';
+import { Button } from '@material-ui/core';
+import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
+import { darcula } from 'react-syntax-highlighter/dist/esm/styles/prism';
+
+/** Fetches and renders the deck data for a given `nodeExecutionId` */
+export const ExecutionNodeURL: React.FC<{
+  nodeExecutionId: Core.NodeExecutionIdentifier;
+  suffix: string;
+}> = ({ nodeExecutionId, suffix }) => {
+  const project = nodeExecutionId.executionId?.project;
+  const domain = nodeExecutionId.executionId?.domain;
+  const executionName = nodeExecutionId.executionId?.name;
+  const nodeId = nodeExecutionId.nodeId;
+  const url = `flyte://v1/${project}/${domain}/${executionName}/${nodeId}/${suffix}`;
+  const code = `from flytekit.remote.remote import FlyteRemote
+from flytekit.configuration import Config
+remote = FlyteRemote(
+    Config.for_endpoint(endpoint="localhost:30080"),
+    default_project="${project}",
+    default_domain="${domain}"
+)
+remote.get("${url}")`;
+  const handleClick = event => {
+    if (event.shiftKey) {
+      navigator.clipboard.writeText(code);
+    } else {
+      navigator.clipboard.writeText(url);
+    }
+  };
+
+  const logoStyle = {
+    width: '20px',
+    height: '20px',
+  };
+
+  const codeStyle = {
+    fontSize: '10px', // Adjust the font size as desired
+  };
+
+  return (
+    <>
+      <Button>
+        <img
+          src="https://docs.flyte.org/en/latest/_static/flyte_circle_gradient_1_4x4.png"
+          alt="Logo"
+          style={logoStyle}
+          onClick={handleClick}
+        />
+      </Button>
+      <div>
+        <SyntaxHighlighter
+          language="python"
+          style={darcula}
+          customStyle={codeStyle}
+          onClick={() => navigator.clipboard.writeText(code)}
+        >
+          {code}
+        </SyntaxHighlighter>
+      </div>
+    </>
+  );
+};
diff --git a/packages/console/src/components/Executions/ExecutionDetails/NodeExecutionTabs/NodeExecutionInputs.tsx b/packages/console/src/components/Executions/ExecutionDetails/NodeExecutionTabs/NodeExecutionInputs.tsx
index 02c92329f..5fd4218f8 100644
--- a/packages/console/src/components/Executions/ExecutionDetails/NodeExecutionTabs/NodeExecutionInputs.tsx
+++ b/packages/console/src/components/Executions/ExecutionDetails/NodeExecutionTabs/NodeExecutionInputs.tsx
@@ -4,6 +4,7 @@ import { useNodeExecutionData } from 'components/hooks/useNodeExecution';
 import { LiteralMapViewer } from 'components/Literals/LiteralMapViewer';
 import { NodeExecution } from 'models/Execution/types';
 import * as React from 'react';
+import { ExecutionNodeURL } from '../ExecutionNodeURL';
 
 /** Fetches and renders the input data for a given `NodeExecution` */
 export const NodeExecutionInputs: React.FC<{
@@ -11,6 +12,7 @@ export const NodeExecutionInputs: React.FC<{
   taskIndex?: number;
 }> = ({ execution, taskIndex }) => {
   const executionData = useNodeExecutionData(execution.id);
+
   return (
     <WaitForData {...executionData}>
       <PanelSection>
@@ -18,6 +20,12 @@ export const NodeExecutionInputs: React.FC<{
           map={executionData.value.fullInputs}
           mapTaskIndex={taskIndex}
         />
+        {executionData.value.fullInputs?.literals && (
+          <ExecutionNodeURL
+            nodeExecutionId={execution.id}
+            suffix="i"
+          ></ExecutionNodeURL>
+        )}
       </PanelSection>
     </WaitForData>
   );
diff --git a/packages/console/src/components/Executions/ExecutionDetails/NodeExecutionTabs/NodeExecutionOutputs.tsx b/packages/console/src/components/Executions/ExecutionDetails/NodeExecutionTabs/NodeExecutionOutputs.tsx
index 0aa836661..ae2df04e2 100644
--- a/packages/console/src/components/Executions/ExecutionDetails/NodeExecutionTabs/NodeExecutionOutputs.tsx
+++ b/packages/console/src/components/Executions/ExecutionDetails/NodeExecutionTabs/NodeExecutionOutputs.tsx
@@ -4,6 +4,7 @@ import { useNodeExecutionData } from 'components/hooks/useNodeExecution';
 import { LiteralMapViewer } from 'components/Literals/LiteralMapViewer';
 import { NodeExecution } from 'models/Execution/types';
 import * as React from 'react';
+import { ExecutionNodeURL } from '../ExecutionNodeURL';
 
 /** Fetches and renders the output data for a given `NodeExecution` */
 export const NodeExecutionOutputs: React.FC<{
@@ -11,6 +12,7 @@ export const NodeExecutionOutputs: React.FC<{
   taskIndex?: number;
 }> = ({ execution, taskIndex }) => {
   const executionData = useNodeExecutionData(execution.id);
+
   return (
     <WaitForData {...executionData}>
       <PanelSection>
@@ -18,6 +20,11 @@ export const NodeExecutionOutputs: React.FC<{
           map={executionData.value.fullOutputs}
           mapTaskIndex={taskIndex}
         />
+        {executionData.value.fullOutputs?.literals && (
+          <ExecutionNodeURL
+          nodeExecutionId={execution.id}
+          suffix="o"
+        ></ExecutionNodeURL>)}
       </PanelSection>
     </WaitForData>
   );
diff --git a/yarn.lock b/yarn.lock
index bd8c9ef3c..b80391a44 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2144,6 +2144,7 @@ __metadata:
     react-loading-skeleton: ^1.1.2
     react-query: 3.3.0
     react-query-devtools: 3.0.0-beta.1
+    react-syntax-highlighter: ^15.5.0
     react-virtualized: ^9.21.1
     shallowequal: ^1.1.0
     traverse: ^0.6.7
@@ -12070,6 +12071,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"fault@npm:^1.0.0":
+  version: 1.0.4
+  resolution: "fault@npm:1.0.4"
+  dependencies:
+    format: ^0.2.0
+  checksum: 5ac610d8b09424e0f2fa8cf913064372f2ee7140a203a79957f73ed557c0e79b1a3d096064d7f40bde8132a69204c1fe25ec23634c05c6da2da2039cff26c4e7
+  languageName: node
+  linkType: hard
+
 "faye-websocket@npm:^0.11.3":
   version: 0.11.4
   resolution: "faye-websocket@npm:0.11.4"
@@ -12647,6 +12657,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"format@npm:^0.2.0":
+  version: 0.2.2
+  resolution: "format@npm:0.2.2"
+  checksum: 646a60e1336250d802509cf24fb801e43bd4a70a07510c816fa133aa42cdbc9c21e66e9cc0801bb183c5b031c9d68be62e7fbb6877756e52357850f92aa28799
+  languageName: node
+  linkType: hard
+
 "forwarded@npm:0.2.0":
   version: 0.2.0
   resolution: "forwarded@npm:0.2.0"
@@ -13507,6 +13524,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"highlight.js@npm:^10.4.1, highlight.js@npm:~10.7.0":
+  version: 10.7.3
+  resolution: "highlight.js@npm:10.7.3"
+  checksum: defeafcd546b535d710d8efb8e650af9e3b369ef53e28c3dc7893eacfe263200bba4c5fcf43524ae66d5c0c296b1af0870523ceae3e3104d24b7abf6374a4fea
+  languageName: node
+  linkType: hard
+
 "history@npm:^4.9.0":
   version: 4.10.1
   resolution: "history@npm:4.10.1"
@@ -16544,6 +16568,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"lowlight@npm:^1.17.0":
+  version: 1.20.0
+  resolution: "lowlight@npm:1.20.0"
+  dependencies:
+    fault: ^1.0.0
+    highlight.js: ~10.7.0
+  checksum: 14a1815d6bae202ddee313fc60f06d46e5235c02fa483a77950b401d85b4c1e12290145ccd17a716b07f9328bd5864aa2d402b6a819ff3be7c833d9748ff8ba7
+  languageName: node
+  linkType: hard
+
 "lru-cache@npm:^5.1.1":
   version: 5.1.1
   resolution: "lru-cache@npm:5.1.1"
@@ -19439,6 +19473,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"prismjs@npm:^1.27.0":
+  version: 1.29.0
+  resolution: "prismjs@npm:1.29.0"
+  checksum: 007a8869d4456ff8049dc59404e32d5666a07d99c3b0e30a18bd3b7676dfa07d1daae9d0f407f20983865fd8da56de91d09cb08e6aa61f5bc420a27c0beeaf93
+  languageName: node
+  linkType: hard
+
+"prismjs@npm:~1.27.0":
+  version: 1.27.0
+  resolution: "prismjs@npm:1.27.0"
+  checksum: 85c7f4a3e999073502cc9e1882af01e3709706369ec254b60bff1149eda701f40d02512acab956012dc7e61cfd61743a3a34c1bd0737e8dbacd79141e5698bbc
+  languageName: node
+  linkType: hard
+
 "proc-log@npm:^3.0.0":
   version: 3.0.0
   resolution: "proc-log@npm:3.0.0"
@@ -20162,6 +20210,21 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-syntax-highlighter@npm:^15.5.0":
+  version: 15.5.0
+  resolution: "react-syntax-highlighter@npm:15.5.0"
+  dependencies:
+    "@babel/runtime": ^7.3.1
+    highlight.js: ^10.4.1
+    lowlight: ^1.17.0
+    prismjs: ^1.27.0
+    refractor: ^3.6.0
+  peerDependencies:
+    react: ">= 0.14.0"
+  checksum: c082b48f30f8ba8d0c55ed1d761910630860077c7ff5793c4c912adcb5760df06436ed0ad62be0de28113aac9ad2af55eccd995f8eee98df53382e4ced2072fb
+  languageName: node
+  linkType: hard
+
 "react-textarea-autosize@npm:^8.3.2":
   version: 8.5.2
   resolution: "react-textarea-autosize@npm:8.5.2"
@@ -20432,6 +20495,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"refractor@npm:^3.6.0":
+  version: 3.6.0
+  resolution: "refractor@npm:3.6.0"
+  dependencies:
+    hastscript: ^6.0.0
+    parse-entities: ^2.0.0
+    prismjs: ~1.27.0
+  checksum: 39b01c4168c77c5c8486f9bf8907bbb05f257f15026057ba5728535815a2d90eed620468a4bfbb2b8ceefbb3ce3931a1be8b17152dbdbc8b0eef92450ff750a2
+  languageName: node
+  linkType: hard
+
 "regenerate-unicode-properties@npm:^10.1.0":
   version: 10.1.0
   resolution: "regenerate-unicode-properties@npm:10.1.0"