diff --git a/src/apps/schema/src/app/components/AddFieldModal/DefaultValue.tsx b/src/apps/schema/src/app/components/AddFieldModal/DefaultValue.tsx
index d6ad06ebcf..4a57292a00 100644
--- a/src/apps/schema/src/app/components/AddFieldModal/DefaultValue.tsx
+++ b/src/apps/schema/src/app/components/AddFieldModal/DefaultValue.tsx
@@ -4,6 +4,7 @@ import {
   FormHelperText,
   Checkbox,
   Typography,
+  FormControlLabel,
 } from "@mui/material";
 import { FormValue } from "./views/FieldForm";
 import { MaxLengths } from "../../../../../content-editor/src/app/components/Editor/Editor";
@@ -40,32 +41,42 @@ export const DefaultValue = ({
   options,
 }: DefaultValueProps) => {
   return (
-    <Box display="flex" gap={1}>
-      <Checkbox
-        data-cy="DefaultValueCheckbox"
-        checked={isDefaultValueEnabled}
-        size="small"
-        sx={{ width: "24px", height: "24px" }}
-        onChange={(event) => {
-          setIsDefaultValueEnabled(event.target.checked);
-          if (!event.target.checked) {
-            onChange(null);
-            setIsDefaultValueEnabled(false);
-          }
+    <Box>
+      <FormControlLabel
+        sx={{
+          alignItems: "flex-start",
         }}
+        control={
+          <Checkbox
+            data-cy="DefaultValueCheckbox"
+            checked={isDefaultValueEnabled}
+            size="small"
+            onChange={(event) => {
+              setIsDefaultValueEnabled(event.target.checked);
+              if (!event.target.checked) {
+                onChange(null);
+                setIsDefaultValueEnabled(false);
+              }
+            }}
+          />
+        }
+        label={
+          <Box>
+            <Typography variant="body2" fontWeight="600">
+              Default Value
+            </Typography>
+            <Typography
+              variant="body3"
+              color="text.secondary"
+              fontWeight="600"
+              sx={{ mb: 1, display: "block" }}
+            >
+              Set a predefined value for this field
+            </Typography>
+          </Box>
+        }
       />
       <Box flex={1}>
-        <Typography variant="body2" fontWeight="600">
-          Default Value
-        </Typography>
-        <Typography
-          variant="body3"
-          color="text.secondary"
-          fontWeight="600"
-          sx={{ mb: 1 }}
-        >
-          Set a predefined value for this field
-        </Typography>
         {isDefaultValueEnabled && (
           <FormControl error={!!error} fullWidth>
             <DefaultValueInput
diff --git a/src/apps/schema/src/app/components/AddFieldModal/FieldFormInput.tsx b/src/apps/schema/src/app/components/AddFieldModal/FieldFormInput.tsx
index c5d64f1d11..92800ae187 100644
--- a/src/apps/schema/src/app/components/AddFieldModal/FieldFormInput.tsx
+++ b/src/apps/schema/src/app/components/AddFieldModal/FieldFormInput.tsx
@@ -154,11 +154,6 @@ export const FieldFormInput = ({
                 });
               }}
               checked={Boolean(prefillData)}
-              sx={{
-                color: "grey.200",
-                pl: 1,
-                pt: 0,
-              }}
               size="small"
             />
           }
diff --git a/src/apps/schema/src/app/components/AddFieldModal/MediaRules.tsx b/src/apps/schema/src/app/components/AddFieldModal/MediaRules.tsx
index 3341b3a7c7..953ff49683 100644
--- a/src/apps/schema/src/app/components/AddFieldModal/MediaRules.tsx
+++ b/src/apps/schema/src/app/components/AddFieldModal/MediaRules.tsx
@@ -68,11 +68,6 @@ export const MediaRules = ({
                 control={
                   <Checkbox
                     data-cy={`MediaCheckbox_${rule.name}`}
-                    sx={{
-                      color: "grey.200",
-                      pl: 1,
-                      pt: 0,
-                    }}
                     size="small"
                     onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                       const { checked } = e.target;