diff --git a/web/src/components/Footer.tsx b/web/src/components/Footer.tsx
index 186fbbe..820c33d 100644
--- a/web/src/components/Footer.tsx
+++ b/web/src/components/Footer.tsx
@@ -1,10 +1,10 @@
 import React from 'react';
 import { useTranslation } from 'react-i18not';
-import { Link } from 'wouter';
 import { observer } from 'mobx-react-lite';
 import clsx from 'clsx';
 
 import styles from './Footer.module.scss';
+import { Link } from './Link.js';
 import { applicationStore } from '../stores/index.js';
 
 export const Footer: React.FC = observer(() => {
diff --git a/web/src/components/Header.tsx b/web/src/components/Header.tsx
index 1c3c831..1ffcdf0 100644
--- a/web/src/components/Header.tsx
+++ b/web/src/components/Header.tsx
@@ -5,10 +5,10 @@ import {
   IoInformationCircle,
   IoLogoTwitter,
 } from 'react-icons/io5';
-import { Link } from 'wouter';
 import { observer } from 'mobx-react-lite';
 
 import styles from './Header.module.scss';
+import { Link } from './Link.js';
 import { DropIcon } from './DropIcon.js';
 import { applicationStore } from '../stores/index.js';
 import { SecureStatus } from './SecureStatus.js';
diff --git a/web/src/components/Link.tsx b/web/src/components/Link.tsx
new file mode 100644
index 0000000..28d4832
--- /dev/null
+++ b/web/src/components/Link.tsx
@@ -0,0 +1,45 @@
+import React, { forwardRef } from 'react';
+import { useLocation, useRouter } from 'wouter';
+
+interface LinkProps
+  extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> {
+  to: string;
+}
+
+export const Link: React.FC<LinkProps> = forwardRef<
+  HTMLAnchorElement,
+  LinkProps
+>((props, ref) => {
+  const router = useRouter();
+  const [, navigate] = useLocation();
+
+  const { to, onClick, children, ...aProps } = props;
+
+  return (
+    <a
+      ref={ref}
+      {...aProps}
+      href={to[0] === '~' ? to.slice(1) : router.base + to}
+      onClick={event => {
+        // ignores the navigation when clicked using right mouse button or
+        // by holding a special modifier key: ctrl, command, win, alt, shift
+        if (
+          event.ctrlKey ||
+          event.metaKey ||
+          event.altKey ||
+          event.shiftKey ||
+          event.button !== 0
+        )
+          return;
+
+        onClick && onClick(event);
+        if (!event.defaultPrevented) {
+          event.preventDefault();
+          navigate(to);
+        }
+      }}
+    >
+      {children}
+    </a>
+  );
+});
diff --git a/web/src/screens/About.tsx b/web/src/screens/About.tsx
index 73570d0..cec1967 100644
--- a/web/src/screens/About.tsx
+++ b/web/src/screens/About.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
-import { Link } from 'wouter';
 
+import { Link } from '../components/Link.js';
 import { TextSection } from '../components/TextSection.js';
 
 export const About: React.FC = () => {
diff --git a/web/src/screens/Abuse.tsx b/web/src/screens/Abuse.tsx
index d748822..6808fc6 100644
--- a/web/src/screens/Abuse.tsx
+++ b/web/src/screens/Abuse.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
-import { Link } from 'wouter';
 import { observer } from 'mobx-react-lite';
 
+import { Link } from '../components/Link.js';
 import { TextSection } from '../components/TextSection.js';
 import { applicationStore } from '../stores/index.js';
 
diff --git a/web/src/sections/LocalNetworks/index.tsx b/web/src/sections/LocalNetworks/index.tsx
index 19a31e4..16e242b 100644
--- a/web/src/sections/LocalNetworks/index.tsx
+++ b/web/src/sections/LocalNetworks/index.tsx
@@ -1,9 +1,9 @@
 import React from 'react';
 import clsx from 'clsx';
 import { observer } from 'mobx-react-lite';
-import { Link } from 'wouter';
 
 import styles from './index.module.scss';
+import { Link } from '../../components/Link.js';
 import { applicationStore, networkStore } from '../../stores/index.js';
 import { TargetTile } from '../../components/TargetTile.js';