diff --git a/package.json b/package.json
index 28d88350f..b4324e701 100644
--- a/package.json
+++ b/package.json
@@ -61,6 +61,7 @@
     "react-dropzone": "^11.5.1",
     "react-hook-form": "^7.22.2",
     "react-i18next": "^13.2.2",
+    "react-responsive-carousel": "^3.2.23",
     "react-router-dom": "^6.0.2",
     "rudder-sdk-js": "^2.20.0",
     "sanitize-html": "^2.12.1",
diff --git a/src/containers/carousel/index.tsx b/src/containers/carousel/index.tsx
new file mode 100644
index 000000000..832e0071e
--- /dev/null
+++ b/src/containers/carousel/index.tsx
@@ -0,0 +1,139 @@
+import React, {useMemo, useCallback} from 'react';
+import {Carousel as ReactResponsiveCarousel} from 'react-responsive-carousel';
+import styled from 'styled-components';
+import {useNavigate} from 'react-router-dom';
+import 'react-responsive-carousel/lib/styles/carousel.min.css';
+import CTACard from 'components/ctaCard';
+import {CTACards} from 'components/ctaCard/data';
+import useScreen from 'hooks/useScreen';
+import {useWallet} from 'hooks/useWallet';
+import {trackEvent} from 'services/analytics';
+
+const Carousel: React.FC = () => {
+  const {isDesktop} = useScreen();
+  const navigate = useNavigate();
+  const {methods, isConnected} = useWallet();
+
+  // TODO
+  // this prevents the user from entering the creation
+  // flow without a wallet, but this should be updated
+  // when the rest of CTAs are enabled
+  const handleCTAClick = useCallback(
+    (path: string) => {
+      if (path === '/create') {
+        trackEvent('landing_createDaoBtn_clicked');
+      }
+
+      if (path.startsWith('http')) {
+        window.open(path, '_blank');
+        return;
+      }
+
+      if (isConnected) {
+        navigate(path);
+        return;
+      }
+
+      methods
+        .selectWallet()
+        .then(() => {
+          navigate(path);
+        })
+        .catch((err: Error) => {
+          // To be implemented: maybe add an error message when
+          // the error is different from closing the window
+          console.error(err);
+        });
+    },
+    [isConnected, methods, navigate]
+  );
+
+  const ctaList = useMemo(
+    () =>
+      CTACards.map(card => (
+        <CTACard
+          key={card.title}
+          {...card}
+          className="flex-1"
+          onClick={handleCTAClick}
+        />
+      )),
+    [handleCTAClick]
+  );
+
+  if (isDesktop) {
+    return <DesktopCTA>{ctaList}</DesktopCTA>;
+  } else {
+    return (
+      <MobileCTA>
+        <StyledCarousel
+          swipeable
+          emulateTouch
+          centerMode
+          autoPlay
+          preventMovementUntilSwipeScrollTolerance
+          swipeScrollTolerance={100}
+          interval={4000}
+          showArrows={false}
+          showStatus={false}
+          transitionTime={300}
+          centerSlidePercentage={92}
+          showThumbs={false}
+          infiniteLoop
+          renderIndicator={(onClickHandler, isSelected, index, label) => {
+            if (isSelected) {
+              return (
+                <ActiveIndicator
+                  aria-label={`Selected: ${label} ${index + 1}`}
+                  title={`Selected: ${label} ${index + 1}`}
+                />
+              );
+            }
+            return (
+              <Indicator
+                onClick={onClickHandler}
+                onKeyDown={onClickHandler}
+                value={index}
+                key={index}
+                role="button"
+                tabIndex={0}
+                title={`${label} ${index + 1}`}
+                aria-label={`${label} ${index + 1}`}
+              />
+            );
+          }}
+        >
+          {ctaList}
+        </StyledCarousel>
+      </MobileCTA>
+    );
+  }
+};
+
+const DesktopCTA = styled.div.attrs({
+  className:
+    'relative flex xl:flex-row flex-col mb-8 space-x-6 max-w-fit -mt-32',
+})``;
+
+const MobileCTA = styled.div.attrs({
+  className: 'relative -mt-[104px] mb-10 -mx-4 md:-mx-6 xl:mx-0',
+})``;
+
+export const ActiveIndicator = styled.li.attrs({
+  className: 'inline-block bg-primary-500 h-1.5 w-12 ml-2 rounded-xl',
+})``;
+
+export const Indicator = styled.li.attrs({
+  className: 'inline-block bg-neutral-200 h-1.5 w-4 ml-2 rounded-xl',
+})``;
+
+export const StyledCarousel = styled(ReactResponsiveCarousel).attrs({})`
+  & > .carousel-slider > ul {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin: 0px;
+  }
+`;
+
+export default Carousel;
diff --git a/src/containers/daoOverview/index.tsx b/src/containers/daoOverview/index.tsx
index d4564f1f9..6326c75cc 100644
--- a/src/containers/daoOverview/index.tsx
+++ b/src/containers/daoOverview/index.tsx
@@ -2,14 +2,9 @@ import {Breadcrumb} from '@aragon/ods-old';
 import React from 'react';
 import {useTranslation} from 'react-i18next';
 import styled from 'styled-components';
