diff --git a/frontend/src/components/Checkbox/Checkbox.tsx b/frontend/src/components/Checkbox/Checkbox.tsx
index 9b2a3b48a4..ef260d1c71 100644
--- a/frontend/src/components/Checkbox/Checkbox.tsx
+++ b/frontend/src/components/Checkbox/Checkbox.tsx
@@ -113,7 +113,7 @@ const OthersCheckbox = forwardRef<CheckboxProps, 'input'>((props, ref) => {
       {...props}
       onChange={handleCheckboxChange}
     >
-      {t('features.adminForm.sidebar.fields.radio.others')}
+      {t('features.publicForm.components.fields.option.others')}
     </Checkbox>
   )
 })
diff --git a/frontend/src/components/Dropdown/SingleSelect/SingleSelectProvider.tsx b/frontend/src/components/Dropdown/SingleSelect/SingleSelectProvider.tsx
index 3ecec34a68..6f895e7a7d 100644
--- a/frontend/src/components/Dropdown/SingleSelect/SingleSelectProvider.tsx
+++ b/frontend/src/components/Dropdown/SingleSelect/SingleSelectProvider.tsx
@@ -51,7 +51,6 @@ export const SingleSelectProvider = ({
   onChange,
   name,
   filter = defaultFilter,
-  nothingFoundLabel = 'No matching results',
   placeholder: placeholderProp,
   clearButtonLabel = 'Clear selection',
   isClearable = true,
@@ -83,9 +82,16 @@ export const SingleSelectProvider = ({
 
   const placeholder = useMemo(() => {
     if (placeholderProp === null) return ''
-    return placeholderProp ?? t('features.common.dropdown.placeholder')
+    return (
+      placeholderProp ??
+      t('features.publicForm.components.fields.dropdown.placeholder')
+    )
   }, [placeholderProp, t])
 
+  const nothingFoundLabel = t(
+    'features.publicForm.components.fields.dropdown.nothingFound',
+  )
+
   const getFilteredItems = useCallback(
     (filterValue?: string) =>
       filterValue ? filter(items, filterValue) : items,
diff --git a/frontend/src/components/Field/Attachment/Attachment.tsx b/frontend/src/components/Field/Attachment/Attachment.tsx
index 5bb3acce6d..fdca54a483 100644
--- a/frontend/src/components/Field/Attachment/Attachment.tsx
+++ b/frontend/src/components/Field/Attachment/Attachment.tsx
@@ -148,14 +148,14 @@ export const Attachment = forwardRef<AttachmentProps, 'div'>(
             case 'file-invalid-type': {
               const fileExt = getFileExtension(rejectedFiles[0].file.name)
               errorMessage = t(
-                `features.adminForm.sidebar.fields.imageAttachment.error.fileInvalidType`,
+                `features.publicForm.components.fields.attachment.error.fileInvalidType`,
                 { fileExt },
               )
               break
             }
             case 'too-many-files': {
               errorMessage = t(
-                `features.adminForm.sidebar.fields.imageAttachment.error.tooManyFiles`,
+                `features.publicForm.components.fields.attachment.error.tooManyFiles`,
               )
               break
             }
@@ -178,7 +178,7 @@ export const Attachment = forwardRef<AttachmentProps, 'div'>(
               const stringOfInvalidExtensions = invalidFilesInZip.join(', ')
               return onError?.(
                 t(
-                  'features.adminForm.sidebar.fields.imageAttachment.error.zipFileInvalidType',
+                  'features.publicForm.components.fields.attachment.error.zipFileInvalidType',
                   { stringOfInvalidExtensions },
                 ),
               )
@@ -186,7 +186,7 @@ export const Attachment = forwardRef<AttachmentProps, 'div'>(
           } catch {
             return onError?.(
               t(
-                'features.adminForm.sidebar.fields.imageAttachment.error.zipParsing',
+                'features.publicForm.components.fields.attachment.error.zipParsing',
               ),
             )
           }
@@ -224,7 +224,7 @@ export const Attachment = forwardRef<AttachmentProps, 'div'>(
             return {
               code: 'file-too-large',
               message: t(
-                'features.adminForm.sidebar.fields.imageAttachment.error.fileTooLarge',
+                'features.publicForm.components.fields.attachment.error.fileTooLarge',
                 { readableMaxSize },
               ),
             }
@@ -233,7 +233,7 @@ export const Attachment = forwardRef<AttachmentProps, 'div'>(
             return {
               code: 'file-empty',
               message: t(
-                'features.adminForm.sidebar.fields.imageAttachment.error.zipParsing',
+                'features.publicForm.components.fields.attachment.error.zipParsing',
               ),
             }
           }
@@ -336,7 +336,7 @@ export const Attachment = forwardRef<AttachmentProps, 'div'>(
               aria-hidden
             >
               {t(
-                'features.adminForm.sidebar.fields.imageAttachment.maxFileSize',
+                'features.publicForm.components.fields.attachment.maxFileSize',
                 {
                   readableMaxSize,
                 },
diff --git a/frontend/src/components/Field/Attachment/AttachmentDropzone.tsx b/frontend/src/components/Field/Attachment/AttachmentDropzone.tsx
index cae8781b27..f1042b2581 100644
--- a/frontend/src/components/Field/Attachment/AttachmentDropzone.tsx
+++ b/frontend/src/components/Field/Attachment/AttachmentDropzone.tsx
@@ -37,10 +37,10 @@ export const AttachmentDropzone = ({
         <Text aria-hidden>
           <Link isDisabled={inputProps.disabled}>
             {t(
-              'features.adminForm.sidebar.fields.imageAttachment.fileUploaderLink',
+              'features.publicForm.components.fields.attachment.fileUploaderLink',
             )}
           </Link>
-          {t('features.adminForm.sidebar.fields.imageAttachment.dragAndDrop')}
+          {t('features.publicForm.components.fields.attachment.dragAndDrop')}
         </Text>
       )}
     </>
diff --git a/frontend/src/components/Field/Attachment/AttachmentFileInfo.tsx b/frontend/src/components/Field/Attachment/AttachmentFileInfo.tsx
index 919023f03b..1519dbed05 100644
--- a/frontend/src/components/Field/Attachment/AttachmentFileInfo.tsx
+++ b/frontend/src/components/Field/Attachment/AttachmentFileInfo.tsx
@@ -57,7 +57,7 @@ export const AttachmentFileInfo = ({
             variant="clear"
             colorScheme="danger"
             aria-label={t(
-              'features.adminForm.sidebar.fields.imageAttachment.ariaLabelRemove',
+              'features.publicForm.components.fields.attachment.ariaLabelRemove',
             )}
             icon={<BiTrash />}
             onClick={handleRemoveFile}
diff --git a/frontend/src/components/Field/YesNo/YesNo.tsx b/frontend/src/components/Field/YesNo/YesNo.tsx
index c02d906e15..b89ecab914 100644
--- a/frontend/src/components/Field/YesNo/YesNo.tsx
+++ b/frontend/src/components/Field/YesNo/YesNo.tsx
@@ -88,7 +88,7 @@ export const YesNo = forwardRef<YesNoProps, 'input'>(
           {...noProps}
           onChange={(value) => onChange(value as YesNoOptionValue)}
           leftIcon={BiX}
-          label={t('features.adminForm.sidebar.fields.yesNo.no')}
+          label={t('features.publicForm.components.fields.yesNo.no')}
           // Ref is set here for tracking current value, and also so any errors
           // can focus this input.
           ref={ref}
@@ -100,7 +100,7 @@ export const YesNo = forwardRef<YesNoProps, 'input'>(
           {...yesProps}
           onChange={(value) => onChange(value as YesNoOptionValue)}
           leftIcon={BiCheck}
-          label={t('features.adminForm.sidebar.fields.yesNo.yes')}
+          label={t('features.publicForm.components.fields.yesNo.yes')}
           title={props.title}
         />
       </HStack>
diff --git a/frontend/src/components/FormEndPage/EndPageBlock.tsx b/frontend/src/components/FormEndPage/EndPageBlock.tsx
index d141ce524b..012615362f 100644
--- a/frontend/src/components/FormEndPage/EndPageBlock.tsx
+++ b/frontend/src/components/FormEndPage/EndPageBlock.tsx
@@ -1,10 +1,12 @@
 import { useEffect, useMemo, useRef } from 'react'
+import { useTranslation } from 'react-i18next'
 import { Box, Text, VisuallyHidden } from '@chakra-ui/react'
 import { format } from 'date-fns'
 
-import { FormColorTheme, FormDto } from '~shared/types/form'
+import { FormColorTheme, FormDto, Language } from '~shared/types/form'
 
 import { useMdComponents } from '~hooks/useMdComponents'
+import { getValueInSelectedLanguage } from '~utils/multiLanguage'
 import Button from '~components/Button'
 import { MarkdownText } from '~components/MarkdownText'
 
@@ -27,6 +29,7 @@ export const EndPageBlock = ({
   focusOnMount,
   isButtonHidden,
 }: EndPageBlockProps): JSX.Element => {
+  const { i18n } = useTranslation()
   const focusRef = useRef<HTMLDivElement>(null)
   useEffect(() => {
     if (focusOnMount) {
@@ -43,6 +46,20 @@ export const EndPageBlock = ({
     },
   })
 
+  const selectedLanguage = i18n.language as Language
+
+  const title = getValueInSelectedLanguage({
+    defaultValue: endPage.title,
+    translations: endPage.titleTranslations,
+    selectedLanguage,
+  })
+
+  const paragraph = getValueInSelectedLanguage({
+    defaultValue: endPage.paragraph ?? '',
+    translations: endPage.paragraphTranslations,
+    selectedLanguage,
+  })
+
   const submissionTimestamp = useMemo(
     () => format(new Date(submissionData.timestamp), 'dd MMM yyyy, HH:mm:ss z'),
     [submissionData.timestamp],
@@ -62,13 +79,11 @@ export const EndPageBlock = ({
           {submittedAriaText}
         </VisuallyHidden>
         <Text as="h2" textStyle="h2" textColor="secondary.500">
-          {endPage.title}
+          {title}
         </Text>
-        {endPage.paragraph ? (
+        {paragraph ? (
           <Box mt="0.75rem">
-            <MarkdownText components={mdComponents}>
-              {endPage.paragraph}
-            </MarkdownText>
+            <MarkdownText components={mdComponents}>{paragraph}</MarkdownText>
           </Box>
         ) : null}
       </Box>
diff --git a/frontend/src/components/Radio/Radio.tsx b/frontend/src/components/Radio/Radio.tsx
index 93f70a5b6e..c199704ca8 100644
--- a/frontend/src/components/Radio/Radio.tsx
+++ b/frontend/src/components/Radio/Radio.tsx
@@ -283,7 +283,7 @@ const OthersRadio = forwardRef<RadioProps, 'input'>((props, ref) => {
       // Required should apply to radio group rather than individual radio.
       isRequired={false}
     >
-      {t('features.adminForm.sidebar.fields.radio.others')}
+      {t('features.publicForm.components.fields.option.others')}
     </Radio>
   )
 })
diff --git a/frontend/src/constants/validation.ts b/frontend/src/constants/validation.ts
index 7ebdb476f1..0bcda64011 100644
--- a/frontend/src/constants/validation.ts
+++ b/frontend/src/constants/validation.ts
@@ -1,8 +1,6 @@
 export const REQUIRED_ERROR = 'This field is required'
 
 export const INVALID_EMAIL_ERROR = 'Please enter a valid email'
-export const INVALID_EMAIL_DOMAIN_ERROR =
-  'The entered email does not belong to an allowed email domain'
 
 export const INVALID_DROPDOWN_OPTION_ERROR =
   'Entered value is not a valid dropdown option'
diff --git a/frontend/src/features/admin-form/create/CreatePage.tsx b/frontend/src/features/admin-form/create/CreatePage.tsx
index 7a3a0fb517..998d273d6a 100644
--- a/frontend/src/features/admin-form/create/CreatePage.tsx
+++ b/frontend/src/features/admin-form/create/CreatePage.tsx
@@ -1,7 +1,10 @@
 import { useEffect, useMemo } from 'react'
+import { useTranslation } from 'react-i18next'
 import { useNavigate, useParams } from 'react-router-dom'
 import { Flex } from '@chakra-ui/react'
 
+import { Language } from '~shared/types'
+
 import { FEATURE_TOUR_KEY_PREFIX } from '~constants/localStorage'
 import { ADMINFORM_RESULTS_SUBROUTE, ADMINFORM_ROUTE } from '~constants/routes'
 import { useLocalStorage } from '~hooks/useLocalStorage'
@@ -28,12 +31,16 @@ export const CreatePage = (): JSX.Element => {
   const { hasEditAccess, isLoading: isCollabLoading } =
     useAdminFormCollaborators(formId)
   const navigate = useNavigate()
+  const { i18n } = useTranslation()
 
   // Redirect view-only collaborators to results screen.
   useEffect(() => {
+    // Always default language key back to English
+    i18n.changeLanguage(Language.ENGLISH)
+
     if (!isCollabLoading && !hasEditAccess)
       navigate(`${ADMINFORM_ROUTE}/${formId}/${ADMINFORM_RESULTS_SUBROUTE}`)
-  }, [formId, hasEditAccess, isCollabLoading, navigate])
+  }, [formId, hasEditAccess, i18n, isCollabLoading, navigate])
 
   const { user, isLoading } = useUser()
   const localStorageFeatureTourKey = useMemo(() => {
diff --git a/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/EditFieldDrawer/edit-fieldtype/EditCheckbox/EditCheckbox.tsx b/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/EditFieldDrawer/edit-fieldtype/EditCheckbox/EditCheckbox.tsx
index 22ba191a9b..2717cc3859 100644
--- a/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/EditFieldDrawer/edit-fieldtype/EditCheckbox/EditCheckbox.tsx
+++ b/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/EditFieldDrawer/edit-fieldtype/EditCheckbox/EditCheckbox.tsx
@@ -234,7 +234,7 @@ export const EditCheckbox = ({ field }: EditCheckboxProps): JSX.Element => {
       <FormControl isReadOnly={isLoading}>
         <Toggle
           {...register('othersRadioButton')}
-          label={t('features.adminForm.sidebar.fields.radio.others')}
+          label={t('features.publicForm.components.fields.option.others')}
         />
       </FormControl>
       <FormControl
diff --git a/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/EditFieldDrawer/edit-fieldtype/EditRadio/EditRadio.tsx b/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/EditFieldDrawer/edit-fieldtype/EditRadio/EditRadio.tsx
index c533e83757..89f899b8cd 100644
--- a/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/EditFieldDrawer/edit-fieldtype/EditRadio/EditRadio.tsx
+++ b/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/EditFieldDrawer/edit-fieldtype/EditRadio/EditRadio.tsx
@@ -119,7 +119,7 @@ export const EditRadio = ({ field }: EditRadioProps): JSX.Element => {
       <FormControl isReadOnly={isLoading}>
         <Toggle
           {...register('othersRadioButton')}
-          label={t('features.adminForm.sidebar.fields.radio.others')}
+          label={t('features.publicForm.components.fields.option.others')}
         />
       </FormControl>
       <FormControl
diff --git a/frontend/src/features/admin-form/create/builder-and-design/utils/fieldCreation.ts b/frontend/src/features/admin-form/create/builder-and-design/utils/fieldCreation.ts
index 0e818b8367..65c075d503 100644
--- a/frontend/src/features/admin-form/create/builder-and-design/utils/fieldCreation.ts
+++ b/frontend/src/features/admin-form/create/builder-and-design/utils/fieldCreation.ts
@@ -220,11 +220,19 @@ export const getMyInfoFieldCreationMeta = (
 ): MyInfoField => {
   const baseMeta: Pick<
     MyInfoField,
-    'disabled' | 'required' | 'title' | 'description' | 'fieldType' | 'myInfo'
+    | 'disabled'
+    | 'required'
+    | 'title'
+    | 'description'
+    | 'fieldType'
+    | 'myInfo'
+    | 'titleTranslations'
+    | 'descriptionTranslations'
   > = {
     disabled: false,
     required: true,
     title: MYINFO_ATTRIBUTE_MAP[myInfoAttribute].value,
+    titleTranslations: MYINFO_ATTRIBUTE_MAP[myInfoAttribute]?.titleTranslations,
     description: '',
     fieldType: MYINFO_ATTRIBUTE_MAP[myInfoAttribute].fieldType,
     myInfo: {
diff --git a/frontend/src/features/admin-form/create/logic/components/LogicContent/EditLogicBlock/EditCondition/EditConditionBlock.tsx b/frontend/src/features/admin-form/create/logic/components/LogicContent/EditLogicBlock/EditCondition/EditConditionBlock.tsx
index 33b04ecff3..5874f3165d 100644
--- a/frontend/src/features/admin-form/create/logic/components/LogicContent/EditLogicBlock/EditCondition/EditConditionBlock.tsx
+++ b/frontend/src/features/admin-form/create/logic/components/LogicContent/EditLogicBlock/EditCondition/EditConditionBlock.tsx
@@ -156,14 +156,14 @@ export const EditConditionBlock = ({
     switch (mappedField.fieldType) {
       case BasicField.YesNo:
         return [
-          t('features.adminForm.sidebar.fields.yesNo.yes'),
-          t('features.adminForm.sidebar.fields.yesNo.no'),
+          t('features.publicForm.components.fields.yesNo.yes'),
+          t('features.publicForm.components.fields.yesNo.no'),
         ]
       case BasicField.Radio:
         if (mappedField.othersRadioButton) {
           // 'Others' does not show up in fieldOptions
           return mappedField.fieldOptions.concat(
-            t('features.adminForm.sidebar.fields.radio.others'),
+            t('features.publicForm.components.fields.option.others'),
           )
         }
         return mappedField.fieldOptions
diff --git a/frontend/src/features/admin-form/create/logic/types.ts b/frontend/src/features/admin-form/create/logic/types.ts
index e0a58524e6..f947900eb5 100644
--- a/frontend/src/features/admin-form/create/logic/types.ts
+++ b/frontend/src/features/admin-form/create/logic/types.ts
@@ -12,4 +12,5 @@ export enum AdminEditLogicState {
 export type EditLogicInputs = FormLogic & {
   preventSubmitMessage?: PreventSubmitLogic['preventSubmitMessage']
   show?: ShowFieldLogic['show']
+  preventSubmitMessageTranslations?: PreventSubmitLogic['preventSubmitMessageTranslations']
 }
diff --git a/frontend/src/features/admin-form/preview/PreviewFormPage.tsx b/frontend/src/features/admin-form/preview/PreviewFormPage.tsx
index da699017ae..ff24ce584a 100644
--- a/frontend/src/features/admin-form/preview/PreviewFormPage.tsx
+++ b/frontend/src/features/admin-form/preview/PreviewFormPage.tsx
@@ -13,6 +13,7 @@ import { FormFooter } from '~features/public-form/components/FormFooter'
 import FormInstructions from '~features/public-form/components/FormInstructions'
 import { PublicFormLogo } from '~features/public-form/components/FormLogo'
 import FormStartPage from '~features/public-form/components/FormStartPage'
+import LanguageControl from '~features/public-form/components/LanguageControl'
 import { PublicFormWrapper } from '~features/public-form/components/PublicFormWrapper'
 
 import { PreviewFormBannerContainer } from '../common/components/PreviewFormBanner'
@@ -31,6 +32,7 @@ export const PreviewFormPage = (): JSX.Element => {
         <FormSectionsProvider>
           <PublicFormLogo />
           <FormStartPage />
+          <LanguageControl />
           <PublicFormWrapper>
             <FormInstructions />
             <FormFields />
diff --git a/frontend/src/features/admin-form/settings/SettingsMultiLangPage.tsx b/frontend/src/features/admin-form/settings/SettingsMultiLangPage.tsx
index f111972200..d35926afb0 100644
--- a/frontend/src/features/admin-form/settings/SettingsMultiLangPage.tsx
+++ b/frontend/src/features/admin-form/settings/SettingsMultiLangPage.tsx
@@ -14,6 +14,7 @@ export const SettingsMultiLangPage = (): JSX.Element => {
   const isTranslationInput = !_.isNull(translationInput)
   const isEndPageTranslationInput = translationInput === 'endPage'
   const isStartPageTransltionInput = translationInput === 'startPage'
+  const isFormLogicTranslationInput = translationInput === 'formLogic'
 
   // Request user to select a language
   if (!unicodeLocale) {
@@ -23,16 +24,21 @@ export const SettingsMultiLangPage = (): JSX.Element => {
   if (!isTranslationInput) {
     return <TranslationListSection language={unicodeLocale} />
   }
+
+  const formFieldToBeTranslated =
+    isEndPageTranslationInput ||
+    isStartPageTransltionInput ||
+    isFormLogicTranslationInput
+      ? -1
+      : _.toNumber(translationInput)
+
   return (
     <TranslationSection
       language={unicodeLocale}
-      formFieldNumToBeTranslated={
-        isEndPageTranslationInput || isStartPageTransltionInput
-          ? -1
-          : _.toNumber(translationInput)
-      }
+      formFieldNumToBeTranslated={formFieldToBeTranslated}
       isEndPageTranslations={isEndPageTranslationInput}
       isStartPageTranslations={isStartPageTransltionInput}
+      isFormLogicTranslations={isFormLogicTranslationInput}
     />
   )
 }
diff --git a/frontend/src/features/admin-form/settings/SettingsPage.tsx b/frontend/src/features/admin-form/settings/SettingsPage.tsx
index 64419d6325..59aba732b3 100644
--- a/frontend/src/features/admin-form/settings/SettingsPage.tsx
+++ b/frontend/src/features/admin-form/settings/SettingsPage.tsx
@@ -17,9 +17,12 @@ import { LanguageTranslation } from '~assets/icons/LanguageTranslation'
 import { ADMINFORM_RESULTS_SUBROUTE, ADMINFORM_ROUTE } from '~constants/routes'
 import { useDraggable } from '~hooks/useDraggable'
 
+import { useUser } from '~features/user/queries'
+
 import { useAdminFormCollaborators } from '../common/queries'
 
 import { SettingsTab } from './components/SettingsTab'
+import { useAdminFormSettings } from './queries'
 import { SettingsAuthPage } from './SettingsAuthPage'
 import { SettingsEmailsPage } from './SettingsEmailsPage'
 import { SettingsGeneralPage } from './SettingsGeneralPage'
@@ -37,6 +40,8 @@ interface TabEntry {
 
 export const SettingsPage = (): JSX.Element => {
   const { formId, settingsTab } = useParams()
+  const { isLoading: isFormSettingLoading } = useAdminFormSettings()
+  const { user, isLoading: isUserLoading } = useUser()
   const { t } = useTranslation()
 
   if (!formId) throw new Error('No formId provided')
@@ -51,6 +56,18 @@ export const SettingsPage = (): JSX.Element => {
       navigate(`${ADMINFORM_ROUTE}/${formId}/${ADMINFORM_RESULTS_SUBROUTE}`)
   }, [formId, hasEditAccess, isCollabLoading, navigate])
 
+  const multiLangTab =
+    !isUserLoading &&
+    !isFormSettingLoading &&
+    user?.betaFlags?.multiLangTranslation
+      ? {
+          label: 'Multi-language',
+          icon: LanguageTranslation,
+          component: SettingsMultiLangPage,
+          path: 'language',
+        }
+      : null
+
   const tabConfig: TabEntry[] = [
     {
       label: t('features.adminForm.settings.general.title'),
@@ -83,12 +100,7 @@ export const SettingsPage = (): JSX.Element => {
       component: SettingsPaymentsPage,
       path: 'payments',
     },
-    {
-      label: 'Multi-language',
-      icon: LanguageTranslation,
-      component: SettingsMultiLangPage,
-      path: 'language',
-    },
+    multiLangTab,
   ].filter(Boolean) as TabEntry[]
 
   const { ref, onMouseDown } = useDraggable<HTMLDivElement>()
diff --git a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/EndPageTranslationContainer.tsx b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/EndPageTranslationContainer.tsx
index 571c3bf629..04fb1d83c1 100644
--- a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/EndPageTranslationContainer.tsx
+++ b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/EndPageTranslationContainer.tsx
@@ -1,5 +1,5 @@
-import React from 'react'
 import { Divider, Flex, Text } from '@chakra-ui/react'
+import _ from 'lodash'
 
 import { FormEndPage, Language } from '~shared/types'
 
@@ -18,7 +18,7 @@ export const EndPageTranslationsContainer = ({
 }: EndPageTranslationsContainerProps) => {
   if (!endPage) return null
 
-  const hasParagraph = endPage.paragraph?.trim() !== ''
+  const hasParagraph = !_.isEmpty(endPage.paragraph?.trim())
 
   const currentTitleTranslations = endPage.titleTranslations ?? []
   const currentParagraphTranslations = endPage.paragraphTranslations ?? []
@@ -51,24 +51,26 @@ export const EndPageTranslationsContainer = ({
           previousTranslation={previousTitleTranslation}
         />
       </Flex>
-      <Divider mb="2.5rem" />
       {hasParagraph && (
-        <Flex justifyContent="flex-start" mb="2.5rem" direction="column">
-          <Text
-            color="secondary.500"
-            fontSize="1.25rem"
-            fontWeight="600"
-            mb="1rem"
-          >
-            Follow-up instructions
-          </Text>
-          <TranslationContainer
-            language={capitalisedLanguage}
-            defaultString={endPage.paragraph}
-            editingTranslation="paragraphTranslations"
-            previousTranslation={previousParagraphTranslation}
-          />
-        </Flex>
+        <>
+          <Divider mb="2.5rem" />
+          <Flex justifyContent="flex-start" mb="2.5rem" direction="column">
+            <Text
+              color="secondary.500"
+              fontSize="1.25rem"
+              fontWeight="600"
+              mb="1rem"
+            >
+              Follow-up instructions
+            </Text>
+            <TranslationContainer
+              language={capitalisedLanguage}
+              defaultString={endPage.paragraph}
+              editingTranslation="paragraphTranslations"
+              previousTranslation={previousParagraphTranslation}
+            />
+          </Flex>
+        </>
       )}
     </>
   )
diff --git a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/FormFieldTranslationContainer.tsx b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/FormFieldTranslationContainer.tsx
index d5ef55c531..4dd95fd354 100644
--- a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/FormFieldTranslationContainer.tsx
+++ b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/FormFieldTranslationContainer.tsx
@@ -1,4 +1,4 @@
-import React from 'react'
+import { FormState } from 'react-hook-form'
 import { Divider, Flex, Text } from '@chakra-ui/react'
 
 import { FormField, Language } from '~shared/types'
@@ -7,17 +7,20 @@ import { BasicField } from '~shared/types/field'
 import { OptionsTranslationContainer } from './OptionsTranslationContainer'
 import { TableTranslationContainer } from './TableTranslationContainer'
 import { TranslationContainer } from './TranslationContainer'
+import { TranslationInput } from './TranslationSection'
 
 interface FormFieldTranslationContainerProps {
   formFieldData: FormField | undefined
   capitalisedLanguage: string
   unicodeLocale: Language
+  formState: FormState<TranslationInput>
 }
 
 export const FormFieldTranslationContainer = ({
   formFieldData,
   capitalisedLanguage,
   unicodeLocale,
+  formState,
 }: FormFieldTranslationContainerProps) => {
   if (!formFieldData) return null
 
@@ -86,6 +89,7 @@ export const FormFieldTranslationContainer = ({
             unicodeLocale={unicodeLocale}
             language={capitalisedLanguage}
             formFieldData={formFieldData}
+            errors={formState.errors.fieldOptionsTranslations}
           />
         </>
       )}
@@ -96,6 +100,7 @@ export const FormFieldTranslationContainer = ({
             unicodeLocale={unicodeLocale}
             language={capitalisedLanguage}
             columns={formFieldData.columns}
+            errors={formState.errors.tableColumnDropdownTranslations}
           />
         </>
       )}
diff --git a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/FormLogicTranslationContainer.tsx b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/FormLogicTranslationContainer.tsx
new file mode 100644
index 0000000000..88fbb0a400
--- /dev/null
+++ b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/FormLogicTranslationContainer.tsx
@@ -0,0 +1,85 @@
+import { useFormContext } from 'react-hook-form'
+import { Divider, Flex, FormControl, Text } from '@chakra-ui/react'
+
+import { Language, PreventSubmitLogicDto } from '~shared/types'
+
+import Textarea from '~components/Textarea'
+
+import { TranslationInput } from './TranslationSection'
+
+interface TableTranslationContainerProps {
+  language: string
+  unicodeLocale: Language
+  formLogics: PreventSubmitLogicDto[]
+}
+
+export const FormLogicTranslationContainer = ({
+  language,
+  unicodeLocale,
+  formLogics,
+}: TableTranslationContainerProps) => {
+  const { register } = useFormContext<TranslationInput>()
+
+  return (
+    <>
+      {formLogics.map((formLogic, index) => {
+        const defaultPreventSubmitMessage = formLogic.preventSubmitMessage
+        const previousPreventSubmissionMessage =
+          formLogic.preventSubmitMessageTranslations?.find(
+            (translationMapping) => {
+              return translationMapping.language === unicodeLocale
+            },
+          )?.translation ?? ''
+
+        return (
+          <Flex
+            key={index}
+            justifyContent="flex-start"
+            mb="2.5rem"
+            direction="column"
+          >
+            <Text
+              color="secondary.500"
+              fontSize="1.25rem"
+              fontWeight="600"
+              mb="1rem"
+            >
+              Disable Submission
+            </Text>
+            <Flex direction="column" width="100%">
+              <Flex alignItems="flex-start" mb="2rem">
+                <Text
+                  color="secondary.700"
+                  fontWeight="400"
+                  mr="7.5rem"
+                  width="6.25rem"
+                >
+                  Default
+                </Text>
+                <Textarea
+                  placeholder={defaultPreventSubmitMessage}
+                  width="100%"
+                  isDisabled={true}
+                  padding="0.75rem"
+                  resize="none"
+                />
+              </Flex>
+              <Flex alignItems="flex-start">
+                <Text color="secondary.700" mr="7.5rem" width="6.25rem">
+                  {language}
+                </Text>
+                <FormControl>
+                  <Textarea
+                    defaultValue={previousPreventSubmissionMessage}
+                    {...register(`preventSubmitMessageTranslations.${index}`)}
+                  />
+                </FormControl>
+              </Flex>
+            </Flex>
+            {index !== formLogics.length - 1 && <Divider mt="2.5rem" />}
+          </Flex>
+        )
+      })}
+    </>
+  )
+}
diff --git a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/OptionsTranslationContainer.tsx b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/OptionsTranslationContainer.tsx
index c5506786b5..a8c550ea83 100644
--- a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/OptionsTranslationContainer.tsx
+++ b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/OptionsTranslationContainer.tsx
@@ -1,4 +1,4 @@
-import { useFormContext } from 'react-hook-form'
+import { FieldError, useFormContext } from 'react-hook-form'
 import { Flex, FormControl, Text } from '@chakra-ui/react'
 
 import {
@@ -8,6 +8,7 @@ import {
   RadioFieldBase,
 } from '~shared/types'
 
+import FormErrorMessage from '~components/FormControl/FormErrorMessage'
 import Textarea from '~components/Textarea'
 
 import { TranslationInput } from './TranslationSection'
@@ -16,12 +17,14 @@ interface OptionsTranslationContainerProps {
   language: string
   unicodeLocale: Language
   formFieldData: CheckboxFieldBase | DropdownFieldBase | RadioFieldBase
+  errors?: FieldError
 }
 
 export const OptionsTranslationContainer = ({
   language,
   unicodeLocale,
   formFieldData,
+  errors,
 }: OptionsTranslationContainerProps) => {
   const { register } = useFormContext<TranslationInput>()
 
@@ -59,12 +62,13 @@ export const OptionsTranslationContainer = ({
         <Text color="secondary.700" mr="7.5rem" width="6.25rem">
           {language}
         </Text>
-        <FormControl>
+        <FormControl isInvalid={!!errors}>
           <Textarea
             width="100%"
             {...register('fieldOptionsTranslations')}
             defaultValue={previousTranslations}
           />
+          <FormErrorMessage>{errors?.message}</FormErrorMessage>
         </FormControl>
       </Flex>
     </Flex>
diff --git a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TableTranslationContainer.tsx b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TableTranslationContainer.tsx
index 1ed8e3f31d..71fe5580a6 100644
--- a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TableTranslationContainer.tsx
+++ b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TableTranslationContainer.tsx
@@ -1,10 +1,10 @@
-import React from 'react'
-import { useFormContext } from 'react-hook-form'
+import { FieldError, useFormContext } from 'react-hook-form'
 import { Divider, Flex, FormControl, Text } from '@chakra-ui/react'
 
 import { Language } from '~shared/types'
 import { BasicField } from '~shared/types/field'
 
+import FormErrorMessage from '~components/FormControl/FormErrorMessage'
 import Textarea from '~components/Textarea'
 
 import { TranslationInput } from './TranslationSection'
@@ -21,12 +21,14 @@ interface TableTranslationContainerProps {
   language: string
   columns: TableColumn[]
   unicodeLocale: Language
+  errors?: FieldError[]
 }
 
 export const TableTranslationContainer = ({
   language,
   columns,
   unicodeLocale,
+  errors,
 }: TableTranslationContainerProps) => {
   const { register } = useFormContext<TranslationInput>()
 
@@ -51,7 +53,12 @@ export const TableTranslationContainer = ({
           previousFieldOptionsTranslations.join('\n')
 
         return (
-          <Flex justifyContent="flex-start" mb="2.5rem" direction="column">
+          <Flex
+            key={index}
+            justifyContent="flex-start"
+            mb="2.5rem"
+            direction="column"
+          >
             <Text
               color="secondary.500"
               fontSize="1.25rem"
@@ -120,12 +127,15 @@ export const TableTranslationContainer = ({
                   <Text color="secondary.700" mr="7.5rem" width="6.25rem">
                     {language}
                   </Text>
-                  <FormControl>
+                  <FormControl isInvalid={!!errors?.[index]}>
                     <Textarea
                       width="100%"
                       {...register(`tableColumnDropdownTranslations.${index}`)}
                       defaultValue={previousFieldOptionsTranslationsString}
                     />
+                    <FormErrorMessage>
+                      {errors?.[index]?.message}
+                    </FormErrorMessage>
                   </FormControl>
                 </Flex>
               </Flex>
diff --git a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TranslationContainer.tsx b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TranslationContainer.tsx
index 1dfaecbf77..eb39b13498 100644
--- a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TranslationContainer.tsx
+++ b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TranslationContainer.tsx
@@ -1,4 +1,3 @@
-import React from 'react'
 import { useFormContext } from 'react-hook-form'
 import { Flex, FormControl, Text } from '@chakra-ui/react'
 
diff --git a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TranslationListSection.tsx b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TranslationListSection.tsx
index 82f9ab6ca9..f2173549fd 100644
--- a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TranslationListSection.tsx
+++ b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TranslationListSection.tsx
@@ -1,5 +1,5 @@
 import { useCallback, useMemo } from 'react'
-import { BiArrowBack, BiCheck, BiError } from 'react-icons/bi'
+import { BiArrowBack, BiCheck, BiError, BiGitMerge } from 'react-icons/bi'
 import { useNavigate, useParams, useSearchParams } from 'react-router-dom'
 import {
   As,
@@ -18,6 +18,7 @@ import {
   FormField,
   FormFieldDto,
   Language,
+  LogicType,
   TableFieldBase,
   TranslationMapping,
   TranslationOptionMapping,
@@ -47,6 +48,7 @@ interface QuestionRowProps {
   formFieldNum?: number
   isStartPage?: boolean
   isEndPage?: boolean
+  isFormLogic?: boolean
 }
 
 export const QuestionRow = ({
@@ -58,6 +60,7 @@ export const QuestionRow = ({
   formFieldNum = -1,
   isStartPage = false,
   isEndPage = false,
+  isFormLogic = false,
 }: QuestionRowProps): JSX.Element => {
   const [, setSearchParams] = useSearchParams()
 
@@ -67,7 +70,9 @@ export const QuestionRow = ({
     ? 'endPage'
     : isStartPage
       ? 'startPage'
-      : formFieldNum.toString()
+      : isFormLogic
+        ? 'formLogic'
+        : formFieldNum.toString()
 
   const handleOnListClick = useCallback(() => {
     setSearchParams({ unicodeLocale, translationInput })
@@ -181,6 +186,12 @@ export const TranslationListSection = ({
     navigate(`${ADMINFORM_ROUTE}/${formId}/settings/language`)
   }, [formId, navigate])
 
+  const formLogicPreventSubmissions = useMemo(() => {
+    return form?.form_logics.filter((formLogic) => {
+      return formLogic.logicType === LogicType.PreventSubmit
+    })
+  }, [form?.form_logics])
+
   const hasStartPageTranslations = useMemo(() => {
     const startPageTranslations = form?.startPage?.paragraphTranslations ?? []
 
@@ -189,6 +200,21 @@ export const TranslationListSection = ({
     )
   }, [form?.startPage?.paragraphTranslations, unicodeLocale])
 
+  const hasFormLogicTranslations = useMemo(() => {
+    return (
+      form?.form_logics.filter((formLogic) => {
+        return (
+          formLogic.logicType === LogicType.PreventSubmit &&
+          formLogic.preventSubmitMessageTranslations?.some(
+            (translation) =>
+              translation.language === unicodeLocale &&
+              !_.isEmpty(translation.translation),
+          )
+        )
+      }).length === formLogicPreventSubmissions?.length
+    )
+  }, [form?.form_logics, formLogicPreventSubmissions?.length, unicodeLocale])
+
   const hasEndPageTranslations = useMemo(() => {
     if (!form?.endPage) return false
 
@@ -199,16 +225,19 @@ export const TranslationListSection = ({
     } = form.endPage
 
     const hasEndPageTitleTranslations = titleTranslations.some(
-      (translations) => translations.language === unicodeLocale,
+      (translations) =>
+        translations.language === unicodeLocale &&
+        !_.isEmpty(translations.translation),
     )
     const hasEndPageParagraphTranslations = paragraphTranslations.some(
-      (translations) => translations.language === unicodeLocale,
+      (translations) =>
+        translations.language === unicodeLocale &&
+        !_.isEmpty(translations.translation),
     )
 
     return (
-      !_.isEmpty(paragraph) &&
       hasEndPageTitleTranslations &&
-      hasEndPageParagraphTranslations
+      (_.isEmpty(paragraph) || hasEndPageParagraphTranslations)
     )
   }, [form?.endPage, unicodeLocale])
 
@@ -312,6 +341,7 @@ export const TranslationListSection = ({
           {form.startPage.paragraph && (
             <>
               <QuestionRow
+                key="Instructions"
                 questionTitle="Instructions"
                 icon={BxsDockTop}
                 isMyInfoField={false}
@@ -345,9 +375,26 @@ export const TranslationListSection = ({
             )
           })}
 
+          {/* Form Logic Prevent Submission Message Translation */}
+          {formLogicPreventSubmissions?.length !== 0 && (
+            <>
+              <QuestionRow
+                key="Form Logic"
+                questionTitle="Logic"
+                icon={BiGitMerge}
+                isMyInfoField={false}
+                hasTranslations={hasFormLogicTranslations}
+                isFormLogic={true}
+                unicodeLocale={language}
+              />
+              <Divider />
+            </>
+          )}
+
           {/* End Page Translation */}
           {form.endPage && (
             <QuestionRow
+              key="End Page"
               questionTitle={form.endPage?.title ?? ''}
               icon={PhHandsClapping}
               isMyInfoField={false}
diff --git a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TranslationSection.tsx b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TranslationSection.tsx
index 2bd198435c..235c9f35e0 100644
--- a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TranslationSection.tsx
+++ b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/TranslationSection.tsx
@@ -1,4 +1,3 @@
-import React from 'react'
 import { FormProvider, useForm } from 'react-hook-form'
 import { BiChevronLeft } from 'react-icons/bi'
 import { Button, Flex, Skeleton } from '@chakra-ui/react'
@@ -13,6 +12,7 @@ import { useAdminForm } from '~features/admin-form/common/queries'
 import { useTranslationLogic } from './mutations/useTranslationLogic'
 import { EndPageTranslationsContainer } from './EndPageTranslationContainer'
 import { FormFieldTranslationContainer } from './FormFieldTranslationContainer'
+import { FormLogicTranslationContainer } from './FormLogicTranslationContainer'
 import { StartPageTranslationContainer } from './StartPageTranslationContainer'
 
 export type TranslationInput = {
@@ -22,6 +22,7 @@ export type TranslationInput = {
   fieldOptionsTranslations: string
   tableColumnTitleTranslations: string[]
   tableColumnDropdownTranslations: string[]
+  preventSubmitMessageTranslations: string[]
 }
 
 interface TranslationSectionProps {
@@ -29,6 +30,7 @@ interface TranslationSectionProps {
   formFieldNumToBeTranslated: number
   isStartPageTranslations?: boolean
   isEndPageTranslations?: boolean
+  isFormLogicTranslations?: boolean
 }
 
 export const TranslationSection = ({
@@ -36,14 +38,10 @@ export const TranslationSection = ({
   formFieldNumToBeTranslated,
   isStartPageTranslations = false,
   isEndPageTranslations = false,
+  isFormLogicTranslations = false,
 }: TranslationSectionProps) => {
   const { data: form, isLoading } = useAdminForm()
-  const methods = useForm<TranslationInput>()
-  const { getValues } = methods
   const toast = useToast({ status: 'danger' })
-  const isFormField = formFieldNumToBeTranslated !== -1
-  const unicodeLocale = language as Language
-  const capitalisedLanguage = convertUnicodeLocaleToLanguage(unicodeLocale)
 
   if (!isLoading && !form) {
     toast({
@@ -52,20 +50,28 @@ export const TranslationSection = ({
     })
   }
 
+  const methods = useForm<TranslationInput>()
+  const { formState } = methods
+  const isFormField = formFieldNumToBeTranslated !== -1
+  const unicodeLocale = language as Language
+  const capitalisedLanguage = convertUnicodeLocaleToLanguage(unicodeLocale)
+
   const {
     handleOnBackClick,
     handleOnSaveClick,
     formFieldData,
     formStartPage,
     formEndPage,
+    formLogicsPreventSubmissions,
   } = useTranslationLogic({
     form,
-    getValues,
     language,
     formFieldNumToBeTranslated,
     isStartPageTranslations,
     isEndPageTranslations,
+    isFormLogicTranslations,
     isFormField,
+    methods,
   })
 
   return (
@@ -97,6 +103,14 @@ export const TranslationSection = ({
               formFieldData={formFieldData}
               capitalisedLanguage={capitalisedLanguage}
               unicodeLocale={unicodeLocale}
+              formState={formState}
+            />
+          )}
+          {isFormLogicTranslations && formLogicsPreventSubmissions && (
+            <FormLogicTranslationContainer
+              language={capitalisedLanguage}
+              unicodeLocale={unicodeLocale}
+              formLogics={formLogicsPreventSubmissions}
             />
           )}
           {isEndPageTranslations && formEndPage && (
diff --git a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/mutations/useTranslationLogic.ts b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/mutations/useTranslationLogic.ts
index b448f4e4ba..c95b413cbc 100644
--- a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/mutations/useTranslationLogic.ts
+++ b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/mutations/useTranslationLogic.ts
@@ -1,5 +1,5 @@
 import { useCallback, useEffect } from 'react'
-import { UseFormGetValues } from 'react-hook-form'
+import { UseFormReturn } from 'react-hook-form'
 import { useSearchParams } from 'react-router-dom'
 import _ from 'lodash'
 
@@ -9,6 +9,8 @@ import {
   FormEndPage,
   FormFieldDto,
   FormStartPage,
+  LogicType,
+  PreventSubmitLogicDto,
 } from '~shared/types'
 
 import { useMutateFormPage } from '~features/admin-form/common/mutations'
@@ -17,6 +19,11 @@ import {
   updateEditStateSelector,
   useFieldBuilderStore,
 } from '~features/admin-form/create/builder-and-design/useFieldBuilderStore'
+import {
+  setToInactiveSelector,
+  useAdminLogicStore,
+} from '~features/admin-form/create/logic/adminLogicStore'
+import { useLogicMutations } from '~features/admin-form/create/logic/mutations'
 
 import { TranslationInput } from '../TranslationSection'
 import {
@@ -24,6 +31,7 @@ import {
   updateFormFieldTranslations,
   updateFormStartPageTranslations,
   updateTableTranslations,
+  updateTranslations,
 } from '../utils/translationUtils'
 
 interface UseTranslationLogicProps {
@@ -32,8 +40,9 @@ interface UseTranslationLogicProps {
   formFieldNumToBeTranslated: number
   isStartPageTranslations: boolean
   isEndPageTranslations: boolean
+  isFormLogicTranslations: boolean
   isFormField: boolean
-  getValues: UseFormGetValues<TranslationInput>
+  methods: UseFormReturn<TranslationInput>
 }
 
 export const useTranslationLogic = ({
@@ -42,13 +51,17 @@ export const useTranslationLogic = ({
   formFieldNumToBeTranslated,
   isStartPageTranslations,
   isEndPageTranslations,
+  isFormLogicTranslations,
   isFormField,
-  getValues,
+  methods,
 }: UseTranslationLogicProps) => {
+  const { getValues, setError, clearErrors } = methods
   const [, setSearchParams] = useSearchParams()
   const { editFieldMutation } = useEditFormField()
+  const { updateLogicMutation } = useLogicMutations()
   const { endPageMutation, startPageMutation } = useMutateFormPage()
   const updateEditState = useFieldBuilderStore(updateEditStateSelector)
+  const setToInactive = useAdminLogicStore(setToInactiveSelector)
 
   const formFieldData =
     formFieldNumToBeTranslated !== -1
@@ -56,6 +69,9 @@ export const useTranslationLogic = ({
       : undefined
   const formStartPage = form?.startPage
   const formEndPage = form?.endPage
+  const formLogicsPreventSubmissions = form?.form_logics.filter(
+    (formLogic) => formLogic.logicType === LogicType.PreventSubmit,
+  ) as PreventSubmitLogicDto[]
   const fieldId = formFieldData?._id
 
   useEffect(() => {
@@ -66,7 +82,22 @@ export const useTranslationLogic = ({
     setSearchParams({ unicodeLocale: language })
   }, [language, setSearchParams])
 
-  const handleOnSaveClick = useCallback(() => {
+  const handleUpdateFormLogics = (
+    updatedFormLogics: PreventSubmitLogicDto[],
+  ) => {
+    updatedFormLogics.forEach((updatedFormLogic) => {
+      updateLogicMutation.mutate(
+        { ...updatedFormLogic, _id: updatedFormLogic._id },
+        {
+          onSuccess: () => setToInactive(),
+        },
+      )
+    })
+
+    handleOnBackClick()
+  }
+
+  const handleOnSaveClick = () => {
     const updatedTitleTranslation = getValues('titleTranslation')
     const updatedDescriptionTranslation = getValues('descriptionTranslation')
     const updatedParagraphTranslation = getValues('paragraphTranslations')
@@ -77,9 +108,13 @@ export const useTranslationLogic = ({
     const updatedTableColumnDropdownTranslation = getValues(
       'tableColumnDropdownTranslations',
     )
+    const updatedPreventSubmitTranslations = getValues(
+      'preventSubmitMessageTranslations',
+    )
 
     if (isFormField && formFieldData) {
       if (formFieldData.fieldType === BasicField.Table) {
+        clearErrors('tableColumnDropdownTranslations')
         const updatedTableData = updateTableTranslations({
           data: formFieldData,
           language,
@@ -89,13 +124,62 @@ export const useTranslationLogic = ({
           updatedDescriptionTranslation,
         })
 
+        const tableColumns = updatedTableData.columns
+
+        tableColumns.forEach((column, index) => {
+          if (column.columnType !== BasicField.Dropdown) return
+
+          const translationIndex =
+            column.fieldOptionsTranslations?.findIndex(
+              (t) => t.language === language,
+            ) ?? -1
+
+          if (
+            column.fieldOptionsTranslations &&
+            translationIndex !== -1 &&
+            column.fieldOptionsTranslations[translationIndex].translation
+              .length !== column.fieldOptions.length
+          ) {
+            setError(`tableColumnDropdownTranslations.${index}`, {
+              type: 'custom',
+              message:
+                'Make sure the number of translated options match the options in the question.',
+            })
+            return
+          }
+        })
+
+        for (const [index, tableColumn] of tableColumns.entries()) {
+          if (tableColumn.columnType === BasicField.Dropdown) {
+            const translationIndex =
+              tableColumn.fieldOptionsTranslations?.findIndex(
+                (t) => t.language === language,
+              ) ?? -1
+
+            if (
+              tableColumn.fieldOptionsTranslations &&
+              translationIndex !== -1 &&
+              tableColumn.fieldOptionsTranslations[translationIndex].translation
+                .length !== tableColumn.fieldOptions.length
+            ) {
+              setError(`tableColumnDropdownTranslations.${index}`, {
+                type: 'custom',
+                message:
+                  'Make sure the number of translated options match the options in the question.',
+              })
+              return
+            }
+          }
+        }
+
         editFieldMutation.mutate(
           { ...updatedTableData, _id: fieldId } as FormFieldDto,
           { onSuccess: handleOnBackClick },
         )
       } else {
-        let updatedFieldOptionsTranslationArr =
-          updatedFieldOptionsTranslation.split('\n')
+        let updatedFieldOptionsTranslationArr = updatedFieldOptionsTranslation
+          ? updatedFieldOptionsTranslation.split('\n')
+          : []
 
         updatedFieldOptionsTranslationArr =
           updatedFieldOptionsTranslationArr.filter(
@@ -110,6 +194,33 @@ export const useTranslationLogic = ({
           updatedFieldOptionsTranslation: updatedFieldOptionsTranslationArr,
         })
 
+        if (
+          updatedFormData.fieldType === BasicField.Dropdown ||
+          updatedFormData.fieldType === BasicField.Checkbox ||
+          updatedFormData.fieldType === BasicField.Radio
+        ) {
+          clearErrors('fieldOptionsTranslations')
+          const translationIndex =
+            updatedFormData.fieldOptionsTranslations?.findIndex(
+              (t) => t.language === language,
+            ) ?? -1
+          if (
+            updatedFormData.fieldOptionsTranslations &&
+            translationIndex !== -1 &&
+            updatedFormData.fieldOptionsTranslations[translationIndex]
+              .translation.length !== 0 &&
+            updatedFormData.fieldOptionsTranslations[translationIndex]
+              .translation.length !== updatedFormData.fieldOptions.length
+          ) {
+            setError('fieldOptionsTranslations', {
+              type: 'custom',
+              message:
+                'Make sure the number of translated options match the options in the question.',
+            })
+            return
+          }
+        }
+
         editFieldMutation.mutate(
           { ...updatedFormData, _id: fieldId } as FormFieldDto,
           { onSuccess: handleOnBackClick },
@@ -128,6 +239,26 @@ export const useTranslationLogic = ({
       })
     }
 
+    if (isFormLogicTranslations && formLogicsPreventSubmissions) {
+      const updatedFormLogics = formLogicsPreventSubmissions.map(
+        (preventSubmission, id) => {
+          const updatedTranslation = updatedPreventSubmitTranslations[id]
+          const updatedPreventSubmitMessageTranslations = updateTranslations({
+            translations: preventSubmission.preventSubmitMessageTranslations,
+            language,
+            newTranslation: updatedTranslation,
+          })
+
+          return {
+            ...preventSubmission,
+            preventSubmitMessageTranslations:
+              updatedPreventSubmitMessageTranslations,
+          }
+        },
+      )
+
+      handleUpdateFormLogics(updatedFormLogics)
+    }
     if (isEndPageTranslations && formEndPage) {
       const updatedFormEndPage = updateFormEndPageTranslations({
         data: formEndPage,
@@ -140,27 +271,14 @@ export const useTranslationLogic = ({
         onSuccess: handleOnBackClick,
       })
     }
-  }, [
-    getValues,
-    isFormField,
-    formFieldData,
-    isStartPageTranslations,
-    formStartPage,
-    isEndPageTranslations,
-    formEndPage,
-    language,
-    editFieldMutation,
-    fieldId,
-    handleOnBackClick,
-    startPageMutation,
-    endPageMutation,
-  ])
+  }
 
   return {
     handleOnSaveClick,
     formFieldData,
     formStartPage,
     formEndPage,
+    formLogicsPreventSubmissions,
     handleOnBackClick,
   }
 }
diff --git a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/utils/translationUtils.ts b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/utils/translationUtils.ts
index b9fd1f1514..5d3453da68 100644
--- a/frontend/src/features/admin-form/settings/components/MultiLanguageSection/utils/translationUtils.ts
+++ b/frontend/src/features/admin-form/settings/components/MultiLanguageSection/utils/translationUtils.ts
@@ -172,7 +172,7 @@ export const updateTableTranslations = ({
   }
 }
 
-const updateTranslations = ({
+export const updateTranslations = ({
   translations,
   language,
   newTranslation,
@@ -187,12 +187,19 @@ const updateTranslations = ({
   )
 
   if (translationIndex !== -1) {
-    updatedTranslations[translationIndex].translation = newTranslation
+    // Remove translation mapping from array if new translation is an empty string
+    if (_.isEmpty(newTranslation)) {
+      updatedTranslations.splice(translationIndex, 1)
+    } else {
+      updatedTranslations[translationIndex].translation = newTranslation
+    }
   } else {
-    updatedTranslations.push({
-      language: language as Language,
-      translation: newTranslation,
-    })
+    if (!_.isEmpty(newTranslation)) {
+      updatedTranslations.push({
+        language: language as Language,
+        translation: newTranslation,
+      })
+    }
   }
 
   return updatedTranslations
@@ -213,12 +220,19 @@ const updateOptionsTranslations = ({
   )
 
   if (translationIndex !== -1) {
-    updatedTranslations[translationIndex].translation = newTranslations
+    // Remove translation mapping from array if new translation is an empty string
+    if (_.isEmpty(newTranslations)) {
+      updatedTranslations.splice(translationIndex, 1)
+    } else {
+      updatedTranslations[translationIndex].translation = newTranslations
+    }
   } else {
-    updatedTranslations.push({
-      language: language as Language,
-      translation: newTranslations,
-    })
+    if (!_.isEmpty(newTranslations)) {
+      updatedTranslations.push({
+        language: language as Language,
+        translation: newTranslations,
+      })
+    }
   }
 
   return updatedTranslations
diff --git a/frontend/src/features/public-form/PublicFormPage.tsx b/frontend/src/features/public-form/PublicFormPage.tsx
index a37128e497..e55b16e793 100644
--- a/frontend/src/features/public-form/PublicFormPage.tsx
+++ b/frontend/src/features/public-form/PublicFormPage.tsx
@@ -12,6 +12,7 @@ import FormInstructions from './components/FormInstructions'
 import FormIssueFeedback from './components/FormIssueFeedback'
 import { PublicFormLogo } from './components/FormLogo'
 import FormStartPage from './components/FormStartPage'
+import LanguageControl from './components/LanguageControl'
 import { PublicFormWrapper } from './components/PublicFormWrapper'
 import { PublicFormProvider } from './PublicFormProvider'
 
@@ -34,6 +35,7 @@ export const PublicFormPage = (): JSX.Element => {
           <FormBanner />
           <PublicFormLogo />
           <FormStartPage />
+          <LanguageControl />
           <PublicFormWrapper>
             <FormInstructions />
             <FormFields />
diff --git a/frontend/src/features/public-form/PublicFormProvider.tsx b/frontend/src/features/public-form/PublicFormProvider.tsx
index 79bd1f6b77..5e29cb7f4e 100644
--- a/frontend/src/features/public-form/PublicFormProvider.tsx
+++ b/frontend/src/features/public-form/PublicFormProvider.tsx
@@ -29,6 +29,7 @@ import { ErrorCode } from '~shared/types/errorCodes'
 import {
   FormAuthType,
   FormResponseMode,
+  Language,
   ProductItem,
   PublicFormDto,
 } from '~shared/types/form'
@@ -187,7 +188,8 @@ export const PublicFormProvider = ({
   children,
   startTime,
 }: PublicFormProviderProps): JSX.Element => {
-  const { t } = useTranslation()
+  const { t, i18n } = useTranslation()
+  const selectedLanguage = i18n.language as Language
 
   // Once form has been submitted, submission data will be set here.
   const [submissionData, setSubmissionData] = useState<SubmissionData>()
@@ -590,6 +592,7 @@ export const PublicFormProvider = ({
             ? numVisibleFields + 1
             : numVisibleFields,
         },
+        selectedFormLanguage: selectedLanguage,
       }
 
       const logMeta = {
diff --git a/frontend/src/features/public-form/PublicFormService.ts b/frontend/src/features/public-form/PublicFormService.ts
index 50aeaa73fa..af7e796c43 100644
--- a/frontend/src/features/public-form/PublicFormService.ts
+++ b/frontend/src/features/public-form/PublicFormService.ts
@@ -21,6 +21,7 @@ import {
 import {
   FormAuthType,
   FormDto,
+  Language,
   PublicFormViewDto,
 } from '~shared/types/form/form'
 import {
@@ -49,6 +50,8 @@ import { MultirespondentSubmissionDtoWithAttachments } from './types'
 
 export const PUBLIC_FORMS_ENDPOINT = '/forms'
 
+export const X_FORMSG_SELECTED_FORM_LANGUAGE = 'X-Formsg-Selected-Form-Language'
+
 /**
  * Gets public view of form, along with any
  * identify information obtained from Singpass/Corppass/MyInfo.
@@ -136,6 +139,7 @@ export type SubmitEmailFormArgs = {
   formLogics: FormDto['form_logics']
   formInputs: FormFieldValues
   responseMetadata?: ResponseMetadata
+  selectedFormLanguage?: Language
 }
 
 export type SubmitStorageFormArgs = SubmitEmailFormArgs & {
@@ -175,6 +179,7 @@ export const submitEmailModeForm = async ({
   captchaResponse = null,
   captchaType = '',
   responseMetadata,
+  selectedFormLanguage = Language.ENGLISH,
 }: SubmitEmailFormArgs): Promise<SubmissionResponseDto> => {
   const filteredInputs = filterHiddenInputs({
     formFields,
@@ -195,6 +200,9 @@ export const submitEmailModeForm = async ({
         captchaResponse: String(captchaResponse),
         captchaType: captchaType,
       },
+      headers: {
+        [X_FORMSG_SELECTED_FORM_LANGUAGE]: selectedFormLanguage,
+      },
     },
   ).then(({ data }) => data)
 }
@@ -266,6 +274,7 @@ export const submitStorageModeForm = async ({
   paymentProducts,
   payments,
   fieldIdToQuarantineKeyMap,
+  selectedFormLanguage = Language.ENGLISH,
 }: SubmitStorageFormWithVirusScanningArgs) => {
   const filteredInputs = filterHiddenInputs({
     formFields,
@@ -294,6 +303,9 @@ export const submitStorageModeForm = async ({
         captchaResponse: String(captchaResponse),
         captchaType: captchaType,
       },
+      headers: {
+        [X_FORMSG_SELECTED_FORM_LANGUAGE]: selectedFormLanguage,
+      },
     },
   ).then(({ data }) => data)
 }
@@ -349,6 +361,7 @@ export const submitMultirespondentForm = async ({
   captchaType = '',
   responseMetadata,
   fieldIdToQuarantineKeyMap,
+  selectedFormLanguage = Language.ENGLISH,
 }: SubmitMultirespondentFormWithVirusScanningArgs) => {
   const filteredInputs = filterHiddenInputs({
     formFields,
@@ -374,6 +387,9 @@ export const submitMultirespondentForm = async ({
         captchaResponse: String(captchaResponse),
         captchaType: captchaType,
       },
+      headers: {
+        [X_FORMSG_SELECTED_FORM_LANGUAGE]: selectedFormLanguage,
+      },
     },
   ).then(({ data }) => data)
 }
diff --git a/frontend/src/features/public-form/components/FormFields/FormSectionsContext.tsx b/frontend/src/features/public-form/components/FormFields/FormSectionsContext.tsx
index 7642d9e661..0eb17c7875 100644
--- a/frontend/src/features/public-form/components/FormFields/FormSectionsContext.tsx
+++ b/frontend/src/features/public-form/components/FormFields/FormSectionsContext.tsx
@@ -7,6 +7,7 @@ import {
   useMemo,
   useState,
 } from 'react'
+import { useTranslation } from 'react-i18next'
 import useScrollSpy from 'react-use-scrollspy'
 
 import { BasicField, FormFieldDto } from '~shared/types'
@@ -16,7 +17,10 @@ import { usePublicFormContext } from '~features/public-form/PublicFormContext'
 
 import { PUBLICFORM_INSTRUCTIONS_SECTIONID } from '../FormInstructions/FormInstructionsContainer'
 
-export type SidebarSectionMeta = Pick<FormFieldDto, 'title' | '_id'>
+export type SidebarSectionMeta = Pick<
+  FormFieldDto,
+  'title' | '_id' | 'titleTranslations'
+>
 
 interface FormSectionsContextProps {
   /** Scroll data to allow form-fillers to scroll to a particular section. */
@@ -39,6 +43,7 @@ interface FormSectionsProviderProps {
 export const FormSectionsProvider = ({
   children,
 }: FormSectionsProviderProps): JSX.Element => {
+  const { t } = useTranslation()
   const { form, isAuthRequired } = usePublicFormContext()
 
   const [visibleFieldIds, setVisibleFieldIds] = useState<FieldIdSet>()
@@ -48,7 +53,8 @@ export const FormSectionsProvider = ({
     const sections: SidebarSectionMeta[] = []
     if (form.startPage.paragraph)
       sections.push({
-        title: 'Instructions',
+        title: t('features.publicForm.components.instructions.title'),
+        titleTranslations: [],
         _id: PUBLICFORM_INSTRUCTIONS_SECTIONID,
       })
     form.form_fields.forEach((f) => {
@@ -56,11 +62,12 @@ export const FormSectionsProvider = ({
         return
       sections.push({
         title: f.title,
+        titleTranslations: f.titleTranslations,
         _id: f._id,
       })
     })
     return sections
-  }, [form, isAuthRequired, visibleFieldIds])
+  }, [form, isAuthRequired, visibleFieldIds, t])
 
   const [sectionRefs, setSectionRefs] = useState<
     Record<string, RefObject<HTMLDivElement>>
diff --git a/frontend/src/features/public-form/components/FormFields/PublicFormSubmitButton.tsx b/frontend/src/features/public-form/components/FormFields/PublicFormSubmitButton.tsx
index 874c87d6e1..bffe966875 100644
--- a/frontend/src/features/public-form/components/FormFields/PublicFormSubmitButton.tsx
+++ b/frontend/src/features/public-form/components/FormFields/PublicFormSubmitButton.tsx
@@ -4,10 +4,11 @@ import { useTranslation } from 'react-i18next'
 import { Stack, useDisclosure, VisuallyHidden } from '@chakra-ui/react'
 
 import { PAYMENT_CONTACT_FIELD_ID } from '~shared/constants'
-import { FormField, LogicDto, MyInfoFormField } from '~shared/types'
+import { FormField, Language, LogicDto, MyInfoFormField } from '~shared/types'
 
 import { ThemeColorScheme } from '~theme/foundations/colours'
 import { useIsMobile } from '~hooks/useIsMobile'
+import { getValueInSelectedLanguage } from '~utils/multiLanguage'
 import Button from '~components/Button'
 import InlineMessage from '~components/InlineMessage'
 import { FormFieldValues, VerifiableFieldValues } from '~templates/Field'
@@ -39,7 +40,7 @@ export const PublicFormSubmitButton = ({
   onSubmit,
   trigger,
 }: PublicFormSubmitButtonProps): JSX.Element => {
-  const { t } = useTranslation()
+  const { t, i18n } = useTranslation()
   const [prevPaymentId, setPrevPaymentId] = useState('')
 
   const isMobile = useIsMobile()
@@ -65,6 +66,12 @@ export const PublicFormSubmitButton = ({
     })
   }, [formInputs, formFields, formLogics])
 
+  const preventSubmissionMessage = getValueInSelectedLanguage({
+    defaultValue: preventSubmissionLogic?.preventSubmitMessage ?? '',
+    translations: preventSubmissionLogic?.preventSubmitMessageTranslations,
+    selectedLanguage: i18n.language as Language,
+  })
+
   // For payments submit and pay modal
   const {
     isOpen: isPaymentsModalOpen,
@@ -144,7 +151,7 @@ export const PublicFormSubmitButton = ({
       </Button>
       {preventSubmissionLogic ? (
         <InlineMessage variant="warning">
-          {preventSubmissionLogic.preventSubmitMessage}
+          {preventSubmissionMessage}
         </InlineMessage>
       ) : null}
     </Stack>
diff --git a/frontend/src/features/public-form/components/FormInstructions/FormInstructions.tsx b/frontend/src/features/public-form/components/FormInstructions/FormInstructions.tsx
index aafe742b8f..53adb2fef4 100644
--- a/frontend/src/features/public-form/components/FormInstructions/FormInstructions.tsx
+++ b/frontend/src/features/public-form/components/FormInstructions/FormInstructions.tsx
@@ -1,3 +1,4 @@
+import { useTranslation } from 'react-i18next'
 import { Box } from '@chakra-ui/react'
 
 import { FormColorTheme } from '~shared/types'
@@ -15,6 +16,7 @@ export const FormInstructions = ({
   content,
   colorTheme,
 }: FormInstructionsProps): JSX.Element => {
+  const { t } = useTranslation()
   const sectionColor = useSectionColor(colorTheme)
   const mdComponents = useMdComponents({
     styles: {
@@ -28,7 +30,7 @@ export const FormInstructions = ({
   return (
     <>
       <Box as="h2" textStyle="h2" color={sectionColor}>
-        Instructions
+        {t('features.publicForm.components.instructions.title')}
       </Box>
       <Box mt="1rem">
         <MarkdownText multilineBreaks components={mdComponents}>
diff --git a/frontend/src/features/public-form/components/FormInstructions/FormInstructionsContainer.tsx b/frontend/src/features/public-form/components/FormInstructions/FormInstructionsContainer.tsx
index e919037c45..24c2dafc67 100644
--- a/frontend/src/features/public-form/components/FormInstructions/FormInstructionsContainer.tsx
+++ b/frontend/src/features/public-form/components/FormInstructions/FormInstructionsContainer.tsx
@@ -1,5 +1,10 @@
+import { useTranslation } from 'react-i18next'
 import { Box, Flex } from '@chakra-ui/react'
 
+import { Language } from '~shared/types'
+
+import { getValueInSelectedLanguage } from '~utils/multiLanguage'
+
 import { usePublicFormContext } from '~features/public-form/PublicFormContext'
 
 import { useFormSections } from '../FormFields/FormSectionsContext'
@@ -9,11 +14,18 @@ import { FormInstructions } from './FormInstructions'
 export const PUBLICFORM_INSTRUCTIONS_SECTIONID = 'instructions'
 
 export const FormInstructionsContainer = (): JSX.Element | null => {
+  const { i18n } = useTranslation()
   const { sectionRefs } = useFormSections()
   const { form, submissionData } = usePublicFormContext()
 
   if (submissionData || !form?.startPage.paragraph) return null
 
+  const paragraph = getValueInSelectedLanguage({
+    defaultValue: form.startPage.paragraph,
+    translations: form.startPage.paragraphTranslations,
+    selectedLanguage: i18n.language as Language,
+  })
+
   return (
     <Flex justify="center">
       <Box
@@ -38,7 +50,7 @@ export const FormInstructionsContainer = (): JSX.Element | null => {
           tabIndex={-1}
         >
           <FormInstructions
-            content={form?.startPage.paragraph}
+            content={paragraph}
             colorTheme={form?.startPage.colorTheme}
           />
         </Box>
diff --git a/frontend/src/features/public-form/components/FormStartPage/FormStartPage.tsx b/frontend/src/features/public-form/components/FormStartPage/FormStartPage.tsx
index eab78ea300..8b015eee1c 100644
--- a/frontend/src/features/public-form/components/FormStartPage/FormStartPage.tsx
+++ b/frontend/src/features/public-form/components/FormStartPage/FormStartPage.tsx
@@ -28,7 +28,9 @@ export const FormStartPage = ({
     [submissionData],
   )
 
-  const formHeaderProps = useFormHeader({ startPage: form?.startPage })
+  const formHeaderProps = useFormHeader({
+    startPage: form?.startPage,
+  })
 
   return (
     <FormHeader
diff --git a/frontend/src/features/public-form/components/FormStartPage/useFormHeader.tsx b/frontend/src/features/public-form/components/FormStartPage/useFormHeader.tsx
index a344a1abde..23cb7fcb13 100644
--- a/frontend/src/features/public-form/components/FormStartPage/useFormHeader.tsx
+++ b/frontend/src/features/public-form/components/FormStartPage/useFormHeader.tsx
@@ -1,5 +1,5 @@
 import { useMemo } from 'react'
-import simplur from 'simplur'
+import { useTranslation } from 'react-i18next'
 
 import { FormColorTheme, FormStartPage } from '~shared/types'
 
@@ -14,6 +14,7 @@ export const getTitleBg = (colorTheme?: FormColorTheme, hover?: boolean) =>
   colorTheme ? `theme-${colorTheme}.${hover ? 6 : 5}00` : `neutral.200`
 
 export const useFormHeader = ({ startPage, hover }: UseFormHeaderProps) => {
+  const { t } = useTranslation()
   const titleColor = useMemo(() => {
     if (startPage?.colorTheme === FormColorTheme.Orange) {
       return 'secondary.700'
@@ -27,9 +28,12 @@ export const useFormHeader = ({ startPage, hover }: UseFormHeaderProps) => {
   )
 
   const estTimeString = useMemo(() => {
-    if (!startPage?.estTimeTaken) return ''
-    return simplur`${startPage.estTimeTaken} min[|s] estimated time to complete`
-  }, [startPage])
+    return startPage?.estTimeTaken
+      ? t('features.publicForm.components.header.estTime', {
+          estTime: startPage.estTimeTaken,
+        })
+      : ''
+  }, [t, startPage?.estTimeTaken])
 
   const colorScheme: ThemeColorScheme | undefined = useMemo(() => {
     if (!startPage?.colorTheme) return
diff --git a/frontend/src/features/public-form/components/LanguageControl/LanguageControl.tsx b/frontend/src/features/public-form/components/LanguageControl/LanguageControl.tsx
new file mode 100644
index 0000000000..a56f65a531
--- /dev/null
+++ b/frontend/src/features/public-form/components/LanguageControl/LanguageControl.tsx
@@ -0,0 +1,119 @@
+import { useEffect } from 'react'
+import { useTranslation } from 'react-i18next'
+import { BiChevronDown } from 'react-icons/bi'
+import {
+  Button,
+  Flex,
+  HStack,
+  Menu,
+  MenuButton,
+  MenuItem,
+  MenuList,
+} from '@chakra-ui/react'
+
+import { Language } from '~shared/types'
+
+import { usePublicFormContext } from '~features/public-form/PublicFormContext'
+
+import { useBgColor } from '../PublicFormWrapper'
+
+type LanguageListType = {
+  language: Language
+  title: string
+}
+
+const LANGUAGES: LanguageListType[] = [
+  { language: Language.ENGLISH, title: 'English' },
+  { language: Language.CHINESE, title: '中文' },
+  { language: Language.MALAY, title: 'Melayu' },
+  { language: Language.TAMIL, title: 'தமிழ்' },
+]
+
+export const LanguageControl = (): JSX.Element | null => {
+  const { i18n } = useTranslation()
+  const { form, submissionData } = usePublicFormContext()
+
+  const availableLanguages = new Set(form?.supportedLanguages ?? [])
+
+  const languagesList = LANGUAGES.filter((language) =>
+    availableLanguages.has(language.language),
+  )
+
+  // English language is always supported. Hence if form supports multi-lang
+  // and there is more than one supported language available, show the
+  // language dropdown.
+  const shouldShowLanguageDropdown =
+    form?.hasMultiLang && availableLanguages.size > 1
+
+  const bgColour = useBgColor({
+    colorTheme: form?.startPage.colorTheme,
+  })
+
+  const handleLanguageChange = (language: string) => {
+    i18n.changeLanguage(language)
+  }
+
+  const selectedI18nLanguage = languagesList.find(
+    ({ language }) => language === i18n.language,
+  )
+  const selectedLanguage =
+    selectedI18nLanguage ??
+    languagesList.find(({ language }) => language === Language.ENGLISH)
+
+  // For good measure, ensure i18n.language and selectedLanguage line up
+  useEffect(() => {
+    i18n.changeLanguage(selectedLanguage?.language)
+  }, [i18n, selectedLanguage])
+
+  // Submission data is not undefined in the form end page. Use
+  // this to not render the language control component in the form
+  // end page.
+  if (submissionData) return null
+
+  if (!shouldShowLanguageDropdown) return null
+
+  return (
+    <Flex
+      background={bgColour}
+      zIndex={10}
+      px={{ base: '1.5rem', md: 0 }}
+      justifyContent={{ base: 'start', md: 'center' }}
+    >
+      <HStack
+        mt={{ base: '-1rem', md: '-2rem' }}
+        mb={{ base: '1rem', md: 0 }}
+        bg="white"
+        borderRadius="0.25rem"
+        shadow="md"
+      >
+        <Menu variant="clear">
+          <MenuButton
+            as={Button}
+            rightIcon={<BiChevronDown />}
+            variant="clear"
+            color="secondary.500"
+          >
+            {selectedLanguage?.title}
+          </MenuButton>
+          <MenuList>
+            {languagesList.map((language) => {
+              return (
+                <MenuItem
+                  onClick={() => {
+                    handleLanguageChange(language.language)
+                  }}
+                  px={4}
+                  h={12}
+                  w="140px"
+                  id={language.language}
+                >
+                  {language.title}
+                </MenuItem>
+              )
+            })}
+          </MenuList>
+        </Menu>
+      </HStack>
+    </Flex>
+  )
+}
diff --git a/frontend/src/features/public-form/components/LanguageControl/index.ts b/frontend/src/features/public-form/components/LanguageControl/index.ts
new file mode 100644
index 0000000000..5fc11afd5c
--- /dev/null
+++ b/frontend/src/features/public-form/components/LanguageControl/index.ts
@@ -0,0 +1 @@
+export { LanguageControl as default } from './LanguageControl'
diff --git a/frontend/src/features/public-form/components/SectionSidebar/SidebarLink.tsx b/frontend/src/features/public-form/components/SectionSidebar/SidebarLink.tsx
index aa46f17273..f79478234d 100644
--- a/frontend/src/features/public-form/components/SectionSidebar/SidebarLink.tsx
+++ b/frontend/src/features/public-form/components/SectionSidebar/SidebarLink.tsx
@@ -1,6 +1,11 @@
 import { useCallback, useMemo } from 'react'
+import { useTranslation } from 'react-i18next'
 import { Box, chakra, useStyleConfig, VisuallyHidden } from '@chakra-ui/react'
 
+import { Language } from '~shared/types'
+
+import { getValueInSelectedLanguage } from '~utils/multiLanguage'
+
 import { usePublicFormContext } from '~features/public-form/PublicFormContext'
 
 import {
@@ -24,6 +29,7 @@ export const SidebarLink = ({
   isActive,
   sectionMeta,
 }: SidebarLinkProps): JSX.Element => {
+  const { i18n } = useTranslation()
   const { sectionRefs, setNavigatedSectionId } = useFormSections()
   const { miniHeaderRef, onMobileDrawerClose } = usePublicFormContext()
 
@@ -63,6 +69,13 @@ export const SidebarLink = ({
     variant: 'standalone',
   })
 
+  const selectedLanguage = i18n.language as Language
+  const title = getValueInSelectedLanguage({
+    defaultValue: sectionMeta.title,
+    translations: sectionMeta.titleTranslations,
+    selectedLanguage,
+  })
+
   return (
     <chakra.button
       __css={styles}
@@ -86,7 +99,7 @@ export const SidebarLink = ({
         />
       )}
       <VisuallyHidden>Navigate to section: </VisuallyHidden>
-      {sectionMeta.title}
+      {title}
     </chakra.button>
   )
 }
diff --git a/frontend/src/features/verifiable-fields/Email/VerifiableEmailField.tsx b/frontend/src/features/verifiable-fields/Email/VerifiableEmailField.tsx
index 66643f558d..d06132ab0c 100644
--- a/frontend/src/features/verifiable-fields/Email/VerifiableEmailField.tsx
+++ b/frontend/src/features/verifiable-fields/Email/VerifiableEmailField.tsx
@@ -1,4 +1,5 @@
 import { useMemo } from 'react'
+import { useTranslation } from 'react-i18next'
 import { Box, VisuallyHidden } from '@chakra-ui/react'
 
 import { baseEmailValidationFn } from '~utils/fieldValidation'
@@ -68,7 +69,14 @@ export const VerifiableEmailField = ({
   schema,
   ...props
 }: VerifiableEmailFieldProps) => {
-  const validateInputForVfn = baseEmailValidationFn(schema)
+  const { t } = useTranslation()
+  const validateInputForVfn = baseEmailValidationFn({
+    schema,
+    validationErrorMessages: t(
+      'features.publicForm.components.fields.email.validation',
+      { allowObjects: true },
+    ),
+  })
   return (
     <VerifiableFieldProvider
       schema={schema}
diff --git a/frontend/src/features/verifiable-fields/components/VerifiableFieldContainer/VerifiableFieldContainer.tsx b/frontend/src/features/verifiable-fields/components/VerifiableFieldContainer/VerifiableFieldContainer.tsx
index 68f168fd2b..d77a14ebad 100644
--- a/frontend/src/features/verifiable-fields/components/VerifiableFieldContainer/VerifiableFieldContainer.tsx
+++ b/frontend/src/features/verifiable-fields/components/VerifiableFieldContainer/VerifiableFieldContainer.tsx
@@ -1,4 +1,5 @@
 import { useMemo } from 'react'
+import { useTranslation } from 'react-i18next'
 import { BiCheck } from 'react-icons/bi'
 import { Box, Stack } from '@chakra-ui/react'
 
@@ -29,6 +30,7 @@ export const VerifiableFieldContainer = ({
   colorTheme = FormColorTheme.Blue,
   children,
 }: VerifiableFieldContainerProps): JSX.Element => {
+  const { t } = useTranslation()
   const {
     isVfnBoxOpen,
     otpPrefix,
@@ -71,8 +73,13 @@ export const VerifiableFieldContainer = ({
                 hasSignature ? <BiCheck fontSize="1.5rem" /> : undefined
               }
               aria-label={verifyButtonAriaLabel}
+              // This is to ensure that Chinese characters are not wrapped
+              // with new lines within the button.
+              whiteSpace="nowrap"
             >
-              {hasSignature ? 'Verified' : 'Verify'}
+              {t(
+                `features.publicForm.components.fields.verification.button.label.${hasSignature ? 'verified' : 'verify'}`,
+              )}
             </Button>
           </Box>
         </Stack>
diff --git a/frontend/src/features/verifiable-fields/components/VerificationBox/VerificationBox.tsx b/frontend/src/features/verifiable-fields/components/VerificationBox/VerificationBox.tsx
index 544154fbf8..acd7ca7e62 100644
--- a/frontend/src/features/verifiable-fields/components/VerificationBox/VerificationBox.tsx
+++ b/frontend/src/features/verifiable-fields/components/VerificationBox/VerificationBox.tsx
@@ -1,5 +1,6 @@
-import { useCallback, useMemo } from 'react'
+import { useCallback } from 'react'
 import { useForm } from 'react-hook-form'
+import { useTranslation } from 'react-i18next'
 import {
   Box,
   Flex,
@@ -8,6 +9,8 @@ import {
   InputLeftAddon,
 } from '@chakra-ui/react'
 
+import { BasicField } from '~shared/types'
+
 import ResendOtpButton from '~/templates/ResendOtpButton'
 
 import { HttpError } from '~services/ApiService'
@@ -18,7 +21,8 @@ import Input from '~components/Input'
 
 import { VerifiableFieldType } from '../../types'
 
-import { VFN_RENDER_DATA } from './constants'
+import { EmailOtpSvgr } from './EmailOtpSvgr'
+import { MobileOtpSvgr } from './MobileOtpSvgr'
 
 type VfnFieldValues = {
   otp: string
@@ -68,6 +72,7 @@ export const VerificationBox = ({
   handleResendOtp,
   handleVerifyOtp,
 }: VerificationBoxProps): JSX.Element => {
+  const { t } = useTranslation()
   const {
     formMethods: {
       register,
@@ -79,11 +84,15 @@ export const VerificationBox = ({
     handleVerifyOtp,
   })
 
-  const {
-    logo: Logo,
-    header,
-    subheader,
-  } = useMemo(() => VFN_RENDER_DATA[fieldType], [fieldType])
+  const Logo = {
+    [BasicField.Mobile]: MobileOtpSvgr,
+    [BasicField.Email]: EmailOtpSvgr,
+  }[fieldType]
+
+  const { title, description } = t(
+    `features.publicForm.components.fields.verification.modal.${fieldType}`,
+    { allowObjects: true },
+  )
 
   return (
     <Flex
@@ -103,7 +112,7 @@ export const VerificationBox = ({
             isInvalid={!!errors.otp}
             maxW="24.75rem"
           >
-            <FormLabel description={subheader}>{header}</FormLabel>
+            <FormLabel description={description}>{title}</FormLabel>
             <Flex>
               <InputGroup>
                 {otpPrefix ? (
diff --git a/frontend/src/features/verifiable-fields/components/VerificationBox/constants.ts b/frontend/src/features/verifiable-fields/components/VerificationBox/constants.ts
deleted file mode 100644
index 1a9e2ec467..0000000000
--- a/frontend/src/features/verifiable-fields/components/VerificationBox/constants.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import { ChakraComponent } from '@chakra-ui/react'
-
-import { BasicField } from '~shared/types/field'
-
-import { VerifiableFieldType } from '~features/verifiable-fields/types'
-
-import { EmailOtpSvgr } from './EmailOtpSvgr'
-import { MobileOtpSvgr } from './MobileOtpSvgr'
-
-type VerificationBoxRenderData = {
-  logo: ChakraComponent<(props: React.SVGProps<SVGSVGElement>) => JSX.Element>
-  header: string
-  subheader: string
-}
-
-export const VFN_RENDER_DATA: Record<
-  VerifiableFieldType,
-  VerificationBoxRenderData
-> = {
-  [BasicField.Mobile]: {
-    logo: MobileOtpSvgr,
-    header: 'Verify your mobile number',
-    subheader:
-      'An SMS with a 6-digit verification code was sent to you. It will be valid for 30 minutes.',
-  },
-  [BasicField.Email]: {
-    logo: EmailOtpSvgr,
-    header: 'Verify your email',
-    subheader:
-      'An email with a 6-digit verification code was sent to you. It will be valid for 30 minutes.',
-  },
-}
diff --git a/frontend/src/i18n/locales/features/admin-form/sidebar/fields/en-sg.ts b/frontend/src/i18n/locales/features/admin-form/sidebar/fields/en-sg.ts
index 73b8f7eb67..d4090881ef 100644
--- a/frontend/src/i18n/locales/features/admin-form/sidebar/fields/en-sg.ts
+++ b/frontend/src/i18n/locales/features/admin-form/sidebar/fields/en-sg.ts
@@ -35,7 +35,6 @@ export const enSG: Fields = {
     charactersAllowedPlaceholder: 'Number of characters',
   },
   radio: {
-    others: 'Others',
     options: {
       title: 'Options',
       placeholder: 'Enter one option per line',
@@ -52,10 +51,6 @@ export const enSG: Fields = {
       maximum: 'Maximum',
     },
   },
-  yesNo: {
-    yes: 'Yes',
-    no: 'No',
-  },
   paragraph: 'Paragraph',
   section: {
     heading: 'Section heading',
@@ -126,23 +121,6 @@ export const enSG: Fields = {
   imageAttachment: {
     title: 'Uploaded image',
     requiredError: 'Please upload an image',
-    fileUploaderLink: 'Choose file',
-    dragAndDrop: ' or drag and drop here',
-    dragActive: 'Drop the file here',
-    maxFileSize: 'Maximum file size: {readableMaxSize}',
-    ariaLabelRemove: 'Click to remove file',
-    error: {
-      fileEmpty:
-        'You have uploaded an empty file, please upload a valid attachment',
-      fileTooLarge:
-        'You have exceeded the limit, please upload a file below {readableMaxSize}',
-      fileInvalidType:
-        "Your file's extension ending in *{fileExt} is not allowed",
-      tooManyFiles: 'You can only upload a single file in this input',
-      zipFileInvalidType:
-        'The following file extensions in your zip file are not valid: {stringOfInvalidExtensions}',
-      zipParsing: 'An error has occurred whilst parsing your zip file',
-    },
   },
   table: {
     minimumRows: 'Minimum rows',
diff --git a/frontend/src/i18n/locales/features/admin-form/sidebar/fields/index.ts b/frontend/src/i18n/locales/features/admin-form/sidebar/fields/index.ts
index b369be54e0..12c2e31b1c 100644
--- a/frontend/src/i18n/locales/features/admin-form/sidebar/fields/index.ts
+++ b/frontend/src/i18n/locales/features/admin-form/sidebar/fields/index.ts
@@ -35,7 +35,6 @@ export interface Fields {
     charactersAllowedPlaceholder: string
   }
   radio: {
-    others: string
     options: {
       title: string
       placeholder: string
@@ -51,10 +50,6 @@ export interface Fields {
       maximum: string
     }
   }
-  yesNo: {
-    yes: string
-    no: string
-  }
   paragraph: string
   section: {
     heading: string
@@ -123,19 +118,6 @@ export interface Fields {
   imageAttachment: {
     title: string
     requiredError: string
-    fileUploaderLink: string
-    dragAndDrop: string
-    dragActive: string
-    maxFileSize: string
-    ariaLabelRemove: string
-    error: {
-      fileEmpty: string
-      fileTooLarge: string
-      fileInvalidType: string
-      tooManyFiles: string
-      zipFileInvalidType: string
-      zipParsing: string
-    }
   }
   table: {
     minimumRows: string
diff --git a/frontend/src/i18n/locales/features/common/en-sg.ts b/frontend/src/i18n/locales/features/common/en-sg.ts
index c27ff181bf..6dd9ac7445 100644
--- a/frontend/src/i18n/locales/features/common/en-sg.ts
+++ b/frontend/src/i18n/locales/features/common/en-sg.ts
@@ -58,9 +58,6 @@ export const enSG: Common = {
     duplicateField: 'Duplicate field',
     editField: 'Edit field',
   },
-  dropdown: {
-    placeholder: 'Select an option',
-  },
   days: {
     Mondays: 'Monday',
     Tuesdays: 'Tuesday',
diff --git a/frontend/src/i18n/locales/features/common/index.ts b/frontend/src/i18n/locales/features/common/index.ts
index 8d948abddd..d417c65d15 100644
--- a/frontend/src/i18n/locales/features/common/index.ts
+++ b/frontend/src/i18n/locales/features/common/index.ts
@@ -58,9 +58,6 @@ export interface Common {
     duplicateField: string
     editField: string
   }
-  dropdown: {
-    placeholder: string
-  }
   days: {
     Mondays: string
     Tuesdays: string
diff --git a/frontend/src/i18n/locales/features/public-form/en-sg.ts b/frontend/src/i18n/locales/features/public-form/en-sg.ts
index f6fa06dc1f..0b28030764 100644
--- a/frontend/src/i18n/locales/features/public-form/en-sg.ts
+++ b/frontend/src/i18n/locales/features/public-form/en-sg.ts
@@ -1,3 +1,4 @@
+import { enSG as fields } from './fields'
 import { enSG as table } from './table'
 import { PublicForm } from '.'
 
@@ -24,6 +25,10 @@ export const enSG: PublicForm = {
       'Your verified fields have expired. Please verify those fields again.',
   },
   components: {
+    header: {
+      estTime:
+        '{estTime, plural, =1 {# min} other {# mins}} estimated time to complete',
+    },
     submitButton: {
       loadingText: 'Submitting',
       visuallyHidden: 'End of form.',
@@ -32,6 +37,7 @@ export const enSG: PublicForm = {
       submitNow: 'Submit now',
     },
     table,
+    fields,
     feedbackBlock: {
       title: {
         payment: 'How was your experience making payment on this form?',
@@ -44,5 +50,8 @@ export const enSG: PublicForm = {
       commentPlaceholder: 'Tell us more about your experience',
       submitButton: 'Submit feedback',
     },
+    instructions: {
+      title: 'Instructions',
+    },
   },
 }
diff --git a/frontend/src/i18n/locales/features/public-form/fields/en-sg.ts b/frontend/src/i18n/locales/features/public-form/fields/en-sg.ts
new file mode 100644
index 0000000000..a3de15481b
--- /dev/null
+++ b/frontend/src/i18n/locales/features/public-form/fields/en-sg.ts
@@ -0,0 +1,60 @@
+import { Fields } from '.'
+
+export const enSG: Fields = {
+  yesNo: {
+    yes: 'Yes',
+    no: 'No',
+  },
+  option: {
+    others: 'Others',
+  },
+  dropdown: {
+    placeholder: 'Select an option',
+    nothingFound: 'No matching results',
+  },
+  attachment: {
+    fileUploaderLink: 'Choose file',
+    dragAndDrop: ' or drag and drop here',
+    dragActive: 'Drop the file here',
+    maxFileSize: 'Maximum file size: {readableMaxSize}',
+    ariaLabelRemove: 'Click to remove file',
+    error: {
+      fileEmpty:
+        'You have uploaded an empty file, please upload a valid attachment',
+      fileTooLarge:
+        'You have exceeded the limit, please upload a file below {readableMaxSize}',
+      fileInvalidType:
+        "Your file's extension ending in *{fileExt} is not allowed",
+      tooManyFiles: 'You can only upload a single file in this input',
+      zipFileInvalidType:
+        'The following file extensions in your zip file are not valid: {stringOfInvalidExtensions}',
+      zipParsing: 'An error has occurred whilst parsing your zip file',
+    },
+  },
+  email: {
+    validation: {
+      domainDisallowed:
+        'The entered email does not belong to an allowed email domain',
+    },
+  },
+  verification: {
+    button: {
+      label: {
+        verify: 'Verify',
+        verified: 'Verified',
+      },
+    },
+    modal: {
+      email: {
+        title: 'Verify your email',
+        description:
+          'An email with a 6-digit verification code was sent to you. It will be valid for 30 minutes.',
+      },
+      mobile: {
+        title: 'Verify your mobile number',
+        description:
+          'An SMS with a 6-digit verification code was sent to you. It will be valid for 30 minutes.',
+      },
+    },
+  },
+}
diff --git a/frontend/src/i18n/locales/features/public-form/fields/index.ts b/frontend/src/i18n/locales/features/public-form/fields/index.ts
new file mode 100644
index 0000000000..a2a16ce796
--- /dev/null
+++ b/frontend/src/i18n/locales/features/public-form/fields/index.ts
@@ -0,0 +1,56 @@
+export interface Fields {
+  yesNo: {
+    yes: string
+    no: string
+  }
+  option: {
+    others: string
+  }
+  dropdown: {
+    placeholder: string
+    nothingFound: string
+  }
+  email: {
+    validation: {
+      domainDisallowed: string
+    }
+  }
+  attachment: {
+    fileUploaderLink: string
+    dragAndDrop: string
+    dragActive: string
+    maxFileSize: string
+    ariaLabelRemove: string
+    error: {
+      fileEmpty: string
+      fileTooLarge: string
+      fileInvalidType: string
+      tooManyFiles: string
+      zipFileInvalidType: string
+      zipParsing: string
+    }
+  }
+  verification: {
+    button: {
+      label: {
+        verify: string
+        verified: string
+      }
+    }
+    modal: {
+      email: {
+        title: string
+        description: string
+      }
+      mobile: {
+        title: string
+        description: string
+      }
+    }
+  }
+}
+
+export * from './en-sg'
+export * from './ms-sg'
+export * from './ta-sg'
+export * from './zh-sg'
diff --git a/frontend/src/i18n/locales/features/public-form/fields/ms-sg.ts b/frontend/src/i18n/locales/features/public-form/fields/ms-sg.ts
new file mode 100644
index 0000000000..4feace59c8
--- /dev/null
+++ b/frontend/src/i18n/locales/features/public-form/fields/ms-sg.ts
@@ -0,0 +1,46 @@
+import { PartialDeep } from 'type-fest'
+
+import { Fields } from '.'
+
+export const msSG: PartialDeep<Fields> = {
+  yesNo: {
+    yes: 'Ya',
+    no: 'Tidak',
+  },
+  option: {
+    others: 'Lain-lain',
+  },
+  dropdown: {
+    placeholder: 'Pilih satu pilihan',
+    nothingFound: 'Tiada hasil yang sepadan',
+  },
+  attachment: {
+    maxFileSize: 'Saiz fail maksimum: {readableMaxSize}',
+  },
+  email: {
+    validation: {
+      domainDisallowed:
+        'E-mel yang dimasukkan bukan milik domain e-mel yang dibenarkan',
+    },
+  },
+  verification: {
+    button: {
+      label: {
+        verify: 'Sahkan',
+        verified: 'Disahkan',
+      },
+    },
+    modal: {
+      email: {
+        title: 'Sahkan e-mel anda',
+        description:
+          'E-mel dengan kod pengesahan 6 digit telah dihantar kepada anda. Kod itu sah selama 30 minit.',
+      },
+      mobile: {
+        title: 'Sahkan nombor telefon bimbit anda',
+        description:
+          'SMS dengan kod pengesahan 6 digit telah dihantar kepada anda. Kod itu sah selama 30 minit.',
+      },
+    },
+  },
+}
diff --git a/frontend/src/i18n/locales/features/public-form/fields/ta-sg.ts b/frontend/src/i18n/locales/features/public-form/fields/ta-sg.ts
new file mode 100644
index 0000000000..61a2d36983
--- /dev/null
+++ b/frontend/src/i18n/locales/features/public-form/fields/ta-sg.ts
@@ -0,0 +1,46 @@
+import { PartialDeep } from 'type-fest'
+
+import { Fields } from '.'
+
+export const taSG: PartialDeep<Fields> = {
+  yesNo: {
+    yes: 'ஆம்',
+    no: 'இல்லை',
+  },
+  option: {
+    others: 'மற்றவை',
+  },
+  dropdown: {
+    placeholder: 'ஒரு விருப்பத்தை தேர்வு செய்யவும்',
+    nothingFound: 'முடிவுகள் எதுவும் பொருந்தவில்லை',
+  },
+  attachment: {
+    maxFileSize: 'கோப்பின் அதிகபட்ச அளவு: {readableMaxSize}',
+  },
+  email: {
+    validation: {
+      domainDisallowed:
+        'உள்ளிடப்பட்ட மின்னஞ்சல் அனுமதிக்கப்பட்ட மின்னஞ்சலுக்குச் சொந்தமானதல்ல',
+    },
+  },
+  verification: {
+    button: {
+      label: {
+        verify: 'சரிபார்க்கவும்',
+        verified: 'சரிபார்க்கப்பட்டது',
+      },
+    },
+    modal: {
+      email: {
+        title: 'உங்கள் மின்னஞ்சல் முகவரியைச் சரிபார்க்கவும்',
+        description:
+          '6 இலக்க சரிபார்ப்புக் குறியீடு கொண்ட மின்னஞ்சல் உங்களுக்கு அனுப்பப்பட்டுள்ளது. 30 நிமிடங்களுக்கு இது செல்லுபடியாகும்.',
+      },
+      mobile: {
+        title: 'உங்கள் மொபைல் எண்ணைச் சரிபார்க்கவும்',
+        description:
+          '6 இலக்க சரிபார்ப்புக் குறியீடு கொண்ட எஸ்எம்எஸ் உங்களுக்கு அனுப்பப்பட்டுள்ளது. 30 நிமிடங்களுக்கு இது செல்லுபடியாகும்.',
+      },
+    },
+  },
+}
diff --git a/frontend/src/i18n/locales/features/public-form/fields/zh-sg.ts b/frontend/src/i18n/locales/features/public-form/fields/zh-sg.ts
new file mode 100644
index 0000000000..2817c80298
--- /dev/null
+++ b/frontend/src/i18n/locales/features/public-form/fields/zh-sg.ts
@@ -0,0 +1,43 @@
+import { PartialDeep } from 'type-fest'
+
+import { Fields } from '.'
+
+export const zhSG: PartialDeep<Fields> = {
+  yesNo: {
+    yes: '是',
+    no: '否',
+  },
+  option: {
+    others: '其他',
+  },
+  dropdown: {
+    placeholder: '请选择一个选项',
+    nothingFound: '没有匹配结果',
+  },
+  attachment: {
+    maxFileSize: '文件限制：不超过 {readableMaxSize}',
+  },
+  email: {
+    validation: {
+      domainDisallowed: '输入的电子邮箱不在允许域名之列',
+    },
+  },
+  verification: {
+    button: {
+      label: {
+        verify: '验证',
+        verified: '已验证',
+      },
+    },
+    modal: {
+      email: {
+        title: '验证您的电子邮箱',
+        description: '已通过电邮发送6位数的验证码，30分钟内有效。',
+      },
+      mobile: {
+        title: '验证您的手机号码',
+        description: '已通过短信发送6 位数的验证码，30分钟内有效。',
+      },
+    },
+  },
+}
diff --git a/frontend/src/i18n/locales/features/public-form/index.ts b/frontend/src/i18n/locales/features/public-form/index.ts
index d91bdb53a0..234f9d6772 100644
--- a/frontend/src/i18n/locales/features/public-form/index.ts
+++ b/frontend/src/i18n/locales/features/public-form/index.ts
@@ -1,3 +1,4 @@
+import { Fields } from './fields'
 import { Table } from './table'
 
 export * from './en-sg'
@@ -19,6 +20,9 @@ export interface PublicForm {
     verifiedFieldExpired: string
   }
   components: {
+    header: {
+      estTime: string
+    }
     submitButton: {
       loadingText: string
       visuallyHidden: string
@@ -27,6 +31,7 @@ export interface PublicForm {
       submitNow: string
     }
     table: Table
+    fields: Fields
     feedbackBlock: {
       title: {
         payment: string
@@ -39,5 +44,12 @@ export interface PublicForm {
       commentPlaceholder: string
       submitButton: string
     }
+    instructions: {
+      title: string
+    }
   }
 }
+
+export * from './ms-sg'
+export * from './ta-sg'
+export * from './zh-sg'
diff --git a/frontend/src/i18n/locales/features/public-form/ms-sg.ts b/frontend/src/i18n/locales/features/public-form/ms-sg.ts
new file mode 100644
index 0000000000..10e79e8960
--- /dev/null
+++ b/frontend/src/i18n/locales/features/public-form/ms-sg.ts
@@ -0,0 +1,19 @@
+import { msSG as fields } from './fields'
+import { msSG as table } from './table'
+
+export const msSG = {
+  components: {
+    header: {
+      estTime: 'Anggaran masa {estTime} min untuk selesai',
+    },
+    fields,
+    table,
+    instructions: {
+      title: 'Arahan',
+    },
+    submitButton: {
+      preventSubmission: 'Penyerahan dinyahdayakan',
+      submitNow: 'Serah sekarang',
+    },
+  },
+}
diff --git a/frontend/src/i18n/locales/features/public-form/ta-sg.ts b/frontend/src/i18n/locales/features/public-form/ta-sg.ts
new file mode 100644
index 0000000000..29ee5d1fb6
--- /dev/null
+++ b/frontend/src/i18n/locales/features/public-form/ta-sg.ts
@@ -0,0 +1,20 @@
+import { taSG as fields } from './fields'
+import { taSG as table } from './table'
+
+export const taSG = {
+  components: {
+    header: {
+      estTime:
+        'இந்த படிவத்தை முடிக்க கணக்கிடப்பட்ட நேரம் {estTime} நிமிடங்கள் ஆகும்',
+    },
+    fields,
+    table,
+    instructions: {
+      title: 'வழிமுறைகள்',
+    },
+    submitButton: {
+      preventSubmission: 'சமர்பித்தல் முடக்கப்பட்டது',
+      submitNow: 'இப்போது சமர்ப்பிக்கவும்',
+    },
+  },
+}
diff --git a/frontend/src/i18n/locales/features/public-form/table/index.ts b/frontend/src/i18n/locales/features/public-form/table/index.ts
index b5be5d0e9d..2c965f59fb 100644
--- a/frontend/src/i18n/locales/features/public-form/table/index.ts
+++ b/frontend/src/i18n/locales/features/public-form/table/index.ts
@@ -7,3 +7,7 @@ export interface Table {
   row: string
   rowMax: string
 }
+
+export * from './ms-sg'
+export * from './ta-sg'
+export * from './zh-sg'
diff --git a/frontend/src/i18n/locales/features/public-form/table/ms-sg.ts b/frontend/src/i18n/locales/features/public-form/table/ms-sg.ts
new file mode 100644
index 0000000000..d7f0a35a80
--- /dev/null
+++ b/frontend/src/i18n/locales/features/public-form/table/ms-sg.ts
@@ -0,0 +1,7 @@
+import { Table } from '.'
+
+export const msSG: Partial<Table> = {
+  addAnotherRow: 'Tambah satu lagi baris',
+  row: '{count} baris',
+  rowMax: '{currentRows} daripada maksimum {count} baris',
+}
diff --git a/frontend/src/i18n/locales/features/public-form/table/ta-sg.ts b/frontend/src/i18n/locales/features/public-form/table/ta-sg.ts
new file mode 100644
index 0000000000..067e12c199
--- /dev/null
+++ b/frontend/src/i18n/locales/features/public-form/table/ta-sg.ts
@@ -0,0 +1,7 @@
+import { Table } from '.'
+
+export const taSG: Partial<Table> = {
+  addAnotherRow: 'மற்றொரு வரிசையைச் சேர்க்கவும்',
+  row: 'வரிசைகளுக்கு {count}',
+  rowMax: 'அதிகபட்சம் {currentRows} வரிசைகளுக்கு {count}',
+}
diff --git a/frontend/src/i18n/locales/features/public-form/table/zh-sg.ts b/frontend/src/i18n/locales/features/public-form/table/zh-sg.ts
new file mode 100644
index 0000000000..2339f399b2
--- /dev/null
+++ b/frontend/src/i18n/locales/features/public-form/table/zh-sg.ts
@@ -0,0 +1,7 @@
+import { Table } from '.'
+
+export const zhSG: Partial<Table> = {
+  addAnotherRow: '添加另一行',
+  row: '{count} 行',
+  rowMax: '{currentRows} 行，最多 {count} 行',
+}
diff --git a/frontend/src/i18n/locales/features/public-form/zh-sg.ts b/frontend/src/i18n/locales/features/public-form/zh-sg.ts
new file mode 100644
index 0000000000..b26528b6c1
--- /dev/null
+++ b/frontend/src/i18n/locales/features/public-form/zh-sg.ts
@@ -0,0 +1,19 @@
+import { zhSG as fields } from './fields'
+import { zhSG as table } from './table'
+
+export const zhSG = {
+  components: {
+    header: {
+      estTime: '预计需要{estTime}分钟完成',
+    },
+    fields,
+    table,
+    instructions: {
+      title: '说明',
+    },
+    submitButton: {
+      preventSubmission: '已禁用提交',
+      submitNow: '立即提交',
+    },
+  },
+}
diff --git a/frontend/src/i18n/locales/index.ts b/frontend/src/i18n/locales/index.ts
index d075f0d6a6..0bd6e3587b 100644
--- a/frontend/src/i18n/locales/index.ts
+++ b/frontend/src/i18n/locales/index.ts
@@ -1,9 +1,15 @@
 import { ResourceLanguage } from 'i18next'
 
+import { Language } from '~shared/types'
+
 import { enSG } from './en-sg'
+import { msSG } from './ms-sg'
+import { taSG } from './ta-sg'
 import { zhSG } from './zh-sg'
 
 export const locales = {
-  'en-SG': enSG as unknown as ResourceLanguage,
-  'zh-SG': zhSG as unknown as ResourceLanguage,
+  [Language.ENGLISH]: enSG as unknown as ResourceLanguage,
+  [Language.CHINESE]: zhSG as unknown as ResourceLanguage,
+  [Language.MALAY]: msSG as unknown as ResourceLanguage,
+  [Language.TAMIL]: taSG as unknown as ResourceLanguage,
 }
diff --git a/frontend/src/i18n/locales/ms-sg.ts b/frontend/src/i18n/locales/ms-sg.ts
new file mode 100644
index 0000000000..9e5fe2733b
--- /dev/null
+++ b/frontend/src/i18n/locales/ms-sg.ts
@@ -0,0 +1,12 @@
+import { PartialDeep } from 'type-fest'
+
+import { msSG as publicForm } from './features/public-form'
+import Translation from './types'
+
+export const msSG: PartialDeep<Translation> = {
+  translation: {
+    features: {
+      publicForm,
+    },
+  },
+}
diff --git a/frontend/src/i18n/locales/ta-sg.ts b/frontend/src/i18n/locales/ta-sg.ts
new file mode 100644
index 0000000000..a41bf553cb
--- /dev/null
+++ b/frontend/src/i18n/locales/ta-sg.ts
@@ -0,0 +1,12 @@
+import { PartialDeep } from 'type-fest'
+
+import { taSG as publicForm } from './features/public-form'
+import Translation from './types'
+
+export const taSG: PartialDeep<Translation> = {
+  translation: {
+    features: {
+      publicForm,
+    },
+  },
+}
diff --git a/frontend/src/i18n/locales/types.ts b/frontend/src/i18n/locales/types.ts
index b103118ef7..63ce5b3b0d 100644
--- a/frontend/src/i18n/locales/types.ts
+++ b/frontend/src/i18n/locales/types.ts
@@ -1,4 +1,4 @@
-import { DeepRequired } from 'ts-essentials'
+import { RequiredDeep } from 'type-fest'
 
 import {
   Common,
@@ -40,7 +40,7 @@ interface Translation {
 
 export interface FallbackTranslation extends Translation {
   translation: {
-    features: DeepRequired<Translation['translation']['features']>
+    features: RequiredDeep<Translation['translation']['features']>
   }
 }
 
diff --git a/frontend/src/i18n/locales/zh-sg.ts b/frontend/src/i18n/locales/zh-sg.ts
index 8c8c5708ee..ae59977219 100644
--- a/frontend/src/i18n/locales/zh-sg.ts
+++ b/frontend/src/i18n/locales/zh-sg.ts
@@ -1,11 +1,13 @@
 import { PartialDeep } from 'type-fest'
 
 import { zhSG as login } from './features/login'
+import { zhSG as publicForm } from './features/public-form'
 import Translation from './types'
 
 export const zhSG: PartialDeep<Translation> = {
   translation: {
     features: {
+      publicForm,
       login,
     },
   },
diff --git a/frontend/src/templates/Field/Checkbox/CheckboxField.tsx b/frontend/src/templates/Field/Checkbox/CheckboxField.tsx
index e101392b20..3dedd512c2 100644
--- a/frontend/src/templates/Field/Checkbox/CheckboxField.tsx
+++ b/frontend/src/templates/Field/Checkbox/CheckboxField.tsx
@@ -1,5 +1,6 @@
 import { forwardRef, useMemo } from 'react'
 import { Controller, get, useFormContext, useFormState } from 'react-hook-form'
+import { useTranslation } from 'react-i18next'
 import {
   Box,
   CheckboxGroup as ChakraCheckboxGroup,
@@ -8,10 +9,11 @@ import {
   useMultiStyleConfig,
 } from '@chakra-ui/react'
 
-import { FormColorTheme } from '~shared/types'
+import { FormColorTheme, Language } from '~shared/types'
 
 import { CHECKBOX_THEME_KEY } from '~theme/components/Checkbox'
 import { createCheckboxValidationRules } from '~utils/fieldValidation'
+import { getFieldOptionsInSelectedLanguage } from '~utils/multiLanguage'
 import Checkbox from '~components/Checkbox'
 import { CheckboxProps } from '~components/Checkbox/Checkbox'
 import FormErrorMessage from '~components/FormControl/FormErrorMessage'
@@ -37,6 +39,7 @@ export const CheckboxField = ({
   disableRequiredValidation,
   colorTheme = FormColorTheme.Blue,
 }: CheckboxFieldProps): JSX.Element => {
+  const { i18n } = useTranslation()
   const fieldColorScheme = useMemo(
     () => `theme-${colorTheme}` as const,
     [colorTheme],
@@ -59,11 +62,20 @@ export const CheckboxField = ({
     [disableRequiredValidation, schema],
   )
 
+  const englishCheckboxOptions = schema.fieldOptions
+  const selectedLanguage = i18n.language as Language
+
   const { register, getValues, control } = useFormContext<CheckboxFieldInputs>()
   const { isValid, isSubmitting, errors } = useFormState<CheckboxFieldInputs>({
     name: schema._id,
   })
 
+  const fieldOptions = getFieldOptionsInSelectedLanguage({
+    defaultValue: englishCheckboxOptions,
+    translations: schema.fieldOptionsTranslations,
+    selectedLanguage,
+  })
+
   const othersValidationRules = useMemo(
     () => ({
       validate: (value?: string) => {
@@ -89,19 +101,23 @@ export const CheckboxField = ({
           rules={validationRules}
           render={({ field: { ref, ...field } }) => (
             <CheckboxGroup {...field}>
-              {schema.fieldOptions.map((o, idx) => (
+              {fieldOptions.map((o, idx) => (
                 <Checkbox
                   name={checkboxInputName}
                   colorScheme={fieldColorScheme}
                   key={idx}
-                  value={o}
+                  // Value will always be the default english field option
+                  // so that upon form submission, the selected value submitted
+                  // and collected will always be the english field option regardless
+                  // of the language of the form.
+                  value={englishCheckboxOptions[idx]}
                   aria-label={o}
                   {...(idx === 0 ? { ref } : {})}
                 >
                   {o}
                 </Checkbox>
               ))}
-              {schema.fieldOptions.length === 1 ? (
+              {fieldOptions.length === 1 ? (
                 // React-hook-form quirk where the value will not be set in an array if there is only a single checkbox option.
                 // This is a workaround to set the value in an array by registering a hidden checkbox with the same id.
                 // See https://github.com/react-hook-form/react-hook-form/issues/7834#issuecomment-1040735711.
diff --git a/frontend/src/templates/Field/Dropdown/DropdownField.tsx b/frontend/src/templates/Field/Dropdown/DropdownField.tsx
index d542eb1b29..54eff5dbd4 100644
--- a/frontend/src/templates/Field/Dropdown/DropdownField.tsx
+++ b/frontend/src/templates/Field/Dropdown/DropdownField.tsx
@@ -1,10 +1,12 @@
 import { useMemo } from 'react'
 import { Controller, useFormContext } from 'react-hook-form'
+import { useTranslation } from 'react-i18next'
 
-import { FormColorTheme } from '~shared/types'
+import { FormColorTheme, Language } from '~shared/types'
 
 import { createDropdownValidationRules } from '~utils/fieldValidation'
 import { SingleSelect } from '~components/Dropdown/SingleSelect'
+import { ComboboxItem } from '~components/Dropdown/types'
 
 import { BaseFieldProps, FieldContainer } from '../FieldContainer'
 import { DropdownFieldSchema, SingleAnswerFieldInput } from '../types'
@@ -23,12 +25,50 @@ export const DropdownField = ({
   colorTheme = FormColorTheme.Blue,
   ...fieldContainerProps
 }: DropdownFieldProps): JSX.Element => {
+  const { i18n } = useTranslation()
   const rules = useMemo(() => {
     return createDropdownValidationRules(schema, disableRequiredValidation)
   }, [schema, disableRequiredValidation])
 
   const { control } = useFormContext<SingleAnswerFieldInput>()
 
+  const selectedLanguage = i18n.language as Language
+
+  // This has to be done because of how the SingleSelect function
+  // extracts the value attribute from the fieldOption to set
+  // as the selected option which will then be used to validate
+  // against the schema fieldOptions which are the defaultFieldOptions.
+  const fieldOptions: ComboboxItem[] = useMemo(() => {
+    const englishFieldOptions = schema.fieldOptions
+    const fieldOptionsTranslations = schema?.fieldOptionsTranslations ?? []
+
+    const translationIdx = fieldOptionsTranslations.findIndex((translation) => {
+      return translation.language === selectedLanguage
+    })
+
+    if (
+      translationIdx !== -1 &&
+      fieldOptionsTranslations[translationIdx].translation.length ===
+        englishFieldOptions.length
+    ) {
+      const translatedFieldOptions =
+        fieldOptionsTranslations[translationIdx].translation
+
+      return translatedFieldOptions.map((translatedFieldOption, index) => {
+        return {
+          value: englishFieldOptions[index],
+          label: translatedFieldOption,
+        }
+      })
+    } else {
+      return schema.fieldOptions.map((fieldOption) => {
+        return {
+          value: fieldOption,
+        }
+      })
+    }
+  }, [schema.fieldOptions, schema?.fieldOptionsTranslations, selectedLanguage])
+
   return (
     <FieldContainer schema={schema} {...fieldContainerProps}>
       <Controller
@@ -39,7 +79,7 @@ export const DropdownField = ({
         render={({ field }) => (
           <SingleSelect
             colorScheme={`theme-${colorTheme}`}
-            items={schema.fieldOptions}
+            items={fieldOptions}
             {...field}
           />
         )}
diff --git a/frontend/src/templates/Field/Email/EmailField.test.tsx b/frontend/src/templates/Field/Email/EmailField.test.tsx
index fdc54d5b60..2eb1570003 100644
--- a/frontend/src/templates/Field/Email/EmailField.test.tsx
+++ b/frontend/src/templates/Field/Email/EmailField.test.tsx
@@ -2,11 +2,9 @@ import { composeStories } from '@storybook/react'
 import { render, screen } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
 
-import {
-  INVALID_EMAIL_DOMAIN_ERROR,
-  INVALID_EMAIL_ERROR,
-  REQUIRED_ERROR,
-} from '~constants/validation'
+import { enSG } from '~/i18n/locales/features/public-form/fields'
+
+import { INVALID_EMAIL_ERROR, REQUIRED_ERROR } from '~constants/validation'
 
 import * as stories from './EmailField.stories'
 
@@ -147,6 +145,7 @@ describe('email validation', () => {
 
     // Assert
     // Should show error message.
-    expect(screen.getByText(INVALID_EMAIL_DOMAIN_ERROR)).not.toBeNull()
+    const errorMessage = enSG.email.validation.domainDisallowed
+    expect(screen.getByText(errorMessage)).not.toBeNull()
   })
 })
diff --git a/frontend/src/templates/Field/Email/EmailFieldInput.tsx b/frontend/src/templates/Field/Email/EmailFieldInput.tsx
index 0769d4f6ce..5a48a7f51c 100644
--- a/frontend/src/templates/Field/Email/EmailFieldInput.tsx
+++ b/frontend/src/templates/Field/Email/EmailFieldInput.tsx
@@ -4,6 +4,9 @@ import {
   ControllerRenderProps,
   useFormContext,
 } from 'react-hook-form'
+import { useTranslation } from 'react-i18next'
+
+import { Language } from '~shared/types'
 
 import { createEmailValidationRules } from '~utils/fieldValidation'
 import Input, { InputProps } from '~components/Input'
@@ -21,6 +24,7 @@ export interface EmailFieldInputProps {
   ) => (value?: string) => void
   /** Any props to override internal input */
   inputProps?: Partial<InputProps>
+  selectedLanguage?: Language
 }
 
 export const EmailFieldInput = ({
@@ -29,9 +33,19 @@ export const EmailFieldInput = ({
   handleInputChange,
   inputProps = {},
 }: EmailFieldInputProps): JSX.Element => {
+  const { t } = useTranslation()
+  const validationErrorMessages = t(
+    'features.publicForm.components.fields.email.validation',
+    { allowObjects: true },
+  )
   const validationRules = useMemo(
-    () => createEmailValidationRules(schema, disableRequiredValidation),
-    [schema, disableRequiredValidation],
+    () =>
+      createEmailValidationRules(
+        schema,
+        disableRequiredValidation,
+        validationErrorMessages,
+      ),
+    [schema, disableRequiredValidation, validationErrorMessages],
   )
 
   const { control } = useFormContext<VerifiableFieldInput>()
diff --git a/frontend/src/templates/Field/FieldContainer.tsx b/frontend/src/templates/Field/FieldContainer.tsx
index f24bb1ccee..8862fefa59 100644
--- a/frontend/src/templates/Field/FieldContainer.tsx
+++ b/frontend/src/templates/Field/FieldContainer.tsx
@@ -5,11 +5,13 @@
  * provides.
  */
 import { FieldError, useFormState } from 'react-hook-form'
+import { useTranslation } from 'react-i18next'
 import { Box, FormControl, Grid } from '@chakra-ui/react'
 import { get } from 'lodash'
 
-import { FormColorTheme } from '~shared/types/form'
+import { FormColorTheme, Language } from '~shared/types/form'
 
+import { getValueInSelectedLanguage } from '~utils/multiLanguage'
 import Badge from '~components/Badge'
 import FormErrorMessage from '~components/FormControl/FormErrorMessage'
 import FormLabel from '~components/FormControl/FormLabel'
@@ -19,7 +21,14 @@ import { FormFieldWithQuestionNo } from '~features/form/types'
 export type BaseFieldProps = {
   schema: Pick<
     FormFieldWithQuestionNo,
-    '_id' | 'required' | 'description' | 'title' | 'disabled' | 'questionNumber'
+    | '_id'
+    | 'required'
+    | 'description'
+    | 'title'
+    | 'disabled'
+    | 'questionNumber'
+    | 'titleTranslations'
+    | 'descriptionTranslations'
   >
   /**
    * Color theme of form, if available. Defaults to `FormColorTheme.Blue`
@@ -58,9 +67,22 @@ export const FieldContainer = ({
   showMyInfoBadge,
   errorVariant,
 }: FieldContainerProps): JSX.Element => {
+  const { i18n } = useTranslation()
   const { errors, isSubmitting, isValid } = useFormState({ name: schema._id })
 
   const error: FieldError | undefined = get(errors, errorKey ?? schema._id)
+  const selectedLanguage = i18n.language as Language
+
+  const title = getValueInSelectedLanguage({
+    defaultValue: schema.title,
+    translations: schema.titleTranslations,
+    selectedLanguage,
+  })
+  const description = getValueInSelectedLanguage({
+    defaultValue: schema.description,
+    translations: schema.descriptionTranslations,
+    selectedLanguage,
+  })
 
   return (
     <FormControl
@@ -80,9 +102,9 @@ export const FieldContainer = ({
           questionNumber={
             schema.questionNumber ? `${schema.questionNumber}.` : undefined
           }
-          description={schema.description}
+          description={description}
         >
-          {schema.title}
+          {title}
         </FormLabel>
         {showMyInfoBadge && (
           <Box gridArea="myinfobadge">
diff --git a/frontend/src/templates/Field/Image/ImageField.tsx b/frontend/src/templates/Field/Image/ImageField.tsx
index 254f87cfd2..4249945f9b 100644
--- a/frontend/src/templates/Field/Image/ImageField.tsx
+++ b/frontend/src/templates/Field/Image/ImageField.tsx
@@ -1,7 +1,11 @@
 import { useEffect, useMemo, useState } from 'react'
+import { useTranslation } from 'react-i18next'
 import { Box, Image, Skeleton, useBreakpointValue } from '@chakra-ui/react'
 
+import { Language } from '~shared/types'
+
 import { useMdComponents } from '~hooks/useMdComponents'
+import { getValueInSelectedLanguage } from '~utils/multiLanguage'
 import { MarkdownText } from '~components/MarkdownText'
 
 import { BaseFieldProps } from '../FieldContainer'
@@ -17,6 +21,7 @@ export interface ImageFieldProps extends BaseFieldProps {
  * @precondition Must have a parent `react-hook-form#FormProvider` component.
  */
 export const ImageField = ({ schema }: ImageFieldProps): JSX.Element => {
+  const { i18n } = useTranslation()
   const [fallbackType, setFallbackType] = useState<'loading' | 'error'>(
     'loading',
   )
@@ -51,18 +56,24 @@ export const ImageField = ({ schema }: ImageFieldProps): JSX.Element => {
     return <Skeleton height="10rem" />
   }, [fallbackType, schema.url])
 
+  const description = getValueInSelectedLanguage({
+    defaultValue: schema.description,
+    translations: schema.descriptionTranslations ?? [],
+    selectedLanguage: i18n.language as Language,
+  })
+
   return (
     <Box>
       <Image
         src={schema.url}
-        alt={schema.description}
+        alt={description}
         fallback={fallback}
         onError={() => setFallbackType('error')}
       />
-      {schema.description ? (
+      {description ? (
         <Box mt={{ base: '0.5rem', md: '1rem' }}>
           <MarkdownText multilineBreaks components={mdComponents}>
-            {schema.description}
+            {description}
           </MarkdownText>
         </Box>
       ) : null}
diff --git a/frontend/src/templates/Field/Paragraph/ParagraphField.tsx b/frontend/src/templates/Field/Paragraph/ParagraphField.tsx
index 6ad48faba5..8d2b3af65d 100644
--- a/frontend/src/templates/Field/Paragraph/ParagraphField.tsx
+++ b/frontend/src/templates/Field/Paragraph/ParagraphField.tsx
@@ -1,4 +1,9 @@
+import { useTranslation } from 'react-i18next'
+
+import { Language } from '~shared/types'
+
 import { useMdComponents } from '~hooks/useMdComponents'
+import { getValueInSelectedLanguage } from '~utils/multiLanguage'
 import { MarkdownText } from '~components/MarkdownText'
 
 import { BaseFieldProps } from '../FieldContainer'
@@ -15,6 +20,7 @@ export interface ParagraphFieldProps extends BaseFieldProps {
 export const ParagraphField = ({
   schema,
 }: ParagraphFieldProps): JSX.Element => {
+  const { i18n } = useTranslation()
   const mdComponents = useMdComponents({
     styles: {
       text: {
@@ -24,9 +30,15 @@ export const ParagraphField = ({
     },
   })
 
+  const description = getValueInSelectedLanguage({
+    defaultValue: schema.description,
+    translations: schema.descriptionTranslations ?? [],
+    selectedLanguage: i18n.language as Language,
+  })
+
   return (
     <MarkdownText multilineBreaks components={mdComponents}>
-      {schema.description}
+      {description}
     </MarkdownText>
   )
 }
diff --git a/frontend/src/templates/Field/Radio/RadioField.tsx b/frontend/src/templates/Field/Radio/RadioField.tsx
index 73a0c17c24..bd2ee6ab2a 100644
--- a/frontend/src/templates/Field/Radio/RadioField.tsx
+++ b/frontend/src/templates/Field/Radio/RadioField.tsx
@@ -1,12 +1,14 @@
 import { useMemo } from 'react'
 import { Controller, useFormContext, useFormState } from 'react-hook-form'
+import { useTranslation } from 'react-i18next'
 import { FormControl, useMultiStyleConfig } from '@chakra-ui/react'
 import { get } from 'lodash'
 
-import { FormColorTheme } from '~shared/types'
+import { FormColorTheme, Language } from '~shared/types'
 
 import { RADIO_THEME_KEY } from '~theme/components/Radio'
 import { createRadioValidationRules } from '~utils/fieldValidation'
+import { getFieldOptionsInSelectedLanguage } from '~utils/multiLanguage'
 import FormErrorMessage from '~components/FormControl/FormErrorMessage'
 import Radio, { OthersInput } from '~components/Radio'
 
@@ -28,6 +30,7 @@ export const RadioField = ({
   disableRequiredValidation,
   colorTheme = FormColorTheme.Blue,
 }: RadioFieldProps): JSX.Element => {
+  const { i18n } = useTranslation()
   const fieldColorScheme = useMemo(
     () => `theme-${colorTheme}` as const,
     [colorTheme],
@@ -50,6 +53,8 @@ export const RadioField = ({
     [disableRequiredValidation, schema],
   )
 
+  const englishRadioOptions = schema.fieldOptions
+
   const { register, getValues, trigger } = useFormContext<RadioFieldInputs>()
   const { isValid, isSubmitting, errors } = useFormState<RadioFieldInputs>({
     name: schema._id,
@@ -69,6 +74,12 @@ export const RadioField = ({
     [getValues, radioInputName, schema.othersRadioButton],
   )
 
+  const fieldOptions = getFieldOptionsInSelectedLanguage({
+    defaultValue: englishRadioOptions,
+    translations: schema.fieldOptionsTranslations,
+    selectedLanguage: i18n.language as Language,
+  })
+
   return (
     <FieldContainer schema={schema} errorKey={radioInputName}>
       <Controller
@@ -93,10 +104,14 @@ export const RadioField = ({
             }
             aria-required={schema.required}
           >
-            {schema.fieldOptions.map((option, idx) => (
+            {fieldOptions.map((option, idx) => (
               <Radio
                 key={idx}
-                value={option}
+                // Value will always be the default english field option
+                // so that upon form submission, the selected value submitted
+                // and collected will always be the english field option regardless
+                // of the language of the form.
+                value={englishRadioOptions[idx]}
                 {...(idx === 0 ? { ref } : {})}
                 // Required should apply to radio group rather than individual radio.
                 isRequired={false}
diff --git a/frontend/src/templates/Field/Section/SectionField.tsx b/frontend/src/templates/Field/Section/SectionField.tsx
index cdef8605d7..51099238ca 100644
--- a/frontend/src/templates/Field/Section/SectionField.tsx
+++ b/frontend/src/templates/Field/Section/SectionField.tsx
@@ -1,8 +1,10 @@
+import { useTranslation } from 'react-i18next'
 import { Box, forwardRef } from '@chakra-ui/react'
 
-import { FormColorTheme } from '~shared/types'
+import { FormColorTheme, Language } from '~shared/types'
 
 import { useMdComponents } from '~hooks/useMdComponents'
+import { getValueInSelectedLanguage } from '~utils/multiLanguage'
 import { MarkdownText } from '~components/MarkdownText'
 
 import { SectionFieldContainerProps } from './SectionFieldContainer'
@@ -29,6 +31,7 @@ export const BaseSectionField = forwardRef<
   Pick<SectionFieldProps, 'schema' | 'colorTheme'>,
   'div'
 >(({ schema, colorTheme = FormColorTheme.Blue, ...rest }, ref) => {
+  const { i18n } = useTranslation()
   const sectionColor = useSectionColor(colorTheme)
   const mdComponents = useMdComponents({
     styles: {
@@ -39,6 +42,20 @@ export const BaseSectionField = forwardRef<
     },
   })
 
+  const selectedLanguage = i18n.language as Language
+
+  const title = getValueInSelectedLanguage({
+    defaultValue: schema.title,
+    translations: schema.titleTranslations,
+    selectedLanguage,
+  })
+
+  const description = getValueInSelectedLanguage({
+    defaultValue: schema.description,
+    translations: schema.descriptionTranslations,
+    selectedLanguage,
+  })
+
   return (
     // id given so app can scrolled to this section.
     <Box
@@ -50,12 +67,12 @@ export const BaseSectionField = forwardRef<
       {...rest}
     >
       <Box as="h2" textStyle="h2" color={sectionColor}>
-        {schema.title}
+        {title}
       </Box>
-      {schema.description && (
+      {description && (
         <Box mt="1rem">
           <MarkdownText multilineBreaks components={mdComponents}>
-            {schema.description}
+            {description}
           </MarkdownText>
         </Box>
       )}
diff --git a/frontend/src/templates/Field/Table/ColumnCell.tsx b/frontend/src/templates/Field/Table/ColumnCell.tsx
index 91f81d346e..d328e9e17e 100644
--- a/frontend/src/templates/Field/Table/ColumnCell.tsx
+++ b/frontend/src/templates/Field/Table/ColumnCell.tsx
@@ -1,10 +1,11 @@
 import { useMemo } from 'react'
 import { Controller, useFormContext, useFormState } from 'react-hook-form'
+import { useTranslation } from 'react-i18next'
 import { UseTableCellProps } from 'react-table'
 import { FormControl, VisuallyHidden } from '@chakra-ui/react'
 import { get } from 'lodash'
 
-import { FormColorTheme } from '~shared/types'
+import { FormColorTheme, Language } from '~shared/types'
 import {
   BasicField,
   Column,
@@ -20,6 +21,7 @@ import {
   createDropdownValidationRules,
 } from '~utils/fieldValidation'
 import { SingleSelect } from '~components/Dropdown'
+import { ComboboxItem } from '~components/Dropdown/types'
 import FormErrorMessage from '~components/FormControl/FormErrorMessage'
 import FormLabel from '~components/FormControl/FormLabel'
 import Input from '~components/Input'
@@ -82,12 +84,49 @@ const DropdownColumnCell = ({
   inputName,
   colorTheme,
 }: FieldColumnCellProps<DropdownColumnBase>) => {
+  const { i18n } = useTranslation()
   const { control } = useFormContext<TableFieldInputs>()
   const rules = useMemo(
     () => createDropdownValidationRules(schema, disableRequiredValidation),
     [schema, disableRequiredValidation],
   )
 
+  const selectedLanguage = i18n.language as Language
+
+  // This has to be done because of how the SingleSelect function
+  // extracts the value attribute from the fieldOption to set
+  // as the selected option which will then be used to validate
+  // against the schema fieldOptions which are the defaultFieldOptions.
+  const fieldOptions: ComboboxItem[] = useMemo(() => {
+    const defaultEnglishFieldOptions = schema.fieldOptions ?? []
+    const fieldOptionsTranslations = schema?.fieldOptionsTranslations ?? []
+    const translationIdx = fieldOptionsTranslations.findIndex(
+      (translation) => translation.language === selectedLanguage,
+    )
+
+    if (
+      translationIdx !== -1 &&
+      fieldOptionsTranslations[translationIdx].translation.length ===
+        defaultEnglishFieldOptions.length
+    ) {
+      const translatedFieldOptions =
+        fieldOptionsTranslations[translationIdx].translation
+
+      return translatedFieldOptions.map((translatedFieldOption, index) => {
+        return {
+          value: defaultEnglishFieldOptions[index],
+          label: translatedFieldOption,
+        }
+      })
+    } else {
+      return defaultEnglishFieldOptions.map((fieldOption) => {
+        return {
+          value: fieldOption,
+        }
+      })
+    }
+  }, [schema.fieldOptions, schema?.fieldOptionsTranslations, selectedLanguage])
+
   return (
     <Controller
       control={control}
@@ -99,7 +138,7 @@ const DropdownColumnCell = ({
           isDisabled={isDisabled}
           colorScheme={`theme-${colorTheme}`}
           // Possibility of fieldOptions being undefined during table field creation.
-          items={schema.fieldOptions ?? []}
+          items={fieldOptions ?? []}
           {...field}
         />
       )}
diff --git a/frontend/src/templates/Field/Table/TableField.tsx b/frontend/src/templates/Field/Table/TableField.tsx
index d58693957b..f3a99f7acf 100644
--- a/frontend/src/templates/Field/Table/TableField.tsx
+++ b/frontend/src/templates/Field/Table/TableField.tsx
@@ -1,5 +1,6 @@
 import { useCallback, useEffect, useMemo } from 'react'
 import { useFieldArray, useFormContext, useFormState } from 'react-hook-form'
+import { useTranslation } from 'react-i18next'
 import { BiTrash } from 'react-icons/bi'
 import { useTable } from 'react-table'
 import {
@@ -15,10 +16,11 @@ import {
 import { get, head, uniq } from 'lodash'
 import simplur from 'simplur'
 
-import { FormColorTheme } from '~shared/types'
+import { FormColorTheme, Language } from '~shared/types'
 
 import { useHasChanged } from '~hooks/useHasChanged'
 import { useIsMobile } from '~hooks/useIsMobile'
+import { getValueInSelectedLanguage } from '~utils/multiLanguage'
 import FormErrorMessage from '~components/FormControl/FormErrorMessage'
 import IconButton from '~components/IconButton'
 
@@ -46,18 +48,29 @@ export const TableField = ({
   disableRequiredValidation,
   colorTheme = FormColorTheme.Blue,
 }: TableFieldProps): JSX.Element => {
+  const { i18n } = useTranslation()
   const hasMinRowsChanged = useHasChanged(schema.minimumRows)
   const isMobile = useIsMobile()
 
+  const selectedLanguage = i18n.language as Language
+
   const columnsData = useMemo(() => {
-    return schema.columns.map((c) => ({
-      Header: (
-        <ColumnHeader title={c.title} isRequired={c.required} id={c._id} />
-      ),
-      accessor: c._id,
-      Cell: ColumnCell,
-    }))
-  }, [schema.columns])
+    return schema.columns.map((c) => {
+      const title = getValueInSelectedLanguage({
+        defaultValue: c.title,
+        translations: c.titleTranslations ?? [],
+        selectedLanguage,
+      })
+
+      return {
+        Header: (
+          <ColumnHeader title={title} isRequired={c.required} id={c._id} />
+        ),
+        accessor: c._id,
+        Cell: ColumnCell,
+      }
+    })
+  }, [schema.columns, selectedLanguage])
 
   const formMethods = useFormContext<TableFieldInputs>()
   const { errors } = useFormState({
@@ -222,6 +235,7 @@ export const TableField = ({
                         disableRequiredValidation,
                         columnSchema: schema.columns[j],
                         colorTheme,
+                        selectedLanguage,
                       })}
                     </Td>
                   ))}
diff --git a/frontend/src/templates/Field/Table/TableFieldContainer.tsx b/frontend/src/templates/Field/Table/TableFieldContainer.tsx
index 9dac2a9096..a3a5aeee46 100644
--- a/frontend/src/templates/Field/Table/TableFieldContainer.tsx
+++ b/frontend/src/templates/Field/Table/TableFieldContainer.tsx
@@ -1,6 +1,10 @@
 import { useFormState } from 'react-hook-form'
+import { useTranslation } from 'react-i18next'
 import { FormControl } from '@chakra-ui/react'
 
+import { Language } from '~shared/types'
+
+import { getValueInSelectedLanguage } from '~utils/multiLanguage'
 import FormLabel from '~components/FormControl/FormLabel'
 
 import { TableFieldSchema } from '../types'
@@ -21,8 +25,23 @@ export const TableFieldContainer = ({
   schema,
   children,
 }: TableFieldContainerProps): JSX.Element => {
+  const { i18n } = useTranslation()
   const { isSubmitting, isValid, errors } = useFormState({ name: schema._id })
 
+  const selectedLanguage = i18n.language as Language
+
+  const title = getValueInSelectedLanguage({
+    defaultValue: schema.title,
+    translations: schema.titleTranslations,
+    selectedLanguage: selectedLanguage,
+  })
+
+  const description = getValueInSelectedLanguage({
+    defaultValue: schema.description,
+    translations: schema.descriptionTranslations,
+    selectedLanguage: selectedLanguage,
+  })
+
   return (
     <FormControl
       id={schema._id}
@@ -35,9 +54,9 @@ export const TableFieldContainer = ({
         questionNumber={
           schema.questionNumber ? `${schema.questionNumber}.` : undefined
         }
-        description={schema.description}
+        description={description}
       >
-        {schema.title}
+        {title}
       </FormLabel>
       {children}
     </FormControl>
diff --git a/frontend/src/utils/fieldValidation.ts b/frontend/src/utils/fieldValidation.ts
index 6e45f3cada..ea825f0f4e 100644
--- a/frontend/src/utils/fieldValidation.ts
+++ b/frontend/src/utils/fieldValidation.ts
@@ -41,10 +41,11 @@ import {
 } from '~shared/utils/phone-num-validation'
 import { isUenValid } from '~shared/utils/uen-validation'
 
+import { Fields } from '~/i18n/locales/features/public-form/fields'
+
 import {
   INVALID_COUNTRY_REGION_OPTION_ERROR,
   INVALID_DROPDOWN_OPTION_ERROR,
-  INVALID_EMAIL_DOMAIN_ERROR,
   INVALID_EMAIL_ERROR,
   REQUIRED_ERROR,
 } from '~constants/validation'
@@ -64,6 +65,8 @@ import {
 } from './date'
 import { formatNumberToLocaleString } from './stringFormat'
 
+type EmailValidationErrorMessages = Fields['email']['validation']
+
 // Omit unused props
 type MinimumFieldValidationProps<T extends FieldBase> = Omit<
   T,
@@ -84,6 +87,7 @@ type ValidationRuleFn<T extends FieldBase = FieldBase> = (
 type ValidationRuleFnEmailAndMobile<T extends FieldBase = FieldBase> = (
   schema: MinimumFieldValidationPropsEmailAndMobile<T>,
   disableRequiredValidation?: boolean,
+  validationErrorMessages?: EmailValidationErrorMessages,
 ) => RegisterOptions
 
 const requiredSingleAnswerValidationFn =
@@ -552,11 +556,17 @@ export const createRadioValidationRules: ValidationRuleFn<RadioFieldBase> = (
 
 export const createEmailValidationRules: ValidationRuleFnEmailAndMobile<
   EmailFieldBase
-> = (schema, disableRequiredValidation): RegisterOptions => {
+> = (
+  schema,
+  disableRequiredValidation,
+  validationErrorMessages,
+): RegisterOptions => {
   return {
     validate: {
       baseValidations: (val?: VerifiableFieldValues) => {
-        return baseEmailValidationFn(schema)(val?.value)
+        return baseEmailValidationFn({ schema, validationErrorMessages })(
+          val?.value,
+        )
       },
       ...createBaseVfnFieldValidationRules(schema, disableRequiredValidation)
         .validate,
@@ -569,7 +579,13 @@ export const createEmailValidationRules: ValidationRuleFnEmailAndMobile<
  * @returns error string if field is invalid, true otherwise.
  */
 export const baseEmailValidationFn =
-  (schema: MinimumFieldValidationProps<EmailFieldBase>) =>
+  ({
+    schema,
+    validationErrorMessages = { domainDisallowed: 'Domain disallowed' },
+  }: {
+    schema: MinimumFieldValidationProps<EmailFieldBase>
+    validationErrorMessages?: EmailValidationErrorMessages
+  }) =>
   (inputValue?: string) => {
     if (!inputValue) return true
 
@@ -583,7 +599,7 @@ export const baseEmailValidationFn =
     if (allowedDomains.size !== 0) {
       const domainInValue = trimmedInputValue.split('@')[1].toLowerCase()
       if (domainInValue && !allowedDomains.has(`@${domainInValue}`)) {
-        return INVALID_EMAIL_DOMAIN_ERROR
+        return validationErrorMessages.domainDisallowed
       }
     }
 
diff --git a/frontend/src/utils/multiLanguage.ts b/frontend/src/utils/multiLanguage.ts
index e455b9b939..167489efd4 100644
--- a/frontend/src/utils/multiLanguage.ts
+++ b/frontend/src/utils/multiLanguage.ts
@@ -1,4 +1,8 @@
-import { Language } from '~shared/types'
+import {
+  Language,
+  TranslationMapping,
+  TranslationOptionMapping,
+} from '~shared/types'
 
 export const convertUnicodeLocaleToLanguage = (language: Language) => {
   switch (language) {
@@ -16,3 +20,64 @@ export const convertUnicodeLocaleToLanguage = (language: Language) => {
 }
 
 export const getDefaultSupportedLanguages = () => Object.values(Language)
+
+interface SelectedLanguageProps {
+  defaultValue: string
+  translations?: TranslationMapping[]
+  selectedLanguage: Language
+}
+
+interface SelectedLanguageFieldOptionProps {
+  defaultValue: string[]
+  translations?: TranslationOptionMapping[]
+  selectedLanguage: Language
+}
+
+export const getValueInSelectedLanguage = ({
+  defaultValue,
+  translations,
+  selectedLanguage,
+}: SelectedLanguageProps) => {
+  let value = defaultValue
+
+  const titleTranslations = translations ?? []
+  // check if there are any title translations for the selected language
+  const titleTranslationIdx = titleTranslations.findIndex(
+    (titleTranslation) => {
+      return titleTranslation.language === selectedLanguage
+    },
+  )
+
+  // If there are title translations for the selected language, use the translation.
+  // If not default it to English.
+  if (titleTranslationIdx !== -1) {
+    value = titleTranslations[titleTranslationIdx].translation
+  }
+
+  return value
+}
+
+export const getFieldOptionsInSelectedLanguage = ({
+  defaultValue,
+  translations = [],
+  selectedLanguage,
+}: SelectedLanguageFieldOptionProps) => {
+  const fieldOptionsTranslations = translations
+
+  const translationIdx = fieldOptionsTranslations.findIndex((translation) => {
+    return translation.language === selectedLanguage
+  })
+
+  // Check if translations for field options exist and whether
+  // each field option has its own respective translation. If not
+  // render the default field options in English.
+  if (
+    translationIdx !== -1 &&
+    fieldOptionsTranslations[translationIdx].translation.length ===
+      defaultValue.length
+  ) {
+    return fieldOptionsTranslations[translationIdx].translation
+  }
+
+  return defaultValue
+}
diff --git a/shared/constants/field/myinfo/index.ts b/shared/constants/field/myinfo/index.ts
index 68139b2cc8..01327019b3 100644
--- a/shared/constants/field/myinfo/index.ts
+++ b/shared/constants/field/myinfo/index.ts
@@ -4,6 +4,7 @@ import {
   MyInfoAttribute,
   MyInfoChildVaxxStatus,
   MyInfoField,
+  TranslationMapping,
 } from '../../../types/field'
 import { myInfoCountries } from './myinfo-countries'
 import { myInfoDialects } from './myinfo-dialects'
@@ -12,6 +13,7 @@ import { myInfoOccupations } from './myinfo-occupations'
 import { myInfoRaces } from './myinfo-races'
 import { myInfoHousingTypes } from './myinfo-housing-types'
 import { myInfoHdbTypes } from './myinfo-hdb-types'
+import { Language } from '../../../types'
 
 export * from './myinfo-countries'
 export * from './myinfo-dialects'
@@ -37,6 +39,7 @@ export type MyInfoFieldBlock = {
   // for MyInfo forms. The running joke is that this is the personal
   // details of Phua Chu Kang, a famous singaporean sitcom.
   previewValue: string
+  titleTranslations?: TranslationMapping[]
 }
 
 export const types: MyInfoFieldBlock[] = [
@@ -50,6 +53,11 @@ export const types: MyInfoFieldBlock[] = [
       'The registered name of the form-filler. This field is verified by ICA for Singaporeans/PRs & foreigners on Long-Term Visit Pass, and by MOM for Employment Pass holders.',
     fieldType: BasicField.ShortText,
     previewValue: 'PHUA CHU KANG',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '姓名' },
+      { language: Language.MALAY, translation: 'Nama' },
+      { language: Language.TAMIL, translation: 'பெயர்' },
+    ],
   },
   {
     name: MyInfoAttribute.Sex,
@@ -62,6 +70,11 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: ['FEMALE', 'MALE', 'UNKNOWN'],
     previewValue: 'MALE',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '性别' },
+      { language: Language.MALAY, translation: 'Jantina' },
+      { language: Language.TAMIL, translation: 'பாலினம்' },
+    ],
   },
   {
     name: MyInfoAttribute.DateOfBirth,
@@ -73,6 +86,11 @@ export const types: MyInfoFieldBlock[] = [
       'The registered date of birth of the form-filler. This field is verified by ICA for Singaporeans/PRs & foreigners on Long-Term Visit Pass, and by MOM for Employment Pass holders.',
     fieldType: BasicField.Date,
     previewValue: '1965-02-23',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '出生日期' },
+      { language: Language.MALAY, translation: 'Tarikh lahir' },
+      { language: Language.TAMIL, translation: 'பிறந்த தேதி' },
+    ],
   },
   {
     name: MyInfoAttribute.Race,
@@ -85,6 +103,11 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: myInfoRaces,
     previewValue: 'CHINESE',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '种族' },
+      { language: Language.MALAY, translation: 'Kaum' },
+      { language: Language.TAMIL, translation: 'இனம்' },
+    ],
   },
   {
     name: MyInfoAttribute.Nationality,
@@ -97,6 +120,11 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: myInfoNationalities,
     previewValue: 'SINGAPORE CITIZEN',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '国籍/公民身份' },
+      { language: Language.MALAY, translation: 'Kerakyatan / Kewarganegaraan' },
+      { language: Language.TAMIL, translation: 'குடியுரிமை' },
+    ],
   },
   {
     name: MyInfoAttribute.BirthCountry,
@@ -109,6 +137,11 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: myInfoCountries,
     previewValue: 'SINGAPORE',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '出生地' },
+      { language: Language.MALAY, translation: 'Negara / Tempat Lahir' },
+      { language: Language.TAMIL, translation: 'நாடு/ பிறந்த இடம்' },
+    ],
   },
   {
     name: MyInfoAttribute.ResidentialStatus,
@@ -120,6 +153,11 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: ['ALIEN', 'CITIZEN', 'NOT APPLICABLE', 'PR', 'UNKNOWN'],
     previewValue: 'CITIZEN',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '最新居留状态' },
+      { language: Language.MALAY, translation: 'Status Kediaman Terkini' },
+      { language: Language.TAMIL, translation: 'சமீபத்திய குடியிருப்பு நிலை' },
+    ],
   },
   {
     name: MyInfoAttribute.Dialect,
@@ -131,6 +169,11 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: myInfoDialects,
     previewValue: 'HOKKIEN',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '方言' },
+      { language: Language.MALAY, translation: 'Dialek' },
+      { language: Language.TAMIL, translation: 'பேச்சுவழக்கு' },
+    ],
   },
   {
     name: MyInfoAttribute.HousingType,
@@ -143,6 +186,11 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: myInfoHousingTypes,
     previewValue: 'DETACHED HOUSE',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '房型' },
+      { language: Language.MALAY, translation: 'Jenis Perumahan' },
+      { language: Language.TAMIL, translation: 'வீட்டு வகை' },
+    ],
   },
   {
     name: MyInfoAttribute.HdbType,
@@ -154,6 +202,11 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: myInfoHdbTypes,
     previewValue: 'EXECUTIVE FLAT (HDB)',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '组屋类型' },
+      { language: Language.MALAY, translation: 'Jenis HDB' },
+      { language: Language.TAMIL, translation: 'வீடமைப்பு வளர்ச்சி கழகம் வகை' },
+    ],
   },
   {
     name: MyInfoAttribute.PassportNumber,
@@ -164,6 +217,11 @@ export const types: MyInfoFieldBlock[] = [
     description: 'The passport number of the form-filler.',
     fieldType: BasicField.ShortText,
     previewValue: 'E1234567X',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '护照号码' },
+      { language: Language.MALAY, translation: 'Nombor Pasport' },
+      { language: Language.TAMIL, translation: 'கடவுச்சீட்டு எண்' },
+    ],
   },
   {
     name: MyInfoAttribute.PassportExpiryDate,
@@ -174,6 +232,11 @@ export const types: MyInfoFieldBlock[] = [
     description: 'The passport expiry date of the form-filler.',
     fieldType: BasicField.Date,
     previewValue: '2022-02-23',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '护照有效日期' },
+      { language: Language.MALAY, translation: 'Tarikh Luput Pasport' },
+      { language: Language.TAMIL, translation: 'கடவுச்சீட்டு காலாவதி தேதி' },
+    ],
   },
   {
     name: MyInfoAttribute.Marital,
@@ -186,6 +249,11 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: ['SINGLE', 'MARRIED', 'WIDOWED', 'DIVORCED'],
     previewValue: 'MARRIED',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '婚姻状况' },
+      { language: Language.MALAY, translation: 'Status Perkahwinan' },
+      { language: Language.TAMIL, translation: 'திருமண நிலை' },
+    ],
   },
   {
     name: MyInfoAttribute.CountryOfMarriage,
@@ -198,6 +266,11 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: myInfoCountries,
     previewValue: 'SINGAPORE',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '婚姻注册地' },
+      { language: Language.MALAY, translation: 'Negara / Tempat Perkahwinan' },
+      { language: Language.TAMIL, translation: 'நாடு/ திருமண இடம்' },
+    ],
   },
   {
     name: MyInfoAttribute.RegisteredAddress,
@@ -208,6 +281,11 @@ export const types: MyInfoFieldBlock[] = [
     description: 'The registered address of the form-filler.',
     fieldType: BasicField.ShortText,
     previewValue: '411 CHUA CHU KANG AVE 3, #12-3, SINGAPORE 238823',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '登记地址' },
+      { language: Language.MALAY, translation: 'Alamat berdaftar' },
+      { language: Language.TAMIL, translation: 'பதிவு செய்யப்பட்ட முகவரி' },
+    ],
   },
   {
     name: MyInfoAttribute.Occupation,
@@ -220,6 +298,11 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: myInfoOccupations,
     previewValue: 'MANAGING DIRECTOR/CHIEF EXECUTIVE OFFICER',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '职业' },
+      { language: Language.MALAY, translation: 'Pekerjaan' },
+      { language: Language.TAMIL, translation: 'தொழில்' },
+    ],
   },
   {
     name: MyInfoAttribute.Employment,
@@ -231,6 +314,11 @@ export const types: MyInfoFieldBlock[] = [
       "The name of the form-filler's employer. Verified for foreigners with Singpass only.",
     fieldType: BasicField.ShortText,
     previewValue: 'PCK PTE LTD',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '雇主名字' },
+      { language: Language.MALAY, translation: 'Nama Majikan' },
+      { language: Language.TAMIL, translation: 'முதலாளியின் பெயர்' },
+    ],
   },
   {
     name: MyInfoAttribute.VehicleNo,
@@ -241,6 +329,11 @@ export const types: MyInfoFieldBlock[] = [
     description: 'The vehicle plate number of the form-filler.',
     fieldType: BasicField.ShortText,
     previewValue: 'SHA1234X',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '车牌' },
+      { language: Language.MALAY, translation: 'Nombor Kenderaan' },
+      { language: Language.TAMIL, translation: 'வாகன எண்' },
+    ],
   },
   {
     name: MyInfoAttribute.MarriageCertNo,
@@ -252,6 +345,11 @@ export const types: MyInfoFieldBlock[] = [
       'The marriage certificate number of the form-filler. This field is treated as unverified, as data provided by MSF may be outdated in cases of marriages in a foreign country.',
     fieldType: BasicField.ShortText,
     previewValue: '123456789012345',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '结婚证号码' },
+      { language: Language.MALAY, translation: 'Nombor Sijil Perkahwinan' },
+      { language: Language.TAMIL, translation: 'திருமண சான்றிதழ் எண்' },
+    ],
   },
   {
     name: MyInfoAttribute.MarriageDate,
@@ -263,6 +361,11 @@ export const types: MyInfoFieldBlock[] = [
       'The date of marriage of the form-filler. This field is treated as unverified, as data provided by MSF may be outdated in cases of marriages in a foreign country.',
     fieldType: BasicField.Date,
     previewValue: '1999-02-02',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '结婚日期' },
+      { language: Language.MALAY, translation: 'Tarikh Perkahwinan' },
+      { language: Language.TAMIL, translation: 'திருமண தேதி' },
+    ],
   },
   {
     name: MyInfoAttribute.DivorceDate,
@@ -274,6 +377,11 @@ export const types: MyInfoFieldBlock[] = [
       'The date of divorce of the form-filler. This field is treated as unverified, as data provided by MSF may be outdated in cases of marriages in a foreign country.',
     fieldType: BasicField.Date,
     previewValue: '2007-01-10',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '离婚日期' },
+      { language: Language.MALAY, translation: 'Tarikh Penceraian' },
+      { language: Language.TAMIL, translation: 'விவாகரத்து தேதி' },
+    ],
   },
   {
     name: MyInfoAttribute.WorkpassStatus,
@@ -285,6 +393,7 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: ['Live', 'Approved'],
     previewValue: 'Live',
+    // TODO: Get title translations
   },
   {
     name: MyInfoAttribute.WorkpassExpiryDate,
@@ -295,6 +404,7 @@ export const types: MyInfoFieldBlock[] = [
     description: 'The workpass expiry date of the form-filler.',
     fieldType: BasicField.Date,
     previewValue: '2023-01-23',
+    // TODO: Get title translations
   },
   {
     name: MyInfoAttribute.MobileNo,
@@ -305,6 +415,11 @@ export const types: MyInfoFieldBlock[] = [
     description: 'The mobile telephone number of the form-filler.',
     fieldType: BasicField.Mobile,
     previewValue: '98765432',
+    titleTranslations: [
+      { language: Language.CHINESE, translation: '手机号码' },
+      { language: Language.MALAY, translation: 'Nombor telefon bimbit' },
+      { language: Language.TAMIL, translation: 'கைப்பேசி எண்' },
+    ],
   },
   {
     name: MyInfoAttribute.ChildrenBirthRecords,
@@ -316,6 +431,7 @@ export const types: MyInfoFieldBlock[] = [
       'The data of the form-filler’s children. Only data of children below 21 years old will be available. Vaccination status is verified by HPB. All other data is verified by ICA.',
     fieldType: BasicField.Children,
     previewValue: 'Child 1',
+    // TODO: Get title translations
   },
   {
     name: MyInfoAttribute.ChildName,
@@ -326,6 +442,7 @@ export const types: MyInfoFieldBlock[] = [
     description: 'Name',
     fieldType: BasicField.Children,
     previewValue: 'PHUA CHU KING',
+    // TODO: Get title translations
   },
   {
     name: MyInfoAttribute.ChildBirthCertNo,
@@ -336,6 +453,7 @@ export const types: MyInfoFieldBlock[] = [
     description: 'Birth certificate number',
     fieldType: BasicField.ShortText,
     previewValue: 'T1234567X',
+    // TODO: Get title translations
   },
   {
     name: MyInfoAttribute.ChildDateOfBirth,
@@ -346,6 +464,7 @@ export const types: MyInfoFieldBlock[] = [
     description: 'Date of birth',
     fieldType: BasicField.ShortText,
     previewValue: '2010-01-01',
+    // TODO: Get title translations
   },
   {
     name: MyInfoAttribute.ChildGender,
@@ -357,6 +476,7 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.ShortText,
     fieldOptions: ['FEMALE', 'MALE', 'UNKNOWN'],
     previewValue: 'MALE',
+    // TODO: Get title translations
   },
   {
     name: MyInfoAttribute.ChildVaxxStatus,
@@ -368,6 +488,7 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: Object.values(MyInfoChildVaxxStatus),
     previewValue: MyInfoChildVaxxStatus.ONEM3D,
+    // TODO: Get title translations
   },
   {
     name: MyInfoAttribute.ChildRace,
@@ -379,6 +500,7 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: myInfoRaces,
     previewValue: 'CHINESE',
+    // TODO: Get title translations
   },
   {
     name: MyInfoAttribute.ChildSecondaryRace,
@@ -390,6 +512,7 @@ export const types: MyInfoFieldBlock[] = [
     fieldType: BasicField.Dropdown,
     fieldOptions: myInfoRaces,
     previewValue: 'CHINESE',
+    // TODO: Get title translations
   },
 ]
 
diff --git a/shared/types/form/form_logic.ts b/shared/types/form/form_logic.ts
index 0c5f8d2765..eb45d1ae23 100644
--- a/shared/types/form/form_logic.ts
+++ b/shared/types/form/form_logic.ts
@@ -1,4 +1,4 @@
-import { BasicField, FormFieldDto } from '../field'
+import { BasicField, FormFieldDto, TranslationMapping } from '../field'
 
 export enum LogicConditionState {
   Equal = 'is equals to',
@@ -38,6 +38,7 @@ export interface ShowFieldLogic extends FormLogicBase {
 export interface PreventSubmitLogic extends FormLogicBase {
   logicType: LogicType.PreventSubmit
   preventSubmitMessage: string
+  preventSubmitMessageTranslations?: TranslationMapping[]
 }
 
 export type FormLogic = ShowFieldLogic | PreventSubmitLogic
diff --git a/shared/types/user.ts b/shared/types/user.ts
index e1622d89a2..2c12303853 100644
--- a/shared/types/user.ts
+++ b/shared/types/user.ts
@@ -25,6 +25,7 @@ export const UserBase = z.object({
       mrfAdminSubmissionKey: z.boolean().optional(),
       mrfConditionalRouting: z.boolean().optional(),
       mfb: z.boolean().optional(),
+      multiLangTranslation: z.boolean().optional(),
     })
     .optional(),
   flags: z.record(z.nativeEnum(SeenFlags), z.number()).optional(),
diff --git a/src/app/models/__tests__/form.server.model.spec.ts b/src/app/models/__tests__/form.server.model.spec.ts
index 97e27e7e96..11b1c87d8f 100644
--- a/src/app/models/__tests__/form.server.model.spec.ts
+++ b/src/app/models/__tests__/form.server.model.spec.ts
@@ -256,6 +256,7 @@ describe('Form Model', () => {
               ],
               logicType: 'preventSubmit',
               preventSubmitMessage: '',
+              preventSubmitMessageTranslations: [],
             },
           ],
         }
diff --git a/src/app/models/form_logic.server.schema.ts b/src/app/models/form_logic.server.schema.ts
index b50d7df861..3e6b3cb12d 100644
--- a/src/app/models/form_logic.server.schema.ts
+++ b/src/app/models/form_logic.server.schema.ts
@@ -1,6 +1,7 @@
 import { Schema } from 'mongoose'
 
 import {
+  Language,
   LogicConditionState,
   LogicIfValue,
   LogicType,
@@ -66,6 +67,21 @@ export const ShowFieldsLogicSchema = new Schema<IShowFieldsLogicSchema>({
 
 export const PreventSubmitLogicSchema = new Schema<IPreventSubmitLogicSchema>({
   preventSubmitMessage: String,
+  preventSubmitMessageTranslations: {
+    type: [
+      {
+        language: {
+          type: String,
+          enum: Object.values(Language),
+        },
+        translation: {
+          type: String,
+        },
+      },
+    ],
+    default: [],
+    _id: false,
+  },
 })
 
 export default LogicSchema
diff --git a/src/app/models/user.server.model.ts b/src/app/models/user.server.model.ts
index d4c1447c4d..7c4c9eb316 100644
--- a/src/app/models/user.server.model.ts
+++ b/src/app/models/user.server.model.ts
@@ -79,6 +79,7 @@ const compileUserModel = (db: Mongoose) => {
         mrfAdminSubmissionKey: Boolean,
         mrfConditionalRouting: Boolean,
         mfb: Boolean,
+        multiLangTranslation: Boolean,
       },
       flags: {
         type: Schema.Types.Map, // of SeenFlags
diff --git a/src/app/modules/form/admin-form/admin-form.controller.ts b/src/app/modules/form/admin-form/admin-form.controller.ts
index 44e8724993..8f8473bb6a 100644
--- a/src/app/modules/form/admin-form/admin-form.controller.ts
+++ b/src/app/modules/form/admin-form/admin-form.controller.ts
@@ -2493,6 +2493,23 @@ const joiLogicBody = {
     is: LogicType.PreventSubmit,
     then: Joi.string().required(),
   }),
+  preventSubmitMessageTranslations: Joi.alternatives().conditional(
+    'logicType',
+    {
+      is: LogicType.PreventSubmit,
+      then: Joi.array()
+        .items(
+          Joi.object({
+            language: Joi.string()
+              .valid(...Object.values(Language))
+              .required(),
+            translation: Joi.string().required(),
+          }),
+        )
+        .optional()
+        .default([]),
+    },
+  ),
 }
 
 /**