diff --git a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/pages/HeaderFooterPage.kt b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/pages/HeaderFooterPage.kt
index 65daa5a8f2..b49638c55c 100644
--- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/pages/HeaderFooterPage.kt
+++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/pages/HeaderFooterPage.kt
@@ -27,10 +27,10 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 
 /**
  * @param modifier Classical modifier.
@@ -87,7 +87,7 @@ private fun ContentToPreview() {
             ) {
                 Text(
                     text = "Content",
-                    fontSize = 40.sp
+                    style = ElementTheme.typography.fontHeadingXlBold
                 )
             }
         },
@@ -99,7 +99,7 @@ private fun ContentToPreview() {
             ) {
                 Text(
                     text = "Header",
-                    fontSize = 40.sp
+                    style = ElementTheme.typography.fontHeadingXlBold
                 )
             }
         },
@@ -111,7 +111,7 @@ private fun ContentToPreview() {
             ) {
                 Text(
                     text = "Footer",
-                    fontSize = 40.sp
+                    style = ElementTheme.typography.fontHeadingXlBold
                 )
             }
         }
diff --git a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/pages/OnBoardingPage.kt b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/pages/OnBoardingPage.kt
index 0e0292957b..59f0df847c 100644
--- a/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/pages/OnBoardingPage.kt
+++ b/libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/atomic/pages/OnBoardingPage.kt
@@ -30,11 +30,11 @@ import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import io.element.android.libraries.designsystem.R
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.theme.ElementTheme
 
 /**
  * Page for onboarding screens, with content and optional footer.
@@ -106,7 +106,7 @@ private fun ContentToPreview() {
             ) {
                 Text(
                     text = "Content",
-                    fontSize = 40.sp
+                    style = ElementTheme.typography.fontHeadingXlBold
                 )
             }
         },
@@ -118,7 +118,7 @@ private fun ContentToPreview() {
             ) {
                 Text(
                     text = "Footer",
-                    fontSize = 40.sp
+                    style = ElementTheme.typography.fontHeadingXlBold
                 )
             }
         }