diff --git a/package.json b/package.json
index 8b0c9aff12b..e40960f3c3f 100644
--- a/package.json
+++ b/package.json
@@ -100,7 +100,7 @@
   "dependencies": {
     "@babel/plugin-transform-regenerator": "^7.18.6",
     "@gorhom/bottom-sheet": "^4.1.5",
-    "@pagopa/io-app-design-system": "1.38.5",
+    "@pagopa/io-app-design-system": "1.39.0",
     "@pagopa/io-pagopa-commons": "^3.1.0",
     "@pagopa/io-react-native-crypto": "^0.3.0",
     "@pagopa/io-react-native-http-client": "1.0.2",
diff --git a/ts/components/screens/PinCreation/PinCarouselItem.tsx b/ts/components/screens/PinCreation/PinCarouselItem.tsx
index 53806a2a403..61e83468f19 100644
--- a/ts/components/screens/PinCreation/PinCarouselItem.tsx
+++ b/ts/components/screens/PinCreation/PinCarouselItem.tsx
@@ -8,7 +8,6 @@ import {
 } from "@pagopa/io-app-design-system";
 import React, { RefObject, memo } from "react";
 import { Dimensions, View } from "react-native";
-import { PIN_LENGTH_SIX } from "../../../utils/constants";
 
 const { width } = Dimensions.get("screen");
 
@@ -17,6 +16,7 @@ export type PinCaouselItemProps = WithTestID<{
   titleRef?: RefObject<View>;
   description?: string;
   value: string;
+  maxLength: number;
   handleOnValidate: (val: string) => boolean;
   onValueChange: (val: string) => void;
 }>;
@@ -28,6 +28,7 @@ export const PinCarouselItem = memo(
     value,
     testID,
     titleRef,
+    maxLength,
     handleOnValidate,
     onValueChange
   }: PinCaouselItemProps) => (
@@ -59,7 +60,7 @@ export const PinCarouselItem = memo(
       )}
       <VSpacer size={32} />
       <CodeInput
-        length={PIN_LENGTH_SIX}
+        length={maxLength}
         onValidate={handleOnValidate}
         onValueChange={onValueChange}
         variant="dark"
