diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index fde9155c..5360cba4 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -251,7 +251,6 @@
     "NEW_BLOCK": "New Block",
     "BLOCK_NAME": "Block Name",
     "CREATE": "Create",
-
     "SEARCH_BLOCKS": "Search Blocks"
   },
   "CENTERS": {
@@ -261,7 +260,11 @@
     "REGULAR": "Regular",
     "REMOTE": "Remote",
     "SEARCH_BLOCKS": "Search Blocks",
-    "BLOCK_REQUEST": "You are sending a request to the state Team Leader to re-assign the Block to this user"
+    "BLOCK_REQUEST": "You are sending a request to the state Team Leader to re-assign the Block to this user",
+    "NEW_CENTER": "New Center",
+    "CENTER_TYPE": "Center Type",
+    "UNIT_NAME": "Unit Name",
+    "NOTE": "Note: This will be the center name"
   },
   "MANAGE_USERS": {
     "CENTERS_ASSIGNED_SUCCESSFULLY": "Center Assigned Successfully"
diff --git a/public/locales/hi/common.json b/public/locales/hi/common.json
index 435eee29..c8b72ef0 100644
--- a/public/locales/hi/common.json
+++ b/public/locales/hi/common.json
@@ -254,6 +254,9 @@
     "REMOTE_CENTERS": "दूरस्थ केंद्र",
     "CENTER_TYPE": "केंद्र प्रकार",
     "REGULAR": "नियमित",
-    "REMOTE": "दूरस्थ"
+    "REMOTE": "दूरस्थ",
+    "NEW_CENTER": "नया केंद्र",
+"UNIT_NAME": "इकाई नाम",
+"NOTE": "नोट: यह केंद्र का नाम होगा"
   }
 }
diff --git a/public/locales/mr/common.json b/public/locales/mr/common.json
index 50541d81..facb5c03 100644
--- a/public/locales/mr/common.json
+++ b/public/locales/mr/common.json
@@ -255,6 +255,10 @@
     "REMOTE_CENTERS": "दूरस्थ केंद्र",
     "CENTER_TYPE": "केंद्र प्रकार",
     "REGULAR": "नियमित",
-    "REMOTE": "दूरस्थ"
-  }
-}
+    "REMOTE": "दूरस्थ",
+   "NEW_CENTER": "नवीन केंद्र",
+"UNIT_NAME": "युनिट नाव",
+"NOTE": "टीप: हे केंद्राचे नाव असेल"
+   }
+ }
+ 
\ No newline at end of file
diff --git a/public/locales/or/common.json b/public/locales/or/common.json
index bd803d84..e2ea3ef5 100644
--- a/public/locales/or/common.json
+++ b/public/locales/or/common.json
@@ -204,6 +204,10 @@
     "REMOTE_CENTERS": "ଦୂରସ୍ଥ କେନ୍ଦ୍ର",
     "CENTER_TYPE": "କେନ୍ଦ୍ର ପ୍ରକାର",
     "REGULAR": "ସାଧାରଣ",
-    "REMOTE": "ଦୂରସ୍ଥ"
+    "REMOTE": "ଦୂରସ୍ଥ",
+    "NEW_CENTER": "ନୂଆ କେନ୍ଦ୍ର",
+"UNIT_NAME": "ଏକକ ନାମ",
+"NOTE": "ଟିପ୍ପଣୀ: ଏହା କେନ୍ଦ୍ରର ନାମ ହେବ"
+
+    }
   }
