diff --git a/public/gateway-card-images/mollie.png b/public/gateway-card-images/mollie.png
deleted file mode 100644
index 8d9434d0ca..0000000000
Binary files a/public/gateway-card-images/mollie.png and /dev/null differ
diff --git a/src/components/icons/MollieIcon.tsx b/src/components/icons/MollieIcon.tsx
new file mode 100644
index 0000000000..d390e5b116
--- /dev/null
+++ b/src/components/icons/MollieIcon.tsx
@@ -0,0 +1,42 @@
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2022. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://www.elastic.co/licensing/elastic-license
+ */
+
+interface Props {
+  size?: string;
+  color?: string;
+}
+
+export function MollieIcon(props: Props) {
+  const { size = '2rem', color = 'currentColor' } = props;
+
+  return (
+    <svg
+      version="1.1"
+      xmlns="http://www.w3.org/2000/svg"
+      xmlnsXlink="http://www.w3.org/1999/xlink"
+      x="0px"
+      y="0px"
+      viewBox="0 0 320 94"
+      style={{
+        width: size,
+        height: 'auto',
+        aspectRatio: '320/94',
+      }}
+      xmlSpace="preserve"
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        fill={color}
+        d="M289.3,44.3c6.9,0,13.2,4.5,15.4,11h-30.7C276.1,48.9,282.3,44.3,289.3,44.3z M320,60.9c0-8-3.1-15.6-8.8-21.4c-5.7-5.8-13.3-9-21.3-9h-0.4c-8.3,0.1-16.2,3.4-22.1,9.3c-5.9,5.9-9.2,13.7-9.3,22c-0.1,8.5,3.2,16.5,9.2,22.6c6.1,6.1,14.1,9.5,22.6,9.5h0c11.2,0,21.7-6,27.4-15.6l0.7-1.2l-12.6-6.2l-0.6,1c-3.1,5.2-8.6,8.2-14.7,8.2c-7.7,0-14.4-5.1-16.5-12.5H320V60.9z M241.2,19.8c-5.5,0-9.9-4.4-9.9-9.9c0-5.5,4.4-9.9,9.9-9.9s9.9,4.4,9.9,9.9C251.2,15.3,246.7,19.8,241.2,19.8z M233.6,92.7h15.2V31.8h-15.2V92.7z M204.5,1.3h15.2v91.5h-15.2V1.3z M175.4,92.7h15.2V1.3h-15.2V92.7z M135.3,79c-9.2,0-16.8-7.5-16.8-16.7c0-9.2,7.5-16.7,16.8-16.7s16.8,7.5,16.8,16.7C152.1,71.5,144.6,79,135.3,79z M135.3,30.5c-17.6,0-31.8,14.2-31.8,31.7S117.8,94,135.3,94c17.5,0,31.8-14.2,31.8-31.7S152.9,30.5,135.3,30.5z M70.4,30.6c-0.8-0.1-1.6-0.1-2.4-0.1c-7.7,0-15,3.1-20.2,8.7c-5.2-5.5-12.5-8.7-20.1-8.7C12.4,30.5,0,42.9,0,58v34.7h14.9V58.5c0-6.3,5.2-12.1,11.3-12.7c0.4,0,0.9-0.1,1.3-0.1c6.9,0,12.5,5.6,12.5,12.5v34.6h15.2V58.4c0-6.3,5.2-12.1,11.3-12.7c0.4,0,0.9-0.1,1.3-0.1c6.9,0,12.5,5.6,12.6,12.4v34.7h15.2V58.5c0-7-2.6-13.6-7.2-18.8C83.7,34.4,77.3,31.2,70.4,30.6z"
+      />
+    </svg>
+  );
+}
diff --git a/src/pages/clients/show/components/GatewayTypeIcon.tsx b/src/pages/clients/show/components/GatewayTypeIcon.tsx
index 3657f6b51c..1515dff948 100644
--- a/src/pages/clients/show/components/GatewayTypeIcon.tsx
+++ b/src/pages/clients/show/components/GatewayTypeIcon.tsx
@@ -17,7 +17,7 @@ import paypalLogo from '/gateway-card-images/paypal.png';
 import braintreeLogo from '/gateway-card-images/braintree.svg.png';
 import checkoutcomLogo from '/gateway-card-images/checkout.jpg';
 import goCardlessLogo from '/gateway-card-images/gocardless.png';
-import mollieLogo from '/gateway-card-images/mollie.png';
+import { MollieIcon } from '$app/components/icons/MollieIcon';
 import payfastLogo from '/gateway-card-images/payfast.png';
 import paytraceLogo from '/gateway-card-images/paytrace.svg';
 import razorpayLogo from '/gateway-card-images/razorpay.png';
@@ -175,11 +175,9 @@ export function GatewayTypeIcon(props: Props) {
 
     case 'mollie':
       return (
-        <img
-          src={mollieLogo}
-          alt="Mollie"
-          style={props.style || { width: 40, height: 40 }}
-        />
+        <div style={props.style || { width: 40, height: 40, display: 'flex' }}>
+          <MollieIcon />
+        </div>
       );
 
     case 'payfast':