diff --git a/frontend/src/component/project/Project/ProjectStatus/ProjectActivity.tsx b/frontend/src/component/project/Project/ProjectStatus/ProjectActivity.tsx
index 4b8bb253b4..f7883fe912 100644
--- a/frontend/src/component/project/Project/ProjectStatus/ProjectActivity.tsx
+++ b/frontend/src/component/project/Project/ProjectStatus/ProjectActivity.tsx
@@ -3,11 +3,16 @@ import { useProjectStatus } from 'hooks/api/getters/useProjectStatus/useProjectS
 import ActivityCalendar, { type ThemeInput } from 'react-activity-calendar';
 import type { ProjectActivitySchema } from '../../../../openapi';
 import { styled, Tooltip } from '@mui/material';
+import theme from 'themes/theme';
+import { useThemeMode } from 'hooks/useThemeMode';
 
 const StyledContainer = styled('div')(({ theme }) => ({
     display: 'flex',
     flexDirection: 'column',
     alignItems: 'center',
+    'svg rect': {
+        stroke: '#0000 !important',
+    },
 }));
 
 type Output = { date: string; count: number; level: number };
@@ -73,10 +78,11 @@ const transformData = (inputData: ProjectActivitySchema): Output[] => {
 export const ProjectActivity = () => {
     const projectId = useRequiredPathParam('projectId');
     const { data } = useProjectStatus(projectId);
+    const { themeMode } = useThemeMode();
 
     const explicitTheme: ThemeInput = {
         light: ['#f1f0fc', '#ceccfd', '#8982ff', '#6c65e5', '#615bc2'],
-        dark: ['#f1f0fc', '#ceccfd', '#8982ff', '#6c65e5', '#615bc2'],
+        dark: ['#302E42', theme.palette.background.alternative],
     };
 
     const levelledData = transformData(data.activityCountByDate);
@@ -87,6 +93,7 @@ export const ProjectActivity = () => {
             {data.activityCountByDate.length > 0 ? (
                 <StyledContainer>
                     <ActivityCalendar
+                        colorScheme={themeMode}
                         theme={explicitTheme}
                         data={fullData}
                         maxLevel={4}