-}
diff --git a/src/components/center/CreateCenterModal.tsx b/src/components/center/CreateCenterModal.tsx
new file mode 100644
index 00000000..3052f0d8
--- /dev/null
+++ b/src/components/center/CreateCenterModal.tsx
@@ -0,0 +1,152 @@
+import React, { useState } from 'react';
+import {
+  Box,
+  Typography,
+  TextField,
+  Button,
+  Modal,
+  Fade,
+  Divider,
+  IconButton,
+  Radio,
+  RadioGroup,
+  FormControlLabel,
+  FormControl,
+  FormLabel,
+} from '@mui/material';
+import CloseIcon from '@mui/icons-material/Close';
+import { useTranslation } from 'next-i18next';
+import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
+import { useTheme, styled } from '@mui/material/styles';
+
+interface CreateBlockModalProps {
+  open: boolean;
+  handleClose: () => void;
+}
+
+const CustomRadio = styled(Radio)(({ theme }) => ({
+  color: theme.palette.text.primary,
+  '&.Mui-checked': {
+    color: theme.palette.text.primary,
+  },
+}));
+
+const CreateCenterModal: React.FC<CreateBlockModalProps> = ({
+  open,
+  handleClose,
+}) => {
+  const { t } = useTranslation();
+  const theme = useTheme<any>();
+
+  const [centerName, setCenterName] = useState<string>('');
+  const [centerType, setCenterType] = useState<string>('Regular');
+
+  const handleTextFieldChange = (
+    event: React.ChangeEvent<HTMLInputElement>
+  ) => {
+    setCenterName(event.target.value);
+  };
+
+  const handleRadioChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    setCenterType(event.target.value);
+  };
+
+  const handleCreateButtonClick = () => {
+    console.log('Entered Center Name:', centerName);
+    console.log('Selected Center Type:', centerType);
+
+    handleClose();
+  };
+
+  return (
+    <Modal open={open} onClose={handleClose} closeAfterTransition>
+      <Fade in={open}>
+        <Box
+          sx={{
+            backgroundColor: 'white',
+            boxShadow: 24,
+            maxWidth: 400,
+            width: '90%',
+            margin: 'auto',
+            borderRadius: 3,
+            outline: 'none',
+            p: 2,
+            position: 'absolute',
+            top: '50%',
+            left: '50%',
+            transform: 'translate(-50%, -50%)',
+          }}
+        >
+          <Box
+            sx={{
+              display: 'flex',
+              justifyContent: 'space-between',
+              alignItems: 'center',
+              mb: 1,
+            }}
+          >
+            <Typography
+              variant="h2"
+              gutterBottom
+              color={theme?.palette?.text?.primary}
+            >
+              {t('CENTERS.NEW_CENTER')}
+            </Typography>
+            <IconButton
+              onClick={handleClose}
+              sx={{ color: theme?.palette?.text?.primary }}
+            >
+              <CloseIcon />
+            </IconButton>
+          </Box>
+          <Divider sx={{ mb: 2, mx: -2 }} />
+          <FormControl component="fieldset" sx={{ mb: 2 }}>
+            <FormLabel sx={{ fontSize: '12px' }} component="legend">{t('CENTERS.CENTER_TYPE')}</FormLabel>
+            <RadioGroup
+              row
+              value={centerType}
+              onChange={handleRadioChange}
+            >
+              <FormControlLabel
+                value="Regular"
+                control={<CustomRadio />}
+                label={t('CENTERS.REGULAR')}
+              />
+              <FormControlLabel
+                value="Remote"
+                control={<CustomRadio />}
+                label={t('CENTERS.REMOTE')}
+              />
+            </RadioGroup>
+          </FormControl>
+          <TextField
+            fullWidth
+            label={t('CENTERS.UNIT_NAME')}
+            id="outlined-size-normal"
+            sx={{ mb: 1, mt: 2 }}
+            value={centerName}
+            onChange={handleTextFieldChange}
+          />
+          <Typography variant="body2" color="textSecondary" sx={{ mb: 2 }}>
+            {t('CENTERS.NOTE')}
+          </Typography>
+          <Divider sx={{ mb: 2, mx: -2 }} />
+          <Button
+            variant="outlined"
+            onClick={handleCreateButtonClick}
+            sx={{
+              width: '100%',
+              border: 'none',
+              backgroundColor: theme?.palette?.primary?.main,
+              mb: 2,
+            }}
+          >
+            {t('BLOCKS.CREATE')}
+          </Button>
+        </Box>
+      </Fade>
+    </Modal>
+  );
+};
+
+export default CreateCenterModal;