diff --git a/extensions/ql-vscode/src/stories/common/Alert.stories.tsx b/extensions/ql-vscode/src/stories/common/Alert.stories.tsx
index f82eaa17100..1a5db4f14f6 100644
--- a/extensions/ql-vscode/src/stories/common/Alert.stories.tsx
+++ b/extensions/ql-vscode/src/stories/common/Alert.stories.tsx
@@ -1,8 +1,9 @@
 import type { Meta, StoryFn } from "@storybook/react";
-import { VSCodeButton, VSCodeLink } from "@vscode/webview-ui-toolkit/react";
+import { VSCodeButton } from "@vscode/webview-ui-toolkit/react";
 
 import { VariantAnalysisContainer } from "../../view/variant-analysis/VariantAnalysisContainer";
 import { Alert } from "../../view/common";
+import { Link } from "../../view/common/Link";
 
 export default {
   title: "Alert",
@@ -24,7 +25,7 @@ Warning.args = {
   title: "This query found a warning",
   message: (
     <>
-      Warning content with <VSCodeLink>links</VSCodeLink>
+      Warning content with <Link>links</Link>
     </>
   ),
 };
@@ -50,7 +51,7 @@ Error.args = {
   title: "This query found an error",
   message: (
     <>
-      Error content with <VSCodeLink>links</VSCodeLink>
+      Error content with <Link>links</Link>
     </>
   ),
 };
@@ -70,8 +71,7 @@ ErrorExample.args = {
     <>
       Request to
       https://api.github.com/repos/octodemo/Hello-World/code-scanning/codeql/queries
-      failed. <VSCodeLink>View actions logs</VSCodeLink> and try running this
-      query again.
+      failed. <Link>View actions logs</Link> and try running this query again.
     </>
   ),
 };
diff --git a/extensions/ql-vscode/src/view/common/CodePaths/CodePaths.tsx b/extensions/ql-vscode/src/view/common/CodePaths/CodePaths.tsx
index 301107afcc5..520d26a3d83 100644
--- a/extensions/ql-vscode/src/view/common/CodePaths/CodePaths.tsx
+++ b/extensions/ql-vscode/src/view/common/CodePaths/CodePaths.tsx
@@ -1,5 +1,5 @@
 import { styled } from "styled-components";
