diff --git a/src/frontend/apps/desk/cunningham.ts b/src/frontend/apps/desk/cunningham.ts
index c27c164..a179392 100644
--- a/src/frontend/apps/desk/cunningham.ts
+++ b/src/frontend/apps/desk/cunningham.ts
@@ -191,6 +191,7 @@ const config = {
           'card-border': '#DDDDDD',
           'primary-text': '#000091',
           'primary-100': '#f5f5fe',
+          'primary-150': '#F4F4FD',
           'primary-200': '#ececfe',
           'primary-300': '#e3e3fd',
           'primary-400': '#cacafb',
diff --git a/src/frontend/apps/desk/src/cunningham/cunningham-tokens.css b/src/frontend/apps/desk/src/cunningham/cunningham-tokens.css
index 9b4cabe..0653c76 100644
--- a/src/frontend/apps/desk/src/cunningham/cunningham-tokens.css
+++ b/src/frontend/apps/desk/src/cunningham/cunningham-tokens.css
@@ -334,6 +334,7 @@
   --c--theme--colors--card-border: #ddd;
   --c--theme--colors--primary-text: #000091;
   --c--theme--colors--primary-100: #f5f5fe;
+  --c--theme--colors--primary-150: #f4f4fd;
   --c--theme--colors--primary-200: #ececfe;
   --c--theme--colors--primary-300: #e3e3fd;
   --c--theme--colors--primary-400: #cacafb;
diff --git a/src/frontend/apps/desk/src/cunningham/cunningham-tokens.ts b/src/frontend/apps/desk/src/cunningham/cunningham-tokens.ts
index a10a26d..18a7942 100644
--- a/src/frontend/apps/desk/src/cunningham/cunningham-tokens.ts
+++ b/src/frontend/apps/desk/src/cunningham/cunningham-tokens.ts
@@ -335,6 +335,7 @@ export const tokens = {
           'card-border': '#DDDDDD',
           'primary-text': '#000091',
           'primary-100': '#f5f5fe',
+          'primary-150': '#F4F4FD',
           'primary-200': '#ececfe',
           'primary-300': '#e3e3fd',
           'primary-400': '#cacafb',
diff --git a/src/frontend/apps/desk/src/features/teams/assets/icon-trash.svg b/src/frontend/apps/desk/src/features/teams/assets/icon-trash.svg
new file mode 100644
index 0000000..caa4e96
--- /dev/null
+++ b/src/frontend/apps/desk/src/features/teams/assets/icon-trash.svg
@@ -0,0 +1,3 @@
+<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 38C12 40.2 13.8 42 16 42H32C34.2 42 36 40.2 36 38V14H12V38ZM18.34 25.18C17.56 24.4 17.56 23.14 18.34 22.36C19.12 21.58 20.38 21.58 21.16 22.36L24 25.18L26.82 22.36C27.6 21.58 28.86 21.58 29.64 22.36C30.42 23.14 30.42 24.4 29.64 25.18L26.82 28L29.64 30.82C30.42 31.6 30.42 32.86 29.64 33.64C28.86 34.42 27.6 34.42 26.82 33.64L24 30.82L21.18 33.64C20.4 34.42 19.14 34.42 18.36 33.64C17.58 32.86 17.58 31.6 18.36 30.82L21.18 28L18.34 25.18ZM36 8H31L29.58 6.58C29.22 6.22 28.7 6 28.18 6H19.82C19.3 6 18.78 6.22 18.42 6.58L17 8H12C10.9 8 10 8.9 10 10C10 11.1 10.9 12 12 12H36C37.1 12 38 11.1 38 10C38 8.9 37.1 8 36 8Z" fill="#000091"/>
+</svg>
diff --git a/src/frontend/apps/desk/src/features/teams/components/ModalRemoveTeam.tsx b/src/frontend/apps/desk/src/features/teams/components/ModalRemoveTeam.tsx
new file mode 100644
index 0000000..04d2d82
--- /dev/null
+++ b/src/frontend/apps/desk/src/features/teams/components/ModalRemoveTeam.tsx
@@ -0,0 +1,119 @@
+import {
+  Button,
+  Modal,
+  ModalSize,
+  VariantType,
+  useToastProvider,
+} from '@openfun/cunningham-react';
+import { t } from 'i18next';
+import { useRouter } from 'next/navigation';
+
+import IconGroup from '@/assets/icons/icon-group.svg';
+import { Box, Text, TextErrors } from '@/components';
+import useCunninghamTheme from '@/cunningham/useCunninghamTheme';
+
+import { useRemoveTeam } from '../api/useRemoveTeam';
+import IconRemove from '../assets/icon-trash.svg';
+import { Team } from '../types';
+
+interface ModalRemoveTeamProps {
+  onClose: () => void;
+  team: Team;
+}
+
+export const ModalRemoveTeam = ({ onClose, team }: ModalRemoveTeamProps) => {
+  const { colorsTokens } = useCunninghamTheme();
+  const { toast } = useToastProvider();
+  const router = useRouter();
+
+  const {
+    mutate: removeTeam,
+    isError,
+    error,
+  } = useRemoveTeam({
+    onSuccess: () => {
+      toast(t('The team has been removed.'), VariantType.SUCCESS, {
+        duration: 4000,
+      });
+      router.push('/');
+    },
+  });
+
+  return (
+    <Modal
+      isOpen
+      closeOnClickOutside
+      hideCloseButton
+      leftActions={
+        <Button
+          aria-label={t('Close the modal')}
+          color="secondary"
+          fullWidth
+          onClick={() => onClose()}
+        >
+          {t('Cancel')}
+        </Button>
+      }
+      onClose={() => onClose()}
+      rightActions={
+        <Button
+          aria-label={t('Confirm deletion')}
+          color="primary"
+          fullWidth
+          onClick={() =>
+            removeTeam({
+              teamId: team.id,
+            })
+          }
+        >
+          {t('Confirm deletion')}
+        </Button>
+      }
+      size={ModalSize.MEDIUM}
+      title={
+        <Box $align="center" $gap="1rem">
+          <IconRemove width={48} color={colorsTokens()['primary-text']} />
+          <Text $size="h3" className="m-0">
+            {t('Deleting the {{teamName}} team', { teamName: team.name })}
+          </Text>
+        </Box>
+      }
+    >
+      <Box className="mb-xl" aria-label={t('Content modal to delete the team')}>
+        <Text as="p" className="mb-b">
+          {t('Are you sure you want to delete {{teamName}} team?', {
+            teamName: team.name,
+          })}
+        </Text>
+
+        {isError && <TextErrors className="mb-s" causes={error.cause} />}
+
+        <Text
+          as="p"
+          className="p-s"
+          $direction="row"
+          $gap="0.5rem"
+          $background={colorsTokens()['primary-150']}
+          $theme="primary"
+          $align="center"
+          $radius="2px"
+        >
+          <IconGroup
+            className="p-t"
+            aria-label={t(`Teams icon`)}
+            color={colorsTokens()['primary-500']}
+            width={58}
+            style={{
+              borderRadius: '8px',
+              backgroundColor: '#ffffff',
+              border: `1px solid ${colorsTokens()['primary-300']}`,
+            }}
+          />
+          <Text $theme="primary" $weight="bold" $size="l">
+            {team.name}
+          </Text>
+        </Text>
+      </Box>
+    </Modal>
+  );
+};