-
 import CardWithImage from 'components/cardWithImage';
 import {useFormStep} from 'components/fullScreenStepper';
-import {
-  ActiveIndicator,
-  Indicator,
-  StyledCarousel,
-} from 'containers/explorerCta';
+import {ActiveIndicator, Indicator, StyledCarousel} from 'containers/carousel';
 import useScreen from 'hooks/useScreen';
 import {trackEvent} from 'services/analytics';
 import {i18n} from '../../../i18n.config';
diff --git a/yarn.lock b/yarn.lock
index c5dbeee13..6ce9cabef 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6043,7 +6043,7 @@ cjs-module-lexer@^1.0.0:
   resolved "https://registry.yarnpkg.com/cjs-module-lexer/-/cjs-module-lexer-1.2.3.tgz#6c370ab19f8a3394e318fe682686ec0ac684d107"
   integrity sha512-0TNiGstbQmCFwt4akjjBg5pLRTSyj/PkWQ1ZoO2zntmg9yLqSRxwEa4iCfQLGjqhiqBfOJa7W/E8wfGrTDmlZQ==
 
-classnames@^2.0.0:
+classnames@^2.0.0, classnames@^2.2.5:
   version "2.5.1"
   resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.5.1.tgz#ba774c614be0f016da105c858e7159eae8e7687b"
   integrity sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==
@@ -9913,7 +9913,7 @@ prompts@^2.0.1:
     kleur "^3.0.3"
     sisteransi "^1.0.5"
 
-prop-types@^15.5.10, prop-types@^15.7.2, prop-types@^15.8.1:
+prop-types@^15.5.10, prop-types@^15.5.8, prop-types@^15.7.2, prop-types@^15.8.1:
   version "15.8.1"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"
   integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==
@@ -10227,6 +10227,13 @@ react-dropzone@^14.2.0:
     file-selector "^0.6.0"
     prop-types "^15.8.1"
 
+react-easy-swipe@^0.0.21:
+  version "0.0.21"
+  resolved "https://registry.yarnpkg.com/react-easy-swipe/-/react-easy-swipe-0.0.21.tgz#ce9384d576f7a8529dc2ca377c1bf03920bac8eb"
+  integrity sha512-OeR2jAxdoqUMHIn/nS9fgreI5hSpgGoL5ezdal4+oO7YSSgJR8ga+PkYGJrSrJ9MKlPcQjMQXnketrD7WNmNsg==
+  dependencies:
+    prop-types "^15.5.8"
+
 react-hook-form@^7.22.2:
   version "7.22.2"
   resolved "https://registry.yarnpkg.com/react-hook-form/-/react-hook-form-7.22.2.tgz#aa66fd75cad858049739770341079d9787683c6b"
@@ -10295,6 +10302,15 @@ react-remove-scroll@2.5.5:
     use-callback-ref "^1.3.0"
     use-sidecar "^1.1.2"
 
+react-responsive-carousel@^3.2.23:
+  version "3.2.23"
+  resolved "https://registry.yarnpkg.com/react-responsive-carousel/-/react-responsive-carousel-3.2.23.tgz#4c0016ff54603e604bb5c1f9e7ef2d1eda133f1d"
+  integrity sha512-pqJLsBaKHWJhw/ItODgbVoziR2z4lpcJg+YwmRlSk4rKH32VE633mAtZZ9kDXjy4wFO+pgUZmDKPsPe1fPmHCg==
+  dependencies:
+    classnames "^2.2.5"
+    prop-types "^15.5.8"
+    react-easy-swipe "^0.0.21"
+
 react-router-dom@^6.0.2:
   version "6.0.2"
   resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-6.0.2.tgz#860cefa697b9d4965eced3f91e82cdbc5995f3ad"