diff --git a/app/src/main/java/com/anytypeio/anytype/ui/auth/account/DeletedAccountFragment.kt b/app/src/main/java/com/anytypeio/anytype/ui/auth/account/DeletedAccountFragment.kt
index 9e4bff562b..e070a68df2 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/auth/account/DeletedAccountFragment.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/auth/account/DeletedAccountFragment.kt
@@ -38,6 +38,8 @@ import androidx.lifecycle.repeatOnLifecycle
 import androidx.navigation.fragment.findNavController
 import com.anytypeio.anytype.R
 import com.anytypeio.anytype.core_ui.foundation.Divider
+import com.anytypeio.anytype.core_ui.views.BodyCalloutRegular
+import com.anytypeio.anytype.core_ui.views.HeadlineHeading
 import com.anytypeio.anytype.core_utils.ext.arg
 import com.anytypeio.anytype.core_utils.ext.toast
 import com.anytypeio.anytype.core_utils.ui.BaseComposeFragment
@@ -183,7 +185,7 @@ fun DeletedAccountScreen(
                             }
                         },
                         color = colorResource(R.color.text_primary),
-                        style = MaterialTheme.typography.h2,
+                        style = HeadlineHeading,
                         modifier = Modifier.padding(
                             start = 20.dp,
                             end = 20.dp
@@ -192,13 +194,13 @@ fun DeletedAccountScreen(
                     Text(
                         text = stringResource(R.string.deleted_account_msg),
                         color = colorResource(R.color.text_primary),
+                        style = BodyCalloutRegular,
                         modifier = Modifier.padding(
                             top = 12.dp,
                             start = 20.dp,
                             end = 20.dp,
                             bottom = 14.dp
-                        ),
-                        fontSize = 15.sp
+                        )
                     )
                     if (date != DeletionDate.Deleted) {
                         Action(
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/home/HomeScreen.kt b/app/src/main/java/com/anytypeio/anytype/ui/home/HomeScreen.kt
index 10564e516b..a4aabd974a 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/home/HomeScreen.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/home/HomeScreen.kt
@@ -41,15 +41,14 @@ import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.unit.IntOffset
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import coil.compose.rememberAsyncImagePainter
 import com.anytypeio.anytype.R
 import com.anytypeio.anytype.core_models.ObjectWrapper
 import com.anytypeio.anytype.core_ui.extensions.throttledClick
 import com.anytypeio.anytype.core_ui.foundation.noRippleClickable
+import com.anytypeio.anytype.core_ui.views.UXBody
 import com.anytypeio.anytype.emojifier.Emojifier
 import com.anytypeio.anytype.presentation.home.InteractionMode
 import com.anytypeio.anytype.presentation.spaces.SpaceIconView
@@ -503,10 +502,8 @@ fun HomeScreenButton(
         Text(
             text = text,
             modifier = Modifier.align(Alignment.Center),
-            style = TextStyle(
-                fontSize = 17.sp,
-                color = colorResource(id = R.color.text_white)
-            )
+            style = UXBody,
+            color = colorResource(id = R.color.text_button_label)
         )
     }
 }
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/library/views/LibraryTabs.kt b/app/src/main/java/com/anytypeio/anytype/ui/library/views/LibraryTabs.kt
index 4602a90c2a..60415025a5 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/library/views/LibraryTabs.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/library/views/LibraryTabs.kt
@@ -122,6 +122,7 @@ fun LibraryTab(
                 Text(
                     text = stringResource(id = config.mainTitle),
                     style = TabTitleStyle,
+                    color = colorResource(id = R.color.text_primary),
                     onTextLayout = onTextLayout::invoke
                 )
             }
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/library/views/list/LibraryListTabs.kt b/app/src/main/java/com/anytypeio/anytype/ui/library/views/list/LibraryListTabs.kt
index 6094a84415..3293abd58b 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/library/views/list/LibraryListTabs.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/library/views/list/LibraryListTabs.kt
@@ -80,6 +80,7 @@ fun LibraryListTab(
                 modifier = modifier
                     .wrapContentWidth()
                     .offset(x = config.subtitleTabOffset),
+                color = colorResource(id = R.color.text_primary)
             )
         },
         selected = pagerState.currentPage == index,
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/library/views/list/items/Items.kt b/app/src/main/java/com/anytypeio/anytype/ui/library/views/list/items/Items.kt
index eeeb45a685..724c095dfb 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/library/views/list/items/Items.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/library/views/list/items/Items.kt
@@ -222,6 +222,7 @@ fun LibraryObjectEmptyItem(objectType: String, name: String) {
                 formatArgs = arrayOf(objectType, name)
             ),
             style = UXBody,
+            color = colorResource(id = R.color.text_primary),
             textAlign = TextAlign.Center,
             modifier = Modifier.padding(bottom = 9.dp)
         )
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/relations/RelationEditScreen.kt b/app/src/main/java/com/anytypeio/anytype/ui/relations/RelationEditScreen.kt
index 3daa87b11a..e5f080a1c5 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/relations/RelationEditScreen.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/relations/RelationEditScreen.kt
@@ -99,6 +99,7 @@ fun RelationEditHeader(
         }
         Text(
             text = stringResource(id = R.string.relation_editing_title),
+            color = colorResource(id = R.color.text_primary),
             style = Title1,
         )
         if (!readOnly) {
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeCreationHeader.kt b/app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeCreationHeader.kt
index 7a557e3c8f..71259c61c9 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeCreationHeader.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeCreationHeader.kt
@@ -49,6 +49,7 @@ fun TypeCreationHeader(
         Spacer(modifier = Modifier.weight(1f))
         Text(
             text = stringResource(id = R.string.type_creation_new_type),
+            color = colorResource(id = R.color.text_primary),
             style = Title1,
         )
         Box(modifier = Modifier.weight(1f)) {
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeEditHeader.kt b/app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeEditHeader.kt
index af4b8414c1..e3ecb08c42 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeEditHeader.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeEditHeader.kt
@@ -53,7 +53,8 @@ fun TypeEditHeader(
             }
             Text(
                 text = stringResource(id = R.string.type_editing_title),
-                style = Title1
+                style = Title1,
+                color = colorResource(id = R.color.text_primary)
             )
             if (!readOnly) {
                 Box(modifier = Modifier.weight(1f)) {
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeEditWidget.kt b/app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeEditWidget.kt
index 217fb134ea..a5c6be1ad5 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeEditWidget.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeEditWidget.kt
@@ -19,16 +19,12 @@ import androidx.compose.ui.layout.onGloballyPositioned
 import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.TextRange
-import androidx.compose.ui.text.TextStyle
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.input.ImeAction
 import androidx.compose.ui.text.input.TextFieldValue
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.anytypeio.anytype.R
 import com.anytypeio.anytype.core_ui.views.BodyRegular
 import com.anytypeio.anytype.presentation.objects.ObjectIcon
-import com.anytypeio.anytype.ui.settings.fonts
 import com.anytypeio.anytype.ui.types.views.TypeEditWidgetDefaults.OffsetX
 
 
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/update/MigrationErrorScreen.kt b/app/src/main/java/com/anytypeio/anytype/ui/update/MigrationErrorScreen.kt
index 17c4398889..6bca09e06e 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/update/MigrationErrorScreen.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/update/MigrationErrorScreen.kt
@@ -8,16 +8,12 @@ import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.text.ClickableText
-import androidx.compose.material.Button
-import androidx.compose.material.ButtonDefaults
 import androidx.compose.material.Card
-import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.mutableStateOf
@@ -34,9 +30,14 @@ import androidx.compose.ui.text.buildAnnotatedString
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.withStyle
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.anytypeio.anytype.R
 import com.anytypeio.anytype.core_ui.foundation.noRippleClickable
+import com.anytypeio.anytype.core_ui.views.BodyCallout
+import com.anytypeio.anytype.core_ui.views.BodyRegular
+import com.anytypeio.anytype.core_ui.views.ButtonPrimary
+import com.anytypeio.anytype.core_ui.views.ButtonSize
+import com.anytypeio.anytype.core_ui.views.HeadlineHeading
+import com.anytypeio.anytype.core_ui.views.HeadlineSubheading
 import com.anytypeio.anytype.presentation.update.MigrationErrorViewModel.ViewAction
 import kotlinx.coroutines.launch
 
@@ -59,17 +60,14 @@ fun Cards(onViewAction: (ViewAction) -> Unit) {
     Column(modifier = Modifier.padding(horizontal = 20.dp)) {
         Text(
             text = stringResource(id = R.string.almost_there),
-            style = MaterialTheme.typography.h2.copy(
-                color = colorResource(id = R.color.text_primary)
-            ),
+            style = HeadlineHeading,
+            color = colorResource(id = R.color.text_primary),
             modifier = Modifier.padding(top = 56.dp)
         )
         Text(
             text = stringResource(id = R.string.almost_there_subtitle),
-            style = MaterialTheme.typography.body1.copy(
-                fontSize = 17.sp,
-                color = colorResource(id = R.color.text_primary)
-            ),
+            style = BodyRegular,
+            color = colorResource(id = R.color.text_primary),
             modifier = Modifier.padding(top = 12.dp)
         )
         InfoCard(
@@ -95,11 +93,7 @@ fun Cards(onViewAction: (ViewAction) -> Unit) {
                 ClickableText(
                     modifier = Modifier.padding(top = 12.dp),
                     text = text,
-                    style = MaterialTheme.typography.body2.copy(
-                        fontSize = 15.sp,
-                        color = colorResource(id = R.color.text_primary),
-                        lineHeight = 22.sp
-                    ),
+                    style = BodyCallout,
                     onClick = { offset ->
                         text.getStringAnnotations(
                             tag = ANNOTATION_TAG,
@@ -120,37 +114,20 @@ fun Cards(onViewAction: (ViewAction) -> Unit) {
             expanded = false,
             toggleClick = { onViewAction(ViewAction.ToggleMigrationReady) },
             content = {
-                Column() {
+                Column {
                     Text(
                         modifier = Modifier.padding(top = 12.dp),
                         text = stringResource(id = R.string.migration_error_msg),
-                        style = MaterialTheme.typography.body2.copy(
-                            fontSize = 15.sp,
-                            color = colorResource(id = R.color.text_primary),
-                            lineHeight = 22.sp
-                        )
+                        style = BodyCallout,
+                        color = colorResource(id = R.color.text_primary)
                     )
-                    Button(
+                    ButtonPrimary(
+                        text = stringResource(id = R.string.visit_forum),
                         modifier = Modifier
                             .fillMaxWidth()
-                            .padding(top = 0.dp),
+                            .padding(top = 16.dp),
                         onClick = { onViewAction(ViewAction.VisitForum) },
-                        colors = ButtonDefaults.buttonColors(backgroundColor = colorResource(id = R.color.black)),
-                        shape = RoundedCornerShape(10.dp),
-                        contentPadding = PaddingValues(
-                            0.dp, 10.dp, 0.dp, 10.dp
-                        ),
-                        content = {
-                            Text(
-                                text = stringResource(id = R.string.visit_forum),
-                                style = MaterialTheme.typography.h3.copy(
-                                    color = colorResource(id = R.color.library_action_btn_text_color)
-                                )
-                            )
-                        },
-                        elevation = ButtonDefaults.elevation(
-                            defaultElevation = 0.dp, pressedElevation = 0.dp
-                        )
+                        size = ButtonSize.Large
                     )
                 }
             }
@@ -210,10 +187,8 @@ fun InfoCard(
             ) {
                 Text(
                     text = title,
-                    style = MaterialTheme.typography.h2.copy(
-                        color = colorResource(id = R.color.text_primary),
-                        fontSize = 17.sp
-                    )
+                    style = HeadlineSubheading,
+                    color = colorResource(id = R.color.text_primary)
                 )
                 AnimatedVisibility(visible = cardOpened.value) {
                     content()
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/widgets/SelectWidgetTypeScreen.kt b/app/src/main/java/com/anytypeio/anytype/ui/widgets/SelectWidgetTypeScreen.kt
index 7bbee6e5bc..9dbb16390c 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/widgets/SelectWidgetTypeScreen.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/widgets/SelectWidgetTypeScreen.kt
@@ -1,5 +1,6 @@
 package com.anytypeio.anytype.ui.widgets
 
+import android.graphics.Color
 import androidx.annotation.DrawableRes
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.clickable
@@ -16,16 +17,29 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.TextStyle
-import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.anytypeio.anytype.R
 import com.anytypeio.anytype.core_ui.foundation.Divider
 import com.anytypeio.anytype.core_ui.foundation.Dragger
 import com.anytypeio.anytype.core_ui.foundation.Toolbar
+import com.anytypeio.anytype.core_ui.views.Caption2Regular
+import com.anytypeio.anytype.core_ui.views.Title2
 import com.anytypeio.anytype.presentation.widgets.WidgetTypeView
 
+@Preview(backgroundColor = 0xFFFFFFFF, showBackground = true)
+@Composable
+fun MySelectWidgetTypeScreen() {
+    SelectWidgetTypeScreen(
+        views = listOf(
+            WidgetTypeView.List(isSelected = true),
+            WidgetTypeView.Link(isSelected = true),
+            WidgetTypeView.Tree(isSelected = true)
+        ),
+        onViewClicked = {  }
+    )
+}
+
 @Composable
 fun SelectWidgetTypeScreen(
     views: List<WidgetTypeView>,
@@ -78,9 +92,6 @@ fun SelectWidgetTypeScreen(
                     onClick = { onViewClicked(type) }
                 )
             }
-            if (index != views.lastIndex) {
-                Divider(paddingStart = 76.dp)
-            }
         }
         Spacer(modifier = Modifier.height(20.dp))
     }
@@ -110,23 +121,18 @@ fun WidgetTypeItem(
         Text(
             modifier = Modifier
                 .align(Alignment.TopStart)
-                .padding(start = 70.dp, top = 11.dp),
+                .padding(start = 76.dp, top = 11.dp),
             text = title,
-            style = TextStyle(
-                color = colorResource(id = R.color.text_primary),
-                fontSize = 15.sp,
-                fontWeight = FontWeight.Medium
-            )
+            style = Title2,
+            color = colorResource(id = R.color.text_primary)
         )
         Text(
             modifier = Modifier
                 .align(Alignment.BottomStart)
-                .padding(start = 70.dp, bottom = 11.dp),
+                .padding(start = 76.dp, bottom = 11.dp),
             text = subtitle,
-            style = TextStyle(
-                color = colorResource(id = R.color.text_secondary),
-                fontSize = 13.sp
-            )
+            style = Caption2Regular,
+            color = colorResource(id = R.color.text_secondary)
         )
         if (isChecked) {
             Image(
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/widgets/collection/CollectionScreen.kt b/app/src/main/java/com/anytypeio/anytype/ui/widgets/collection/CollectionScreen.kt
index 798eb26ff0..74482738ae 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/widgets/collection/CollectionScreen.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/widgets/collection/CollectionScreen.kt
@@ -77,6 +77,11 @@ import com.anytypeio.anytype.R
 import com.anytypeio.anytype.core_ui.common.keyboardAsState
 import com.anytypeio.anytype.core_ui.foundation.components.BottomNavigationMenu
 import com.anytypeio.anytype.core_ui.foundation.noRippleClickable
+import com.anytypeio.anytype.core_ui.views.BodyCalloutRegular
+import com.anytypeio.anytype.core_ui.views.PreviewTitle2Medium
+import com.anytypeio.anytype.core_ui.views.Relations3
+import com.anytypeio.anytype.core_ui.views.Title1
+import com.anytypeio.anytype.core_ui.views.UXBody
 import com.anytypeio.anytype.core_ui.widgets.CollectionActionWidget
 import com.anytypeio.anytype.core_ui.widgets.ObjectIconWidget
 import com.anytypeio.anytype.core_utils.ext.invisible
@@ -152,24 +157,21 @@ private fun TopBar(
         Text(
             modifier = Modifier.align(Alignment.Center),
             text = uiState.collectionName,
-            style = MaterialTheme.typography.h3,
+            style = Title1,
+            color = colorResource(id = R.color.text_primary)
         )
         Text(
             modifier = Modifier
                 .align(CenterEnd)
-                .noRippleClickable { vm.onActionClicked() },
+                .noRippleClickable { vm.onActionClicked() }
+                .padding(start = 16.dp, top = 12.dp, bottom = 12.dp),
             text = uiState.actionName,
-            style = actionTextStyle(),
+            style = UXBody,
+            color = colorResource(id = R.color.glyph_active)
         )
     }
 }
 
-@Composable
-private fun actionTextStyle() = MaterialTheme.typography.body2.copy(
-    fontSize = 17.sp,
-    color = colorResource(id = R.color.glyph_active)
-)
-
 @Composable
 private fun ListView(
     vm: CollectionViewModel,
@@ -339,9 +341,10 @@ fun SectionItem(
         Text(
             modifier = Modifier.padding(16.dp, 20.dp, 0.dp, 0.dp),
             text = view.name,
-            style = sectionTextStyle(),
+            style = BodyCalloutRegular,
             maxLines = 1,
-            overflow = TextOverflow.Ellipsis
+            overflow = TextOverflow.Ellipsis,
+            color = colorResource(id = R.color.text_secondary)
         )
     }
 }
@@ -431,7 +434,8 @@ fun CollectionItem(
 
                 Text(
                     text = name,
-                    style = objNameTextStyle(),
+                    style = PreviewTitle2Medium,
+                    color = colorResource(id = R.color.text_primary),
                     maxLines = 1,
                     overflow = TextOverflow.Ellipsis
                 )
@@ -440,7 +444,8 @@ fun CollectionItem(
                 if (!description.isNullOrBlank()) {
                     Text(
                         text = description,
-                        style = objDescriptionTextStyle(),
+                        style = Relations3,
+                        color = colorResource(id = R.color.text_primary),
                         maxLines = 1,
                         overflow = TextOverflow.Ellipsis
                     )
@@ -451,8 +456,8 @@ fun CollectionItem(
                     if (!typeName.isNullOrBlank()) {
                         Text(
                             text = typeName,
-                            fontSize = 12.sp,
-                            style = objTypeNameTextStyle(),
+                            style = Relations3,
+                            color = colorResource(id = R.color.text_secondary),
                             maxLines = 1,
                             overflow = TextOverflow.Ellipsis
                         )
@@ -494,32 +499,6 @@ fun CollectionItem(
     }
 }
 
-
-@Composable
-private fun sectionTextStyle() = MaterialTheme.typography.body2.copy(
-    fontSize = 15.sp,
-    color = colorResource(id = R.color.text_secondary)
-)
-
-@Composable
-private fun objTypeNameTextStyle() = MaterialTheme.typography.body2.copy(
-    color = colorResource(id = R.color.text_secondary)
-)
-
-@Composable
-private fun objDescriptionTextStyle() = MaterialTheme.typography.body2.copy(
-    fontSize = 12.sp,
-    color = colorResource(id = R.color.text_primary)
-)
-
-@Composable
-private fun objNameTextStyle() = MaterialTheme.typography.h3.copy(
-    fontSize = 15.sp,
-    color = colorResource(id = R.color.text_primary),
-    fontWeight = FontWeight.Medium,
-    lineHeight = 20.sp
-)
-
 @ExperimentalMaterialApi
 @Composable
 fun CollectionScreen(vm: CollectionViewModel) {
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/widgets/menu/WidgetDropDownMenu.kt b/app/src/main/java/com/anytypeio/anytype/ui/widgets/menu/WidgetDropDownMenu.kt
index 3a6ec12f32..f5d0339e9a 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/widgets/menu/WidgetDropDownMenu.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/widgets/menu/WidgetDropDownMenu.kt
@@ -50,7 +50,8 @@ fun WidgetMenu(
             ) {
                 Text(
                     text = stringResource(R.string.widget_add_below),
-                    style = BodyRegular
+                    style = BodyRegular,
+                    color = colorResource(id = R.color.text_primary),
                 )
             }
             Divider(
@@ -68,7 +69,8 @@ fun WidgetMenu(
             ) {
                 Text(
                     text = stringResource(R.string.widget_change_source),
-                    style = defaultTextStyle
+                    style = defaultTextStyle,
+                    color = colorResource(id = R.color.text_primary),
                 )
             }
             Divider(
@@ -86,7 +88,8 @@ fun WidgetMenu(
             ) {
                 Text(
                     text = stringResource(R.string.widget_change_type),
-                    style = defaultTextStyle
+                    style = defaultTextStyle,
+                    color = colorResource(id = R.color.text_primary),
                 )
             }
             Divider(
@@ -144,7 +147,8 @@ fun WidgetMenu(
             ) {
                 Text(
                     text = stringResource(R.string.widget_edit_widgets),
-                    style = defaultTextStyle
+                    style = defaultTextStyle,
+                    color = colorResource(id = R.color.text_primary),
                 )
             }
         }
@@ -173,7 +177,8 @@ fun WidgetActionButton(
                 .align(Alignment.Center)
                 .padding(horizontal = 12.dp),
             text = label,
-            style = Title2
+            style = Title2,
+            color = colorResource(id = R.color.text_primary)
         )
     }
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/BinWidgetCard.kt b/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/BinWidgetCard.kt
index 4d98ca3cd6..548fdd5276 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/BinWidgetCard.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/BinWidgetCard.kt
@@ -91,7 +91,8 @@ fun BinWidgetCard(
                 modifier = Modifier
                     .align(Alignment.CenterStart)
                     .padding(start = 42.dp, end = 16.dp),
-                style = HeadlineSubheading
+                style = HeadlineSubheading,
+                color = colorResource(id = R.color.text_primary),
             )
         }
         AnimatedVisibility(
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/DataViewWidget.kt b/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/DataViewWidget.kt
index 6659cabfb4..84ca3b5c0c 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/DataViewWidget.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/DataViewWidget.kt
@@ -211,7 +211,8 @@ fun ListWidgetElement(
                     .align(Alignment.CenterStart),
             maxLines = 1,
             overflow = TextOverflow.Ellipsis,
-            style = PreviewTitle2Medium
+            style = PreviewTitle2Medium,
+            color = colorResource(id = R.color.text_primary),
         )
         if (hasDescription) {
             Text(
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/LibraryWidgetCard.kt b/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/LibraryWidgetCard.kt
index 5b503e9e45..96ccc7af80 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/LibraryWidgetCard.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/LibraryWidgetCard.kt
@@ -85,7 +85,8 @@ fun LibraryWidgetCard(
                 modifier = Modifier
                     .align(Alignment.CenterStart)
                     .padding(start = 42.dp, end = 16.dp),
-                style = HeadlineSubheading
+                style = HeadlineSubheading,
+                color = colorResource(id = R.color.text_primary),
             )
         }
         WidgetMenu(
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/LinkWidget.kt b/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/LinkWidget.kt
index 361ccd4000..6893a724f6 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/LinkWidget.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/LinkWidget.kt
@@ -94,7 +94,8 @@ fun LinkWidgetCard(
                         start = 16.dp,
                         end = if (isInEditMode) 76.dp else 32.dp
                     ),
-                style = HeadlineSubheading
+                style = HeadlineSubheading,
+                color = colorResource(id = R.color.text_primary),
             )
             AnimatedVisibility(
                 visible = isInEditMode,
diff --git a/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/TreeWidget.kt b/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/TreeWidget.kt
index 18e5e89973..f0cb6582f0 100644
--- a/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/TreeWidget.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/widgets/types/TreeWidget.kt
@@ -207,7 +207,8 @@ private fun TreeWidgetTreeItems(
                 modifier = Modifier.padding(start = 8.dp),
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
-                style = PreviewTitle2Medium
+                style = PreviewTitle2Medium,
+                color = colorResource(id = R.color.text_primary),
             )
         }
         Divider(
@@ -242,6 +243,7 @@ fun WidgetHeader(
         Text(
             text = title.ifEmpty { stringResource(id = R.string.untitled) },
             style = HeadlineSubheading,
+            color = colorResource(id = R.color.text_primary),
             maxLines = 1,
             overflow = TextOverflow.Ellipsis,
             modifier = Modifier
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index 16ab2a08b4..5accc20ea0 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -259,7 +259,7 @@ Do the computation of an expensive paragraph of text on a background thread:
     <string name="download_from_node">All files will be deleted from your current device. They can be downloaded again from a backup node or another device.</string>
 
     <string name="new_profile">New profile</string>
-    <string name="back_up_your_phrase">Back up</string>
+    <string name="back_up_your_phrase">Back up phrase</string>
     <string name="anytype_analytics">Anytype Analytics</string>
     <string name="anytype_analytics_msg">Understanding how people use Anytype helps us improve the product. This version of Anytype includes the analytics code that protects your privacy.\nIt doesn\'t record the actual document\'s content but still allows us to understand how you use Anytype.\nStay subscribed to our mailing list, as we will soon announce a new release that enables you to opt-out.</string>
     <string name="retry">Retry</string>
diff --git a/core-ui/src/main/java/com/anytypeio/anytype/core_ui/foundation/Foundation.kt b/core-ui/src/main/java/com/anytypeio/anytype/core_ui/foundation/Foundation.kt
index f3d76a3ab0..e7f424df4b 100644
--- a/core-ui/src/main/java/com/anytypeio/anytype/core_ui/foundation/Foundation.kt
+++ b/core-ui/src/main/java/com/anytypeio/anytype/core_ui/foundation/Foundation.kt
@@ -1,10 +1,8 @@
 package com.anytypeio.anytype.core_ui.foundation
 
 import androidx.annotation.DrawableRes
-import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
-import androidx.compose.foundation.border
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
@@ -15,36 +13,42 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
-import androidx.compose.foundation.layout.wrapContentSize
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.Card
-import androidx.compose.material.CircularProgressIndicator
 import androidx.compose.material.ExperimentalMaterialApi
-import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.anytypeio.anytype.core_ui.R
+import com.anytypeio.anytype.core_ui.views.BodyCalloutRegular
+import com.anytypeio.anytype.core_ui.views.BodyRegular
+import com.anytypeio.anytype.core_ui.views.ButtonPrimary
+import com.anytypeio.anytype.core_ui.views.ButtonSecondary
+import com.anytypeio.anytype.core_ui.views.ButtonSize
+import com.anytypeio.anytype.core_ui.views.ButtonWarning
+import com.anytypeio.anytype.core_ui.views.Caption2Regular
+import com.anytypeio.anytype.core_ui.views.HeadlineHeading
 import com.anytypeio.anytype.core_ui.views.HeadlineSubheading
+import com.anytypeio.anytype.core_ui.views.Title1
 
 @Composable
 fun Toolbar(title: String) {
     Box(
-        Modifier.fillMaxWidth().height(48.dp),
+        Modifier
+            .fillMaxWidth()
+            .height(48.dp),
         contentAlignment = Alignment.Center
     ) {
         Text(
             text = title,
-            style = HeadlineSubheading
+            style = Title1,
+            color = colorResource(R.color.text_primary)
         )
     }
 }
@@ -52,13 +56,15 @@ fun Toolbar(title: String) {
 @Composable
 fun Dragger(modifier: Modifier = Modifier) {
     Box(
-        modifier = modifier.size(
-            height = 4.dp,
-            width = 48.dp
-        ).background(
-            color = colorResource(R.color.shape_primary),
-            shape = RoundedCornerShape(6.dp)
-        )
+        modifier = modifier
+            .size(
+                height = 4.dp,
+                width = 48.dp
+            )
+            .background(
+                color = colorResource(R.color.shape_primary),
+                shape = RoundedCornerShape(6.dp)
+            )
     )
 }
 
@@ -68,7 +74,8 @@ fun Divider(
     paddingEnd: Dp = 20.dp
 ) {
     Box(
-        Modifier.padding(start = paddingStart, end = paddingEnd)
+        Modifier
+            .padding(start = paddingStart, end = paddingEnd)
             .background(color = colorResource(R.color.shape_primary))
             .height(0.5.dp)
             .fillMaxWidth()
@@ -83,7 +90,9 @@ fun Option(
 ) {
     Row(
         verticalAlignment = Alignment.CenterVertically,
-        modifier = Modifier.height(52.dp).clickable(onClick = onClick)
+        modifier = Modifier
+            .height(52.dp)
+            .clickable(onClick = onClick)
 
     ) {
         Image(
@@ -98,7 +107,8 @@ fun Option(
             color = colorResource(R.color.text_primary),
             modifier = Modifier.padding(
                 start = 12.dp
-            )
+            ),
+            style = BodyRegular
         )
         Box(
             modifier = Modifier.weight(1.0f, true),
@@ -133,13 +143,13 @@ fun Warning(
 ) {
     Column {
         Text(
-            style = MaterialTheme.typography.h2,
             text = title,
             modifier = Modifier.padding(
                 top = 24.dp,
                 start = 20.dp,
                 end = 20.dp
             ),
+            style = HeadlineHeading,
             color = colorResource(R.color.text_primary)
         )
         Text(
@@ -147,54 +157,40 @@ fun Warning(
             modifier = Modifier.padding(
                 top = 12.dp,
                 start = 20.dp,
-                end = 20.dp
+                end = 20.dp,
+                bottom = 10.dp
             ),
+            style = BodyCalloutRegular,
             color = colorResource(R.color.text_primary)
         )
         Row(
-            modifier = Modifier.height(68.dp).padding(
-                top = 8.dp,
-                start = 20.dp,
-                end = 20.dp
-            ).fillMaxWidth(),
+            modifier = Modifier
+                .height(68.dp)
+                .padding(
+                    top = 10.dp,
+                    start = 20.dp,
+                    end = 20.dp
+                )
+                .fillMaxWidth(),
             verticalAlignment = Alignment.CenterVertically
         ) {
-            Box(
-                modifier = Modifier.height(48.dp).border(
-                    width = 1.dp,
-                    color = colorResource(R.color.shape_primary),
-                    shape = RoundedCornerShape(10.dp)
-                ).weight(1.0f, true).clickable(onClick = onNegativeClick),
-                contentAlignment = Alignment.Center
-            ) {
-                Text(
-                    text = cancelButtonText,
-                    color = colorResource(R.color.text_primary),
-                    fontSize = 17.sp
-                )
-            }
+            ButtonSecondary(
+                onClick = onNegativeClick,
+                size = ButtonSize.Large,
+                text = cancelButtonText,
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .weight(1f)
+            )
             Spacer(modifier = Modifier.width(10.dp))
-            Box(
-                modifier = Modifier.height(48.dp).background(
-                    color = colorResource(R.color.palette_system_red),
-                    shape = RoundedCornerShape(10.dp)
-                ).weight(1.0f, true).clickable(onClick = onPositiveClick),
-                contentAlignment = Alignment.Center
-            ) {
-                Text(
-                    text = actionButtonText,
-                    color = Color.White,
-                    fontSize = 17.sp,
-                    fontWeight = FontWeight.SemiBold
-                )
-                if (isInProgress) {
-                    CircularProgressIndicator(
-                        modifier = Modifier.align(Alignment.CenterEnd).padding(end = 20.dp).size(16.dp),
-                        color = Color.White,
-                        strokeWidth = 2.dp
-                    )
-                }
-            }
+            ButtonWarning(
+                onClick = onPositiveClick,
+                size = ButtonSize.Large,
+                text = actionButtonText,
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .weight(1f)
+            )
         }
     }
 }
@@ -219,13 +215,13 @@ fun Announcement(
         ) {
             Column {
                 Text(
-                    style = MaterialTheme.typography.h2,
                     text = title,
                     modifier = Modifier.padding(
                         top = 24.dp,
                         start = 20.dp,
                         end = 20.dp
                     ),
+                    style = HeadlineHeading,
                     color = colorResource(R.color.text_primary)
                 )
                 Text(
@@ -235,52 +231,37 @@ fun Announcement(
                         start = 20.dp,
                         end = 20.dp
                     ),
+                    style = BodyCalloutRegular,
                     color = colorResource(R.color.text_primary)
                 )
                 Row(
-                    modifier = Modifier.height(68.dp).padding(
-                        top = 8.dp,
-                        start = 20.dp,
-                        end = 20.dp
-                    ).fillMaxWidth(),
+                    modifier = Modifier
+                        .height(68.dp)
+                        .padding(
+                            top = 8.dp,
+                            start = 20.dp,
+                            end = 20.dp
+                        )
+                        .fillMaxWidth(),
                     verticalAlignment = Alignment.CenterVertically
                 ) {
-                    Card(
-                        modifier = Modifier.height(48.dp).weight(1.0f, true),
+                    ButtonSecondary(
+                        text = stringResource(R.string.back),
                         onClick = onBackClicked,
-                        shape = RoundedCornerShape(10.dp),
-                        border = BorderStroke(
-                            width = 1.dp,
-                            color = colorResource(R.color.shape_primary)
-                        ),
-                        elevation = 0.dp,
-                        backgroundColor = Color.Transparent
-                    ) {
-                        Box(Modifier.wrapContentSize(Alignment.Center)) {
-                            Text(
-                                text = stringResource(R.string.back),
-                                color = colorResource(R.color.text_primary),
-                                fontSize = 17.sp
-                            )
-                        }
-                    }
+                        size = ButtonSize.Large,
+                        modifier = Modifier
+                            .fillMaxWidth()
+                            .weight(1.0f)
+                    )
                     Spacer(modifier = Modifier.width(10.dp))
-                    Card(
-                        modifier = Modifier.height(48.dp).weight(1.0f, true),
+                    ButtonPrimary(
+                        text = stringResource(R.string.next),
                         onClick = onNextClicked,
-                        backgroundColor = colorResource(R.color.glyph_accent),
-                        shape = RoundedCornerShape(10.dp),
-                        elevation = 0.dp
-                    ) {
-                        Box(Modifier.wrapContentSize(Alignment.Center)) {
-                            Text(
-                                text = stringResource(R.string.next),
-                                color = Color.White,
-                                fontSize = 17.sp,
-                                fontWeight = FontWeight.SemiBold
-                            )
-                        }
-                    }
+                        size = ButtonSize.Large,
+                        modifier = Modifier
+                            .fillMaxWidth()
+                            .weight(1.0f)
+                    )
                 }
                 Spacer(modifier = Modifier.height(10.dp))
             }
diff --git a/core-ui/src/main/res/layout/view_dataview_info.xml b/core-ui/src/main/res/layout/view_dataview_info.xml
index 34607eee24..cdaf46f99a 100644
--- a/core-ui/src/main/res/layout/view_dataview_info.xml
+++ b/core-ui/src/main/res/layout/view_dataview_info.xml
@@ -36,8 +36,8 @@
 
     <com.anytypeio.anytype.core_ui.views.ButtonSecondarySmall
         android:id="@+id/button"
-        android:layout_width="118dp"
-        android:layout_height="48dp"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
         android:layout_marginTop="16dp"
         android:layout_marginBottom="16dp"
         tools:text="Create object"
diff --git a/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/about/AboutAppScreen.kt b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/about/AboutAppScreen.kt
index add258fdd5..8475ca9f1e 100644
--- a/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/about/AboutAppScreen.kt
+++ b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/about/AboutAppScreen.kt
@@ -11,10 +11,10 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.anytypeio.anytype.core_ui.foundation.Dragger
+import com.anytypeio.anytype.core_ui.views.BodyRegular
+import com.anytypeio.anytype.core_ui.views.Title1
 import com.anytypeio.anytype.ui_settings.R
 
 @Composable
@@ -38,8 +38,7 @@ fun AboutAppScreen(
         ) {
             Text(
                 text = stringResource(R.string.about),
-                fontWeight = FontWeight.Bold,
-                fontSize = 28.sp,
+                style = Title1,
                 color = colorResource(R.color.text_primary)
             )
         }
@@ -54,7 +53,7 @@ fun AboutAppScreen(
             Box(modifier = Modifier.weight(1.0f, true)) {
                 Text(
                     text = stringResource(R.string.app_version),
-                    fontSize = 17.sp,
+                    style = BodyRegular,
                     color = colorResource(R.color.text_secondary)
                 )
             }
@@ -64,7 +63,7 @@ fun AboutAppScreen(
             ) {
                 Text(
                     text = version,
-                    fontSize = 17.sp,
+                    style = BodyRegular,
                     color = colorResource(R.color.text_primary)
                 )
             }
@@ -80,7 +79,7 @@ fun AboutAppScreen(
             Box(modifier = Modifier.weight(1.0f, true)) {
                 Text(
                     text = stringResource(R.string.library),
-                    fontSize = 17.sp,
+                    style = BodyRegular,
                     color = colorResource(R.color.text_secondary)
                 )
             }
@@ -90,7 +89,7 @@ fun AboutAppScreen(
             ) {
                 Text(
                     text = libraryVersion,
-                    fontSize = 17.sp,
+                    style = BodyRegular,
                     color = colorResource(R.color.text_primary)
                 )
             }
@@ -106,7 +105,7 @@ fun AboutAppScreen(
             Box(modifier = Modifier.weight(1.0f, true)) {
                 Text(
                     text = stringResource(R.string.user_id),
-                    fontSize = 17.sp,
+                    style = BodyRegular,
                     color = colorResource(R.color.text_secondary)
                 )
             }
@@ -116,7 +115,7 @@ fun AboutAppScreen(
             ) {
                 Text(
                     text = anytypeId,
-                    fontSize = 17.sp,
+                    style = BodyRegular,
                     color = colorResource(R.color.text_primary)
                 )
             }
diff --git a/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/account/AccountAndDataScreen.kt b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/account/AccountAndDataScreen.kt
index 4913abba66..78289fc2d7 100644
--- a/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/account/AccountAndDataScreen.kt
+++ b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/account/AccountAndDataScreen.kt
@@ -48,6 +48,9 @@ import com.anytypeio.anytype.core_ui.foundation.Divider
 import com.anytypeio.anytype.core_ui.foundation.Dragger
 import com.anytypeio.anytype.core_ui.foundation.Option
 import com.anytypeio.anytype.core_ui.foundation.noRippleClickable
+import com.anytypeio.anytype.core_ui.views.BodyRegular
+import com.anytypeio.anytype.core_ui.views.Caption1Regular
+import com.anytypeio.anytype.core_ui.views.Title1
 import com.anytypeio.anytype.presentation.profile.ProfileIconView
 import com.anytypeio.anytype.ui_settings.R
 import com.anytypeio.anytype.ui_settings.main.NameBlock
@@ -105,19 +108,19 @@ fun AccountAndDataScreen(
             Divider()
         }
         Section(stringResource(R.string.account))
-        Action(
-            name = stringResource(R.string.delete_account),
-            color = colorResource(R.color.text_primary),
-            onClick = onDeleteAccountClicked
-        )
-        Divider()
         ActionWithProgressBar(
             name = stringResource(R.string.log_out),
-            color = colorResource(R.color.palette_dark_red),
+            color = colorResource(R.color.text_primary),
             onClick = onLogoutClicked,
             isInProgress = isLogoutInProgress
         )
         Divider()
+        Action(
+            name = stringResource(R.string.delete_account),
+            color = colorResource(R.color.palette_dark_red),
+            onClick = onDeleteAccountClicked
+        )
+        Divider()
         Box(Modifier.height(54.dp))
     }
 }
@@ -132,12 +135,12 @@ fun Section(name: String) {
     ) {
         Text(
             text = name,
-            fontSize = 13.sp,
             modifier = Modifier.padding(
                 start = 20.dp,
                 bottom = 8.dp
             ),
-            color = colorResource(R.color.text_secondary)
+            color = colorResource(R.color.text_secondary),
+            style = Caption1Regular
         )
     }
 }
@@ -199,7 +202,7 @@ fun Action(
         Text(
             text = name,
             color = color,
-            fontSize = 17.sp,
+            style = BodyRegular,
             modifier = Modifier.padding(
                 start = 20.dp
             )
@@ -224,7 +227,7 @@ fun ActionWithProgressBar(
         Text(
             text = name,
             color = color,
-            fontSize = 17.sp,
+            style = BodyRegular,
             modifier = Modifier.padding(
                 start = 20.dp
             )
@@ -345,10 +348,10 @@ fun NameBlock(
 }
 
 @Composable
-fun ProfileNameBlock(modifier: Modifier = Modifier) {
+fun ProfileNameBlock() {
     Text(
         text = stringResource(R.string.account_and_data),
-        style = MaterialTheme.typography.h3,
+        style = Title1,
         color = colorResource(id = R.color.text_primary)
     )
 }
diff --git a/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/appearance/AppearanceScreen.kt b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/appearance/AppearanceScreen.kt
index 555d1f33ef..b847201d13 100644
--- a/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/appearance/AppearanceScreen.kt
+++ b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/appearance/AppearanceScreen.kt
@@ -47,6 +47,8 @@ import com.anytypeio.anytype.core_ui.foundation.Divider
 import com.anytypeio.anytype.core_ui.foundation.Dragger
 import com.anytypeio.anytype.core_ui.foundation.Option
 import com.anytypeio.anytype.core_ui.foundation.Toolbar
+import com.anytypeio.anytype.core_ui.views.Caption1Medium
+import com.anytypeio.anytype.core_ui.views.Caption2Regular
 import com.anytypeio.anytype.ui_settings.R
 
 
@@ -83,8 +85,8 @@ fun AppearanceScreen(
                 .padding(top = 18.dp, bottom = 12.dp),
             textAlign = TextAlign.Center,
             text = stringResource(R.string.mode),
-            style = MaterialTheme.typography.body2,
-            color = colorResource(com.anytypeio.anytype.core_ui.R.color.text_secondary),
+            style = Caption1Medium,
+            color = colorResource(R.color.text_secondary),
         )
         Row(
             modifier = Modifier
@@ -251,8 +253,8 @@ fun ModeNameText(
 ) {
     Text(
         text = stringResource(id = id),
-        style = MaterialTheme.typography.caption,
-        color = colorResource(com.anytypeio.anytype.core_ui.R.color.text_secondary),
+        style = Caption2Regular,
+        color = colorResource(R.color.text_secondary),
         modifier = Modifier.padding(top = 4.dp)
     )
 }
diff --git a/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/MainSettingScreen.kt b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/MainSettingScreen.kt
index 6342e2d957..e289c73482 100644
--- a/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/MainSettingScreen.kt
+++ b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/MainSettingScreen.kt
@@ -29,6 +29,7 @@ import com.anytypeio.anytype.core_ui.foundation.Arrow
 import com.anytypeio.anytype.core_ui.foundation.Divider
 import com.anytypeio.anytype.core_ui.foundation.Dragger
 import com.anytypeio.anytype.core_ui.foundation.Option
+import com.anytypeio.anytype.core_ui.views.BodyRegular
 import com.anytypeio.anytype.presentation.profile.ProfileIconView
 import com.anytypeio.anytype.presentation.settings.MainSettingsViewModel
 import com.anytypeio.anytype.ui_settings.R
@@ -217,10 +218,11 @@ fun AccountOption(
 
         Text(
             text = text,
-            color = colorResource(com.anytypeio.anytype.core_ui.R.color.text_primary),
+            color = colorResource(R.color.text_primary),
             modifier = Modifier.padding(
                 start = 12.dp
-            )
+            ),
+            style = BodyRegular
         )
         Box(
             modifier = Modifier.weight(1.0f, true),
diff --git a/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/Views.kt b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/Views.kt
index 273b0b6aee..02d6bbc4c7 100644
--- a/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/Views.kt
+++ b/ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/Views.kt
@@ -14,7 +14,6 @@ import androidx.compose.foundation.text.BasicTextField
 import androidx.compose.foundation.text.KeyboardActions
 import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.material.ExperimentalMaterialApi
-import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
 import androidx.compose.material.TextFieldDefaults
 import androidx.compose.runtime.Composable
@@ -29,15 +28,15 @@ import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.painterResource
-import androidx.compose.ui.text.TextStyle
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.input.ImeAction
 import androidx.compose.ui.text.input.KeyboardType
 import androidx.compose.ui.text.input.VisualTransformation
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import coil.compose.rememberAsyncImagePainter
 import com.anytypeio.anytype.core_ui.foundation.noRippleClickable
+import com.anytypeio.anytype.core_ui.views.Caption1Regular
+import com.anytypeio.anytype.core_ui.views.HeadlineHeading
+import com.anytypeio.anytype.core_ui.views.Title1
 import com.anytypeio.anytype.emojifier.Emojifier
 import com.anytypeio.anytype.presentation.spaces.SpaceIconView
 import com.anytypeio.anytype.ui_settings.R
@@ -48,7 +47,7 @@ fun Section(modifier: Modifier = Modifier, title: String) {
         modifier = modifier,
         text = title,
         color = colorResource(id = R.color.text_secondary),
-        fontSize = 13.sp
+        style = Caption1Regular
     )
 }
 
@@ -65,8 +64,8 @@ fun NameBlock(
     Column(modifier = modifier.padding(start = 20.dp)) {
         Text(
             text = "Name",
-            color = colorResource(id = R.color.text_secondary),
-            fontSize = 13.sp
+            style = Caption1Regular,
+            color = colorResource(id = R.color.text_secondary)
         )
         SettingsTextField(
             value = nameValue.value,
@@ -87,7 +86,7 @@ fun NameBlock(
 fun SpaceNameBlock() {
     Text(
         text = "Space",
-        style = MaterialTheme.typography.h3,
+        style = Title1,
         color = colorResource(id = R.color.text_primary)
     )
 }
@@ -168,11 +167,7 @@ fun SettingsTextField(
         onValueChange = onValueChange,
         enabled = true,
         readOnly = false,
-        textStyle = TextStyle(
-            fontSize = 22.sp,
-            fontWeight = FontWeight.SemiBold,
-            color = colorResource(id = R.color.text_primary)
-        ),
+        textStyle = HeadlineHeading.copy(color = colorResource(id = R.color.text_primary)),
         cursorBrush = SolidColor(colorResource(id = R.color.orange)),
         visualTransformation = visualTransformation,
         keyboardOptions = KeyboardOptions(