-import { VSCodeLink } from "@vscode/webview-ui-toolkit/react";
+import { Link } from "../Link";
 
 import type {
   AnalysisMessage,
@@ -8,7 +8,7 @@ import type {
 } from "../../../variant-analysis/shared/analysis-result";
 import { vscode } from "../../vscode-api";
 
-const ShowPathsLink = styled(VSCodeLink)`
+const ShowPathsLink = styled(Link)`
   cursor: pointer;
 `;
 
diff --git a/extensions/ql-vscode/src/view/common/FileCodeSnippet/CodeSnippetMessage.tsx b/extensions/ql-vscode/src/view/common/FileCodeSnippet/CodeSnippetMessage.tsx
index 6e209a340d4..09ec16d4288 100644
--- a/extensions/ql-vscode/src/view/common/FileCodeSnippet/CodeSnippetMessage.tsx
+++ b/extensions/ql-vscode/src/view/common/FileCodeSnippet/CodeSnippetMessage.tsx
@@ -1,5 +1,5 @@
 import { styled } from "styled-components";
-import { VSCodeLink } from "@vscode/webview-ui-toolkit/react";
+import { Link } from "../Link";
 
 import type {
   AnalysisMessage,
@@ -39,7 +39,7 @@ const CodeSnippetMessageContainer = styled.div<CodeSnippetMessageContainerProps>
   padding-bottom: 1em;
 `;
 
-const LocationLink = styled(VSCodeLink)`
+const LocationLink = styled(Link)`
   font-family: var(--vscode-editor-font-family);
 `;
 
diff --git a/extensions/ql-vscode/src/view/common/FileCodeSnippet/FileCodeSnippet.tsx b/extensions/ql-vscode/src/view/common/FileCodeSnippet/FileCodeSnippet.tsx
index c6fdb624156..b97c7d79c0c 100644
--- a/extensions/ql-vscode/src/view/common/FileCodeSnippet/FileCodeSnippet.tsx
+++ b/extensions/ql-vscode/src/view/common/FileCodeSnippet/FileCodeSnippet.tsx
@@ -1,5 +1,4 @@
 import { styled } from "styled-components";
-import { VSCodeLink } from "@vscode/webview-ui-toolkit/react";
 
 import type {
   AnalysisMessage,
@@ -12,6 +11,7 @@ import { createRemoteFileRef } from "../../../common/location-link-utils";
 import { CodeSnippetMessage } from "./CodeSnippetMessage";
 import { CodeSnippetLine } from "./CodeSnippetLine";
 import { sendTelemetry } from "../telemetry";
+import { Link } from "../Link";
 
 const borderColor = "var(--vscode-editor-snippetFinalTabstopHighlightBorder)";
 
@@ -72,12 +72,9 @@ export const FileCodeSnippet = ({
     return (
       <Container>
         <TitleContainer>
-          <VSCodeLink
-            onClick={sendCodeSnippetTitleLinkTelemetry}
-            href={titleFileUri}
-          >
+          <Link onClick={sendCodeSnippetTitleLinkTelemetry} href={titleFileUri}>
             {fileLink.filePath}
-          </VSCodeLink>
+          </Link>
         </TitleContainer>
         {message && severity && (
           <CodeSnippetMessage message={message} severity={severity}>
@@ -93,12 +90,9 @@ export const FileCodeSnippet = ({
   return (
     <Container>
       <TitleContainer>
-        <VSCodeLink
-          onClick={sendCodeSnippetTitleLinkTelemetry}
-          href={titleFileUri}
-        >
+        <Link onClick={sendCodeSnippetTitleLinkTelemetry} href={titleFileUri}>
           {fileLink.filePath}
-        </VSCodeLink>
+        </Link>
       </TitleContainer>
       <CodeContainer>
         {code.map((line, index) => (
diff --git a/extensions/ql-vscode/src/view/common/Link.tsx b/extensions/ql-vscode/src/view/common/Link.tsx
new file mode 100644
index 00000000000..9fa73906433
--- /dev/null
+++ b/extensions/ql-vscode/src/view/common/Link.tsx
@@ -0,0 +1,25 @@
+import { styled } from "styled-components";
+
+export const Link = styled.a`
+  background: transparent;
+  box-sizing: border-box;
+  color: var(--link-foreground);
+  cursor: pointer;
+  fill: currentcolor;
+  font-family: var(--font-family);
+  font-size: var(--type-ramp-base-font-size);
+  line-height: var(--type-ramp-base-line-height);
+  outline: none;
+
+  &:hover {
+    text-decoration: underline;
+  }
+
+  &:focus-visible {
+    border: 1px solid var(--vscode-focusBorder);
+  }
+
+  &:focus {
+    border: 1px solid var(--vscode-focusBorder);
+  }
+`;
diff --git a/extensions/ql-vscode/src/view/common/LinkIconButton.tsx b/extensions/ql-vscode/src/view/common/LinkIconButton.tsx
index 8a8e4bbeba5..f282fb646f3 100644
--- a/extensions/ql-vscode/src/view/common/LinkIconButton.tsx
+++ b/extensions/ql-vscode/src/view/common/LinkIconButton.tsx
@@ -1,7 +1,7 @@
-import { VSCodeLink } from "@vscode/webview-ui-toolkit/react";
 import { styled } from "styled-components";
+import { Link } from "./Link";
 
-export const LinkIconButton = styled(VSCodeLink)`
+export const LinkIconButton = styled(Link)`
   .codicon {
     vertical-align: text-bottom;
   }
diff --git a/extensions/ql-vscode/src/view/model-alerts/ModelAlertsResults.tsx b/extensions/ql-vscode/src/view/model-alerts/ModelAlertsResults.tsx
index 51ea31ee88d..8b27896d333 100644
--- a/extensions/ql-vscode/src/view/model-alerts/ModelAlertsResults.tsx
+++ b/extensions/ql-vscode/src/view/model-alerts/ModelAlertsResults.tsx
@@ -1,7 +1,7 @@
 import { styled } from "styled-components";
 import type { ModelAlerts } from "../../model-editor/model-alerts/model-alerts";
 import { Codicon } from "../common";
-import { VSCodeBadge, VSCodeLink } from "@vscode/webview-ui-toolkit/react";
+import { VSCodeBadge } from "@vscode/webview-ui-toolkit/react";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { formatDecimal } from "../../common/number";
 import AnalysisAlertResult from "../variant-analysis/AnalysisAlertResult";
@@ -10,6 +10,7 @@ import { ModelDetails } from "./ModelDetails";
 import { vscode } from "../vscode-api";
 import { createModeledMethodKey } from "../../model-editor/modeled-method";
 import type { ModeledMethod } from "../../model-editor/modeled-method";
+import { Link } from "../common/Link";
 
 // This will ensure that these icons have a className which we can use in the TitleContainer
 const ExpandCollapseCodicon = styled(Codicon)``;
@@ -39,7 +40,7 @@ const ModelTypeText = styled.span`
   color: var(--vscode-descriptionForeground);
 `;
 
-const ViewLink = styled(VSCodeLink)`
+const ViewLink = styled(Link)`
   white-space: nowrap;
   padding: 0 0 0.25em 1em;
 `;
diff --git a/extensions/ql-vscode/src/view/model-editor/MethodRow.tsx b/extensions/ql-vscode/src/view/model-editor/MethodRow.tsx
index 46b7e7bee78..22dc54d2a48 100644
--- a/extensions/ql-vscode/src/view/model-editor/MethodRow.tsx
+++ b/extensions/ql-vscode/src/view/model-editor/MethodRow.tsx
@@ -1,8 +1,4 @@
-import {
-  VSCodeBadge,
-  VSCodeButton,
-  VSCodeLink,
-} from "@vscode/webview-ui-toolkit/react";
+import { VSCodeBadge, VSCodeButton } from "@vscode/webview-ui-toolkit/react";
 import {
   forwardRef,
   useCallback,
@@ -13,6 +9,7 @@ import {
 } from "react";
 import { styled } from "styled-components";
 import { vscode } from "../vscode-api";
+import { Link } from "../common/Link";
 
 import type { Method } from "../../model-editor/method";
 import type { ModeledMethod } from "../../model-editor/modeled-method";
@@ -59,7 +56,7 @@ const UsagesButton = styled(VSCodeBadge)`
   cursor: pointer;
 `;
 
-const ViewLink = styled(VSCodeLink)`
+const ViewLink = styled(Link)`
   white-space: nowrap;
 `;
 
diff --git a/extensions/ql-vscode/src/view/model-editor/ModelEvaluation.tsx b/extensions/ql-vscode/src/view/model-editor/ModelEvaluation.tsx
index de87fc663eb..95b94aa5411 100644
--- a/extensions/ql-vscode/src/view/model-editor/ModelEvaluation.tsx
+++ b/extensions/ql-vscode/src/view/model-editor/ModelEvaluation.tsx
@@ -1,11 +1,12 @@
 import { styled } from "styled-components";
-import { VSCodeButton, VSCodeLink } from "@vscode/webview-ui-toolkit/react";
+import { VSCodeButton } from "@vscode/webview-ui-toolkit/react";
 import type { ModeledMethod } from "../../model-editor/modeled-method";
 import type { ModelEditorViewState } from "../../model-editor/shared/view-state";
 import type { ModelEvaluationRunState } from "../../model-editor/shared/model-evaluation-run-state";
 import { modelEvaluationRunIsRunning } from "../../model-editor/shared/model-evaluation-run-state";
 import { ModelEditorProgressRing } from "./ModelEditorProgressRing";
 import { LinkIconButton } from "../common/LinkIconButton";
+import { Link } from "../common/Link";
 
 export type Props = {
   viewState: ModelEditorViewState;
@@ -17,7 +18,7 @@ export type Props = {
   evaluationRun: ModelEvaluationRunState | undefined;
 };
 
-const RunLink = styled(VSCodeLink)`
+const RunLink = styled(Link)`
   display: flex;
   align-items: center;
 `;
diff --git a/extensions/ql-vscode/src/view/variant-analysis/FailureReasonAlert.tsx b/extensions/ql-vscode/src/view/variant-analysis/FailureReasonAlert.tsx
index d6d07400584..1b6c631dbb7 100644
--- a/extensions/ql-vscode/src/view/variant-analysis/FailureReasonAlert.tsx
+++ b/extensions/ql-vscode/src/view/variant-analysis/FailureReasonAlert.tsx
@@ -1,8 +1,8 @@
 import type { ReactNode } from "react";
-import { VSCodeLink } from "@vscode/webview-ui-toolkit/react";
 import { Alert } from "../common";
 import { vscode } from "../vscode-api";
 import { VariantAnalysisFailureReason } from "../../variant-analysis/shared/variant-analysis";
+import { Link } from "../common/Link";
 
 type Props = {
   failureReason: VariantAnalysisFailureReason;
@@ -33,8 +33,8 @@ const getMessage = (failureReason: VariantAnalysisFailureReason): ReactNode => {
       return (
         <>
           The GitHub Actions workflow run has failed.{" "}
-          <VSCodeLink onClick={openLogs}>View actions logs</VSCodeLink> and try
-          running this query again.
+          <Link onClick={openLogs}>View actions logs</Link> and try running this
+          query again.
         </>
       );
     case VariantAnalysisFailureReason.InternalError:
diff --git a/extensions/ql-vscode/src/view/variant-analysis/RawResultCell.tsx b/extensions/ql-vscode/src/view/variant-analysis/RawResultCell.tsx
index 0d7f589043e..7382d46f04b 100644
--- a/extensions/ql-vscode/src/view/variant-analysis/RawResultCell.tsx
+++ b/extensions/ql-vscode/src/view/variant-analysis/RawResultCell.tsx
@@ -1,10 +1,9 @@
-import { VSCodeLink } from "@vscode/webview-ui-toolkit/react";
-
 import type { CellValue } from "../../common/raw-result-types";
 import { sendTelemetry } from "../common/telemetry";
 import { convertNonPrintableChars } from "../../common/text-utils";
 import { tryGetRemoteLocation } from "../../common/bqrs-utils";
 import { RawNumberValue } from "../common/RawNumberValue";
+import { Link } from "../common/Link";
 
 type CellProps = {
   value: CellValue;
@@ -35,9 +34,9 @@ export const RawResultCell = ({
       const safeLabel = convertNonPrintableChars(value.value.label);
       if (url) {
         return (
-          <VSCodeLink onClick={sendRawResultsLinkTelemetry} href={url}>
+          <Link onClick={sendRawResultsLinkTelemetry} href={url}>
             {safeLabel}
-          </VSCodeLink>
+          </Link>
         );
       } else {
         return <span>{safeLabel}</span>;
diff --git a/extensions/ql-vscode/src/view/variant-analysis/VariantAnalysisStatusStats.tsx b/extensions/ql-vscode/src/view/variant-analysis/VariantAnalysisStatusStats.tsx
index 3969fd7951e..5f937b74682 100644
--- a/extensions/ql-vscode/src/view/variant-analysis/VariantAnalysisStatusStats.tsx
+++ b/extensions/ql-vscode/src/view/variant-analysis/VariantAnalysisStatusStats.tsx
@@ -1,7 +1,7 @@
 import { styled } from "styled-components";
-import { VSCodeLink } from "@vscode/webview-ui-toolkit/react";
 import { formatDate } from "../../common/date";
 import { VariantAnalysisStatus } from "../../variant-analysis/shared/variant-analysis";
+import { Link } from "../common/Link";
 
 export type VariantAnalysisStatusStatsProps = {
   variantAnalysisStatus: VariantAnalysisStatus;
@@ -37,7 +37,7 @@ export const VariantAnalysisStatusStats = ({
         <span>{completedAt !== undefined ? formatDate(completedAt) : "-"}</span>
       )}
       {onViewLogsClick && (
-        <VSCodeLink onClick={onViewLogsClick}>View actions logs</VSCodeLink>
+        <Link onClick={onViewLogsClick}>View actions logs</Link>
       )}
     </Container>
   );