diff --git a/docs/src/theme/Footer/Copyright/index.js b/docs/src/theme/Footer/Copyright/index.js
deleted file mode 100644
index a2a19262d2..0000000000
--- a/docs/src/theme/Footer/Copyright/index.js
+++ /dev/null
@@ -1,40 +0,0 @@
-import React from 'react';
-import clsx from 'clsx';
-import styles from './styles.module.css';
-import useBaseUrl from '@docusaurus/useBaseUrl';
-import ThemedImage from '@theme/ThemedImage';
-
-import usePageType from '@site/src/hooks/usePageType';
-
-const BRAND_LINK = 'https://swmansion.com/';
-
-export default function FooterCopyright({ copyright }) {
-  const { isDocumentation } = usePageType();
-
-  const brandLogo = {
-    light: useBaseUrl('/img/brand.svg'),
-    dark: useBaseUrl('/img/brand-dark.svg'),
-  };
-
-  return (
-    <div className={clsx('footer__copyright', styles.footer)}>
-      {
-        <a href={BRAND_LINK} target="_blank">
-          <div className={styles.footer__logo}>
-            <ThemedImage sources={brandLogo} />
-          </div>
-        </a>
-      }
-      <p className={clsx(!isDocumentation && styles.landing)}>
-        <span className={styles.footer__brand}>
-          &copy;{' '}
-          <a href={BRAND_LINK} target="_blank">
-            Software Mansion
-          </a>
-          {' ' + new Date().getFullYear()}.
-        </span>
-        {` ${copyright}`}
-      </p>
-    </div>
-  );
-}
diff --git a/docs/src/theme/Footer/Copyright/styles.module.css b/docs/src/theme/Footer/Copyright/styles.module.css
deleted file mode 100644
index f76bf3caf2..0000000000
--- a/docs/src/theme/Footer/Copyright/styles.module.css
+++ /dev/null
@@ -1,65 +0,0 @@
-footer {
-  --ifm-footer-padding-vertical: 33px;
-  --ifm-footer-padding-horizontal: 4rem;
-  --ifm-footer-background-color: transparent;
-}
-
-@media (max-width: 996px) {
-  footer {
-    --ifm-footer-padding-vertical: 1.5em;
-  }
-}
-
-.footer {
-  display: flex;
-  justify-content: flex-start;
-  background-color: none;
-  align-items: center;
-}
-
-@media (max-width: 996px) {
-  .footer {
-    flex-direction: column;
-    align-items: flex-start;
-  }
-}
-
-footer p {
-  color: var(--swm-copyright-color);
-  margin-bottom: 0;
-
-  text-align: left;
-}
-
-footer p.landing {
-  color: var(--swm-copyright-color-landing);
-}
-
-@media (max-width: 996px) {
-  footer [class*='footer__copyright'] {
-    padding: 0 8px 0 8px;
-  }
-}
-
-.footer__brand {
-  color: var(--swm-brand-copyright-color);
-}
-
-.footer__brand a {
-  text-decoration: none;
-}
-
-.footer__logo {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  margin-right: 40px;
-}
-
-@media (max-width: 996px) {
-  .footer__logo {
-    width: 60px;
-    height: 32px;
-    margin: 0 0 1rem 0;
-  }
-}
diff --git a/docs/src/theme/Footer/Layout/index.js b/docs/src/theme/Footer/Layout/index.js
deleted file mode 100644
index e9e22de681..0000000000
--- a/docs/src/theme/Footer/Layout/index.js
+++ /dev/null
@@ -1,25 +0,0 @@
-import React from 'react';
-import clsx from 'clsx';
-import styles from './styles.module.css';
-import usePageType from '@site/src/hooks/usePageType';
-
-export default function FooterLayout({ style, links, logo, copyright }) {
-  const { isLanding } = usePageType();
-
-  return (
-    <footer
-      className={clsx('footer', isLanding && styles.footerLanding, {
-        'footer--dark': style === 'dark',
-      })}>
-      <div className="container container-fluid">
-        {links}
-        {(logo || copyright) && (
-          <div className="footer__bottom text--center">
-            {logo && <div className="margin-bottom--sm">{logo}</div>}
-            {copyright}
-          </div>
-        )}
-      </div>
-    </footer>
-  );
-}
diff --git a/docs/src/theme/Footer/Layout/styles.module.css b/docs/src/theme/Footer/Layout/styles.module.css
deleted file mode 100644
index 9eef21e113..0000000000
--- a/docs/src/theme/Footer/Layout/styles.module.css
+++ /dev/null
@@ -1,15 +0,0 @@
-footer {
-  position: relative;
-}
-
-.footerLanding {
-  --ifm-footer-background-color: transparent;
-  --ifm-footer-padding-horizontal: 0;
-  position: relative;
-}
-
-@media (min-width: 996px) and (max-width: 1280px) {
-  .footerLanding [class*='footer__copyright'] {
-    padding: 0 2rem;
-  }
-}
diff --git a/docs/src/theme/Footer/index.js b/docs/src/theme/Footer/index.js
new file mode 100644
index 0000000000..9e9ef474cd
--- /dev/null
+++ b/docs/src/theme/Footer/index.js
@@ -0,0 +1,3 @@
+import { Footer } from '@swmansion/t-rex-ui';
+
+export default Footer;