diff --git a/web/src/Config.ts b/web/src/Config.ts
index e2d6dba71..31da8b237 100644
--- a/web/src/Config.ts
+++ b/web/src/Config.ts
@@ -31,5 +31,8 @@ export default {
   PULL_REQUEST_DIFF_RENDERING_BLOCK_SIZE: 10,
 
   /** Detection margin for on-screen / off-screen rendering optimization. In pixels.  */
-  IN_VIEWPORT_DETECTION_MARGIN: 5_000
+  IN_VIEWPORT_DETECTION_MARGIN: 5_000,
+
+  /** Limit for the secret input in bytes */
+  SECRET_LIMIT_IN_BYTES: 5_242_880,
 } as const
diff --git a/web/src/components/NewSecretModalButton/NewSecretModalButton.tsx b/web/src/components/NewSecretModalButton/NewSecretModalButton.tsx
index 221b77f51..5a1728bbd 100644
--- a/web/src/components/NewSecretModalButton/NewSecretModalButton.tsx
+++ b/web/src/components/NewSecretModalButton/NewSecretModalButton.tsx
@@ -37,6 +37,7 @@ import { useModalHook } from 'hooks/useModalHook'
 import { useStrings } from 'framework/strings'
 import type { OpenapiCreateSecretRequest, TypesSecret } from 'services/code'
 import { getErrorMessage } from 'utils/Utils'
+import Config from 'Config'
 import css from './NewSecretModalButton.module.scss'
 
 export interface SecretFormData {
@@ -144,6 +145,7 @@ export const NewSecretModalButton: React.FC<NewSecretModalButtonProps> = ({
                       tooltipProps={{
                         dataTooltipId: 'secretDescriptionTextField'
                       }}
+                      maxLength={Config.SECRET_LIMIT_IN_BYTES}
                       autoComplete="off"
                       className={formik.values.showValue ? css.showValue : css.hideValue}
                     />
diff --git a/web/src/components/UpdateSecretModal/UpdateSecretModal.tsx b/web/src/components/UpdateSecretModal/UpdateSecretModal.tsx
index 416bfd136..a576db78c 100644
--- a/web/src/components/UpdateSecretModal/UpdateSecretModal.tsx
+++ b/web/src/components/UpdateSecretModal/UpdateSecretModal.tsx
@@ -39,6 +39,7 @@ import { useGetSpaceParam } from 'hooks/useGetSpaceParam'
 import type { OpenapiUpdateSecretRequest, TypesSecret } from 'services/code'
 import type { SecretFormData } from 'components/NewSecretModalButton/NewSecretModalButton'
 import { getErrorMessage, truncateString } from 'utils/Utils'
+import Config from 'Config'
 import css from './UpdateSecretModal.module.scss'
 
 const useUpdateSecretModal = () => {
@@ -134,6 +135,7 @@ const useUpdateSecretModal = () => {
                     tooltipProps={{
                       dataTooltipId: 'secretDescriptionTextField'
                     }}
+                    maxLength={Config.SECRET_LIMIT_IN_BYTES}
                     autoComplete="off"
                     className={formik.values.showValue ? css.showValue : css.hideValue}
                   />