diff --git a/ts/components/screens/PinCreation/PinCreation.tsx b/ts/components/screens/PinCreation/PinCreation.tsx
index 5089e8435ef..8090729b3ab 100644
--- a/ts/components/screens/PinCreation/PinCreation.tsx
+++ b/ts/components/screens/PinCreation/PinCreation.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable functional/immutable-data */
 import {
   ButtonLink,
   ButtonOutline,
@@ -31,6 +32,7 @@ import { useIONavigation } from "../../../navigation/params/AppParamsList";
 import { setAccessibilityFocus } from "../../../utils/accessibility";
 import { useOnFirstRender } from "../../../utils/hooks/useOnFirstRender";
 import { ContextualHelpPropsMarkdown } from "../BaseScreenComponent";
+import { PIN_LENGTH_SIX } from "../../../utils/constants";
 import usePinValidationBottomSheet from "./usePinValidationBottomSheet";
 import { PinCaouselItemProps, PinCarouselItem } from "./PinCarouselItem";
 
@@ -57,14 +59,13 @@ export const PinCreation = ({ isOnboarding = false }: Props) => {
   const navigation = useIONavigation();
   const [pin, setPin] = useState("");
   const [pinConfirmation, setPinConfirmation] = useState("");
-  const [pinMode, setPinMode] = useState<PinMode>("creation");
+  const pinModeRef = useRef<PinMode>("creation");
   const { handleSubmit } = useCreatePin({ isOnboarding });
   const pinRef = useRef<string | null>(null);
   const carouselRef = useRef<FlatList>(null);
   const titleCreationRef = useRef<View>(null);
   const titleConfirmationRef = useRef<View>(null);
   const isFirstOnBoarding = useIOSelector(isProfileFirstOnBoardingSelector);
-  const isCreation = pinMode === "creation";
   const { present, bottomSheet } = usePinValidationBottomSheet();
   const { showAlert } = useOnboardingAbortAlert();
 
@@ -74,7 +75,8 @@ export const PinCreation = ({ isOnboarding = false }: Props) => {
 
   const scrollToCreation = useCallback(() => {
     setPin("");
-    setPinMode("creation");
+
+    pinModeRef.current = "creation";
     carouselRef.current?.scrollToIndex({
       animated: true,
       index: CREATION_INDEX
@@ -83,7 +85,7 @@ export const PinCreation = ({ isOnboarding = false }: Props) => {
   }, []);
   const scrollToConfirmation = useCallback(() => {
     setPinConfirmation("");
-    setPinMode("confirmation");
+    pinModeRef.current = "confirmation";
     carouselRef.current?.scrollToIndex({
       animated: true,
       index: CONFIRMATION_INDEX
@@ -92,7 +94,7 @@ export const PinCreation = ({ isOnboarding = false }: Props) => {
   }, []);
 
   const goBack = useCallback(() => {
-    if (!isCreation) {
+    if (pinModeRef.current === "confirmation") {
       /**
        * Scrolls back to pin creation section
        */
@@ -102,7 +104,28 @@ export const PinCreation = ({ isOnboarding = false }: Props) => {
     } else {
       navigation.goBack();
     }
-  }, [navigation, isCreation, isOnboarding, showAlert, scrollToCreation]);
+  }, [navigation, isOnboarding, showAlert, scrollToCreation]);
+
+  const getCurrentSetState = useCallback(
+    (updateValue: (prev: string) => string) =>
+      pinModeRef.current === "creation"
+        ? setPin(updateValue)
+        : setPinConfirmation(updateValue),
+    []
+  );
+
+  const handlePinChange = useCallback(
+    (value: number) =>
+      getCurrentSetState((prev: string) =>
+        prev.length < PIN_LENGTH_SIX ? `${prev}${value}` : prev
+      ),
+    [getCurrentSetState]
+  );
+
+  const onDeletePress = useCallback(
+    () => getCurrentSetState((prev: string) => prev.slice(0, -1)),
+    [getCurrentSetState]
+  );
 
   useHeaderSecondLevel({
     title: "",
@@ -112,12 +135,12 @@ export const PinCreation = ({ isOnboarding = false }: Props) => {
   });
 
   const insertValidPin = useCallback(() => {
-    if (isCreation) {
+    if (pinModeRef.current === "creation") {
       setPin(defaultPin);
     } else {
       setPinConfirmation(defaultPin);
     }
-  }, [isCreation]);
+  }, []);
 
   const handlePinCreation = useCallback(
     (v: string) => {
@@ -182,7 +205,8 @@ export const PinCreation = ({ isOnboarding = false }: Props) => {
       value: pin,
       testID: "create-pin-carousel-item",
       handleOnValidate: handlePinCreation,
-      onValueChange: setPin
+      onValueChange: setPin,
+      maxLength: PIN_LENGTH_SIX
     },
     {
       title: I18n.t("onboarding.pinConfirmation.title"),
@@ -190,7 +214,8 @@ export const PinCreation = ({ isOnboarding = false }: Props) => {
       value: pinConfirmation,
       testID: "confirm-pin-carousel-item",
       handleOnValidate: handlePinConfirmation,
-      onValueChange: setPinConfirmation
+      onValueChange: setPinConfirmation,
+      maxLength: PIN_LENGTH_SIX
     }
   ];
 
@@ -213,8 +238,8 @@ export const PinCreation = ({ isOnboarding = false }: Props) => {
         <VSpacer size={40} />
         <ContentWrapper>
           <NumberPad
-            value={isCreation ? pin : pinConfirmation}
-            onValueChange={isCreation ? setPin : setPinConfirmation}
+            onNumberPress={handlePinChange}
+            onDeletePress={onDeletePress}
             variant="light"
             deleteAccessibilityLabel={I18n.t("global.buttons.delete")}
           />
diff --git a/ts/features/design-system/core/DSNumberPad.tsx b/ts/features/design-system/core/DSNumberPad.tsx
index 26a9fe60bd6..337ab100029 100644
--- a/ts/features/design-system/core/DSNumberPad.tsx
+++ b/ts/features/design-system/core/DSNumberPad.tsx
@@ -27,11 +27,13 @@ export const DSNumberPad = () => {
 
   const navigation = useNavigation();
 
-  const onValueChange = (v: string) => {
-    if (v.length <= PIN_LENGTH) {
-      setValue(v);
-    }
-  };
+  const onValueChange = React.useCallback((v: number) => {
+    setValue(prev => (prev.length < PIN_LENGTH ? `${prev}${v}` : prev));
+  }, []);
+
+  const onDeletePress = React.useCallback(() => {
+    setValue((prev: string) => prev.slice(0, -1));
+  }, []);
 
   React.useEffect(() => {
     navigation.setOptions({
@@ -102,16 +104,16 @@ export const DSNumberPad = () => {
           value={value}
           length={PIN_LENGTH}
           variant={darkBackground ? "light" : "dark"}
-          onValueChange={onValueChange}
+          onValueChange={setValue}
           onValidate={v => v === "123456"}
         />
       </View>
       <VSpacer size={48} />
       <View>
         <NumberPad
-          value={value}
           deleteAccessibilityLabel="Delete"
-          onValueChange={onValueChange}
+          onDeletePress={onDeletePress}
+          onNumberPress={onValueChange}
           variant={darkBackground ? "dark" : "light"}
           biometricType="FACE_ID"
           biometricAccessibilityLabel="Face ID"
diff --git a/ts/features/messages/screens/__tests__/__snapshots__/MessageAttachment.test.tsx.snap b/ts/features/messages/screens/__tests__/__snapshots__/MessageAttachment.test.tsx.snap
index e2a7ad0e67b..d4108e35ad8 100644
--- a/ts/features/messages/screens/__tests__/__snapshots__/MessageAttachment.test.tsx.snap
+++ b/ts/features/messages/screens/__tests__/__snapshots__/MessageAttachment.test.tsx.snap
@@ -643,15 +643,13 @@ exports[`MessageAttachment Should match the snapshot when everything went fine 1
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -808,6 +806,9 @@ exports[`MessageAttachment Should match the snapshot when everything went fine 1
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -1463,15 +1464,13 @@ exports[`MessageAttachment Should match the snapshot when there is an error 1`]
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -1628,6 +1627,9 @@ exports[`MessageAttachment Should match the snapshot when there is an error 1`]
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
diff --git a/ts/features/messages/screens/__tests__/__snapshots__/MessageRouterScreen.test.tsx.snap b/ts/features/messages/screens/__tests__/__snapshots__/MessageRouterScreen.test.tsx.snap
index d14fa8cffd8..16222f80d54 100644
--- a/ts/features/messages/screens/__tests__/__snapshots__/MessageRouterScreen.test.tsx.snap
+++ b/ts/features/messages/screens/__tests__/__snapshots__/MessageRouterScreen.test.tsx.snap
@@ -497,15 +497,13 @@ exports[`MessageRouterScreen should match snapshot before starting to retrieve m
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -662,6 +660,9 @@ exports[`MessageRouterScreen should match snapshot before starting to retrieve m
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -1323,15 +1324,13 @@ exports[`MessageRouterScreen should match snapshot if message data retrieval was
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -1488,6 +1487,9 @@ exports[`MessageRouterScreen should match snapshot if message data retrieval was
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -2335,15 +2337,13 @@ exports[`MessageRouterScreen should match snapshot on message data retrieval fai
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -2500,6 +2500,9 @@ exports[`MessageRouterScreen should match snapshot on message data retrieval fai
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -3161,15 +3164,13 @@ exports[`MessageRouterScreen should match snapshot on message data retrieval suc
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -3326,6 +3327,9 @@ exports[`MessageRouterScreen should match snapshot on message data retrieval suc
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -3987,15 +3991,13 @@ exports[`MessageRouterScreen should match snapshot while retrieving message data
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -4152,6 +4154,9 @@ exports[`MessageRouterScreen should match snapshot while retrieving message data
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
diff --git a/ts/features/pn/screens/__test__/__snapshots__/MessageDetailsScreen.test.tsx.snap b/ts/features/pn/screens/__test__/__snapshots__/MessageDetailsScreen.test.tsx.snap
index 32405dda1b6..101a44a68de 100644
--- a/ts/features/pn/screens/__test__/__snapshots__/MessageDetailsScreen.test.tsx.snap
+++ b/ts/features/pn/screens/__test__/__snapshots__/MessageDetailsScreen.test.tsx.snap
@@ -2353,15 +2353,13 @@ exports[`MessageDetailsScreen should match the snapshot when everything went fin
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -2518,6 +2516,9 @@ exports[`MessageDetailsScreen should match the snapshot when everything went fin
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -3173,15 +3174,13 @@ exports[`MessageDetailsScreen should match the snapshot when there is an error 1
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -3338,6 +3337,9 @@ exports[`MessageDetailsScreen should match the snapshot when there is an error 1
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
diff --git a/ts/features/pn/screens/__test__/__snapshots__/PaidPaymentScreen.test.tsx.snap b/ts/features/pn/screens/__test__/__snapshots__/PaidPaymentScreen.test.tsx.snap
index 8b97120fa75..68ee085335e 100644
--- a/ts/features/pn/screens/__test__/__snapshots__/PaidPaymentScreen.test.tsx.snap
+++ b/ts/features/pn/screens/__test__/__snapshots__/PaidPaymentScreen.test.tsx.snap
@@ -588,15 +588,13 @@ exports[`PaidPaymentScreen should match snapshot 1`] = `
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -753,6 +751,9 @@ exports[`PaidPaymentScreen should match snapshot 1`] = `
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
diff --git a/ts/features/pushNotifications/screens/__tests__/__snapshots__/OnboardingNotificationsPreferencesScreen.test.tsx.snap b/ts/features/pushNotifications/screens/__tests__/__snapshots__/OnboardingNotificationsPreferencesScreen.test.tsx.snap
index aeca4d74333..19a9ee878a2 100644
--- a/ts/features/pushNotifications/screens/__tests__/__snapshots__/OnboardingNotificationsPreferencesScreen.test.tsx.snap
+++ b/ts/features/pushNotifications/screens/__tests__/__snapshots__/OnboardingNotificationsPreferencesScreen.test.tsx.snap
@@ -1384,15 +1384,13 @@ exports[`OnboardingNotificationsPreferencesScreen should match snapshot when not
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -1444,6 +1442,9 @@ exports[`OnboardingNotificationsPreferencesScreen should match snapshot when not
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -2993,15 +2994,13 @@ exports[`OnboardingNotificationsPreferencesScreen should match snapshot when not
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -3053,6 +3052,9 @@ exports[`OnboardingNotificationsPreferencesScreen should match snapshot when not
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -4602,15 +4604,13 @@ exports[`OnboardingNotificationsPreferencesScreen should match snapshot when not
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -4662,6 +4662,9 @@ exports[`OnboardingNotificationsPreferencesScreen should match snapshot when not
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -6211,15 +6214,13 @@ exports[`OnboardingNotificationsPreferencesScreen should match snapshot when not
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -6271,6 +6272,9 @@ exports[`OnboardingNotificationsPreferencesScreen should match snapshot when not
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -8251,15 +8255,13 @@ exports[`OnboardingNotificationsPreferencesScreen should match snapshot when upd
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": "transparent",
                               },
                             ]
                           }
@@ -8311,6 +8313,9 @@ exports[`OnboardingNotificationsPreferencesScreen should match snapshot when upd
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
diff --git a/ts/screens/modal/components/IdentificationNumberPad.tsx b/ts/screens/modal/components/IdentificationNumberPad.tsx
index 979d5af4a13..c583f52bf63 100644
--- a/ts/screens/modal/components/IdentificationNumberPad.tsx
+++ b/ts/screens/modal/components/IdentificationNumberPad.tsx
@@ -41,10 +41,12 @@ export const IdentificationNumberPad = (
 
   const { pin, pinValidation, numberPadVariant, biometricsConfig } = props;
 
-  const onValueChange = useCallback((v: string) => {
-    if (v.length <= PIN_LENGTH) {
-      setValue(v);
-    }
+  const onValueChange = useCallback((v: number) => {
+    setValue(prev => (prev.length < PIN_LENGTH ? `${prev}${v}` : prev));
+  }, []);
+
+  const onDeletePress = useCallback(() => {
+    setValue((prev: string) => prev.slice(0, -1));
   }, []);
 
   // Calling pinValidation after a timeout is neeed
@@ -110,9 +112,9 @@ export const IdentificationNumberPad = (
       <VSpacer size={48} />
       <View>
         <NumberPad
-          value={value}
           deleteAccessibilityLabel={I18n.t("global.buttons.delete")}
-          onValueChange={onValueChange}
+          onDeletePress={onDeletePress}
+          onNumberPress={onValueChange}
           variant={numberPadVariant}
           {...biometricsConfig}
         />
diff --git a/ts/screens/profile/__test__/__snapshots__/LanguagesPreferencesScreen.test.tsx.snap b/ts/screens/profile/__test__/__snapshots__/LanguagesPreferencesScreen.test.tsx.snap
index f6ae5369a36..0adc1e28d67 100644
--- a/ts/screens/profile/__test__/__snapshots__/LanguagesPreferencesScreen.test.tsx.snap
+++ b/ts/screens/profile/__test__/__snapshots__/LanguagesPreferencesScreen.test.tsx.snap
@@ -936,15 +936,13 @@ exports[`LanguagesPreferencesScreen UI Rendering renders the screen with, title,
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -1101,6 +1099,9 @@ exports[`LanguagesPreferencesScreen UI Rendering renders the screen with, title,
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
diff --git a/ts/screens/profile/__test__/__snapshots__/NotificationsPreferencesScreen.test.tsx.snap b/ts/screens/profile/__test__/__snapshots__/NotificationsPreferencesScreen.test.tsx.snap
index 254d7838e79..4602a57cdbc 100644
--- a/ts/screens/profile/__test__/__snapshots__/NotificationsPreferencesScreen.test.tsx.snap
+++ b/ts/screens/profile/__test__/__snapshots__/NotificationsPreferencesScreen.test.tsx.snap
@@ -1042,15 +1042,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, disabled  preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -1207,6 +1205,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, disabled  preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -2415,15 +2416,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, disabled  preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -2580,6 +2579,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, disabled  preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -3788,15 +3790,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, disabled  preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -3953,6 +3953,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, disabled  preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -5161,15 +5164,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, disabled  preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -5326,6 +5327,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, disabled  preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -6534,15 +6538,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, disabled  preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -6699,6 +6701,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, disabled  preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -7907,15 +7912,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, disabled  preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -8072,6 +8075,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, disabled  preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -9280,15 +9286,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, enabled   preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -9445,6 +9449,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, enabled   preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -10653,15 +10660,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, enabled   preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -10818,6 +10823,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, enabled   preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -12026,15 +12034,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, enabled   preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -12191,6 +12197,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, enabled   preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -13399,15 +13408,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, enabled   preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -13564,6 +13571,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, enabled   preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -14772,15 +14782,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, enabled   preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -14937,6 +14945,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, enabled   preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -16145,15 +16156,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, enabled   preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -16310,6 +16319,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, enabled   preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -17518,15 +17530,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, undefined preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -17683,6 +17693,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, undefined preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -18891,15 +18904,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, undefined preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -19056,6 +19067,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, undefined preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -20264,15 +20278,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, undefined preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -20429,6 +20441,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, undefined preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -21637,15 +21652,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, undefined preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -21802,6 +21815,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, undefined preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -23010,15 +23026,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, undefined preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -23175,6 +23189,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, undefined preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
@@ -24383,15 +24400,13 @@ exports[`NotificationsPreferencesScreen should match snapshot, undefined preview
                           accessibilityRole="header"
                           style={
                             Array [
-                              Object {
-                                "backgroundColor": "#FFFFFF",
-                              },
                               Object {
                                 "borderBottomWidth": 1,
+                                "borderColor": "rgba(232,235,241,0)",
                               },
+                              Object {},
                               Object {
                                 "backgroundColor": "#FFFFFF",
-                                "borderColor": undefined,
                               },
                             ]
                           }
@@ -24548,6 +24563,9 @@ exports[`NotificationsPreferencesScreen should match snapshot, undefined preview
                                       "fontSize": 14,
                                       "textAlign": "center",
                                     },
+                                    Object {
+                                      "color": "#0E0F13",
+                                    },
                                     Object {
                                       "fontFamily": "Titillium Web",
                                       "fontStyle": "normal",
diff --git a/yarn.lock b/yarn.lock
index 25ef9e3e5c5..e3e5060a6e6 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3272,10 +3272,10 @@
   dependencies:
     "@types/node" ">= 8"
 
-"@pagopa/io-app-design-system@1.38.5":
-  version "1.38.5"
-  resolved "https://registry.yarnpkg.com/@pagopa/io-app-design-system/-/io-app-design-system-1.38.5.tgz#b767ab37cdb612ddcb3c57670104fafe5d6400a7"
-  integrity sha512-0u3bFVHLeo+8Q0Yf5nEnxQ6JPL0KsprbN0EutlqZUMMXee+IsiK/ZVfSjsNlF1/cNqVs8FwwDDLducm8nF4CKQ==
+"@pagopa/io-app-design-system@1.39.0":
+  version "1.39.0"
+  resolved "https://registry.yarnpkg.com/@pagopa/io-app-design-system/-/io-app-design-system-1.39.0.tgz#072ad36f4e163a63ce545f0c020c5828e25621d2"
+  integrity sha512-saFzbeJsvyaPHMt75NW2L1Z+Zz3M98FgilqIL7GVK56Fga+aY2CwxNAnANN4lA4PprdqGpyb7OrkTRT9/3aPZA== 
   dependencies:
     "@pagopa/ts-commons" "^12.0.0"
     "@testing-library/jest-native" "^5.4.2"