diff --git a/app/src/main/AndroidManifest.xml b/app/src/main/AndroidManifest.xml
index 3d93fae..17803f9 100644
--- a/app/src/main/AndroidManifest.xml
+++ b/app/src/main/AndroidManifest.xml
@@ -3,7 +3,8 @@
   xmlns:tools="http://schemas.android.com/tools"
   package="dev.baseio.discordjetpackcompose">
 
-  <uses-permission android:name="android.permission.INTERNET" />
+  <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
+    <uses-permission android:name="android.permission.INTERNET" />
 
   <application
     android:name=".DiscordApp"
diff --git a/app/src/main/java/dev/baseio/discordjetpackcompose/MainActivity.kt b/app/src/main/java/dev/baseio/discordjetpackcompose/MainActivity.kt
index e98bc38..71d8f8d 100644
--- a/app/src/main/java/dev/baseio/discordjetpackcompose/MainActivity.kt
+++ b/app/src/main/java/dev/baseio/discordjetpackcompose/MainActivity.kt
@@ -3,16 +3,24 @@ package dev.baseio.discordjetpackcompose
 import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Column
 import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Alignment.Companion.CenterHorizontally
+import androidx.compose.ui.Modifier
 import androidx.core.view.WindowCompat
 import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.rememberNavController
 import com.google.accompanist.insets.ProvideWindowInsets
+import com.google.accompanist.insets.statusBarsPadding
 import dagger.hilt.android.AndroidEntryPoint
 import dev.baseio.discordjetpackcompose.navigator.ComposeNavigator
 import dev.baseio.discordjetpackcompose.navigator.DiscordRoute
+import dev.baseio.discordjetpackcompose.ui.routes.dashboard.components.NetworkStateBar
 import dev.baseio.discordjetpackcompose.ui.routes.dashboard.dashboardRoute
 import dev.baseio.discordjetpackcompose.ui.routes.onboarding.onBoardingRoute
+import dev.baseio.discordjetpackcompose.ui.theme.DiscordColorProvider
 import dev.baseio.discordjetpackcompose.ui.theme.DiscordJetpackComposeTheme
 import javax.inject.Inject
 
@@ -36,14 +44,22 @@ class MainActivity : ComponentActivity() {
                 composeNavigator.handleNavigationCommands(navController)
             }
             DiscordJetpackComposeTheme {
-
                 ProvideWindowInsets(windowInsetsAnimationsEnabled = true) {
-                    NavHost(
-                        navController = navController,
-                        startDestination = DiscordRoute.OnBoarding.name,
+                    Column(
+                        modifier = Modifier.background(DiscordColorProvider.colors.background)
                     ) {
-                        onBoardingRoute(composeNavigator)
-                        dashboardRoute(composeNavigator)
+                        NetworkStateBar(
+                            modifier = Modifier
+                                .align(CenterHorizontally)
+                                .statusBarsPadding()
+                        )
+                        NavHost(
+                            navController = navController,
+                            startDestination = DiscordRoute.OnBoarding.name,
+                        ) {
+                            onBoardingRoute(composeNavigator)
+                            dashboardRoute(composeNavigator)
+                        }
                     }
                 }
             }
@@ -51,3 +67,5 @@ class MainActivity : ComponentActivity() {
     }
 }
 
+
+
diff --git a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/components/DiscordAppBar.kt b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/components/DiscordAppBar.kt
index 264c46d..7764700 100644
--- a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/components/DiscordAppBar.kt
+++ b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/components/DiscordAppBar.kt
@@ -4,7 +4,6 @@ import androidx.compose.foundation.layout.RowScope
 import androidx.compose.material.AppBarDefaults
 import androidx.compose.material.TopAppBar
 import androidx.compose.material.contentColorFor
-import androidx.compose.material.primarySurface
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
@@ -15,21 +14,21 @@ import dev.baseio.discordjetpackcompose.ui.theme.primarySurface
 
 @Composable
 fun DiscordAppBar(
-  modifier: Modifier = Modifier,
-  title: @Composable () -> Unit = {},
-  navigationIcon: @Composable (() -> Unit)? = null,
-  actions: @Composable RowScope.() -> Unit = {},
-  backgroundColor: Color = DiscordColorProvider.colors.primarySurface,
-  contentColor: Color = contentColorFor(backgroundColor),
-  elevation: Dp = AppBarDefaults.TopAppBarElevation,
+    modifier: Modifier = Modifier,
+    title: @Composable () -> Unit = {},
+    navigationIcon: @Composable (() -> Unit)? = null,
+    actions: @Composable RowScope.() -> Unit = {},
+    backgroundColor: Color = DiscordColorProvider.colors.primarySurface,
+    contentColor: Color = contentColorFor(backgroundColor),
+    elevation: Dp = AppBarDefaults.TopAppBarElevation,
 ) {
-  DiscordSurface(
-    color = backgroundColor,
-    contentColor = contentColor,
-    elevation = elevation
-  ) {
-    TopAppBar(
-      title, modifier, navigationIcon, actions, backgroundColor, contentColor, elevation
-    )
-  }
+    DiscordSurface(
+        color = backgroundColor,
+        contentColor = contentColor,
+        elevation = elevation
+    ) {
+        TopAppBar(
+            title, modifier, navigationIcon, actions, backgroundColor, contentColor, elevation
+        )
+    }
 }
\ No newline at end of file
diff --git a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/components/NetworkStateBar.kt b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/components/NetworkStateBar.kt
new file mode 100644
index 0000000..43d46a1
--- /dev/null
+++ b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/components/NetworkStateBar.kt
@@ -0,0 +1,303 @@
+package dev.baseio.discordjetpackcompose.ui.routes.dashboard.components
+
+import android.content.BroadcastReceiver
+import android.content.Context
+import android.content.Intent
+import android.content.IntentFilter
+import android.net.ConnectivityManager
+import android.net.Network
+import android.net.NetworkCapabilities
+import android.net.NetworkRequest
+import androidx.compose.animation.AnimatedVisibility
+import androidx.compose.animation.animateColorAsState
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.Icon
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.DisposableEffect
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.MutableState
+import androidx.compose.runtime.State
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.produceState
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.rotate
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.dp
+import dev.baseio.discordjetpackcompose.R
+import dev.baseio.discordjetpackcompose.ui.theme.DiscordColorProvider
+import dev.baseio.discordjetpackcompose.ui.theme.Typography
+import kotlinx.coroutines.ExperimentalCoroutinesApi
+import kotlinx.coroutines.channels.awaitClose
+import kotlinx.coroutines.delay
+import kotlinx.coroutines.flow.callbackFlow
+import kotlinx.coroutines.launch
+
+@Composable
+fun rememberAirplaneModeState(): Boolean {
+    val context = LocalContext.current
+    val airplaneMode = remember {
+        mutableStateOf(false)
+    }
+    DisposableEffect(context) {
+        val broadcast = object : BroadcastReceiver() {
+            override fun onReceive(context: Context?, intent: Intent?) {
+                val state: Boolean = intent?.getBooleanExtra("state", false) ?: return
+                airplaneMode.value = state
+            }
+        }
+        context.registerReceiver(broadcast, IntentFilter(Intent.ACTION_AIRPLANE_MODE_CHANGED))
+        onDispose {
+            context.unregisterReceiver(broadcast)
+        }
+    }
+    return airplaneMode.value
+}
+
+
+@Composable
+fun NetworkStateBar(
+    modifier: Modifier = Modifier,
+) {
+
+    val connection by connectivityState()
+    val isConnected by remember(key1 = connection) {
+        mutableStateOf(connection == ConnectionState.Available)
+    }
+
+    Row(
+        verticalAlignment = Alignment.Bottom,
+        horizontalArrangement = Arrangement.Center,
+        modifier = modifier
+            .fillMaxWidth()
+            .padding(top = 4.dp)
+    ) {
+        if (rememberAirplaneModeState()) {
+            Icon(
+                painter = painterResource(id = R.drawable.ic_airplanemode),
+                contentDescription = null,
+                modifier = Modifier.rotate(90f),
+                tint = DiscordColorProvider.colors.textPrimary
+            )
+            NetworkStateText { R.string.airplane_mode_is_active }
+        } else if (isConnected) {
+            ConnectingAnimation()
+        } else {
+            NoNetwork()
+            NetworkStateText { R.string.no_internet_status }
+        }
+    }
+}
+
+
+sealed class ConnectionState {
+    object Available : ConnectionState()
+    object Unavailable : ConnectionState()
+}
+
+
+@Composable
+fun ConnectingAnimation(
+    speed: Double = 0.5
+) {
+    val maxCounter = 3
+    var counter by remember {
+        mutableStateOf(0)
+    }
+
+    val scope = rememberCoroutineScope()
+
+    LaunchedEffect(key1 = speed, block = {
+        scope.launch {
+            while (true) {
+                delay(speed.times(500).toLong())
+                counter = if (counter == (maxCounter - 1)) 0 else counter + 1
+            }
+        }
+    })
+
+    var isVisible by remember {
+        mutableStateOf(true)
+    }
+
+    LaunchedEffect(
+        key1 = null,
+        block = {
+            scope.launch {
+                delay(3000)
+                isVisible = !isVisible
+            }
+        }
+    )
+
+    AnimatedVisibility(visible = isVisible) {
+        Row(
+            verticalAlignment = Alignment.Bottom
+        ) {
+            repeat(maxCounter) { index ->
+                Bars(counter = counter, index = index)
+            }
+            NetworkStateText { R.string.connecting }
+        }
+    }
+}
+
+@Composable
+fun NetworkStateText(textProvider: () -> Int) {
+    Text(
+        text = stringResource(id = textProvider()),
+        style = Typography.caption.copy(color = DiscordColorProvider.colors.textPrimary),
+        modifier = Modifier.padding(start = 4.dp)
+    )
+}
+
+@Composable
+fun Bars(
+    counter: Int,
+    index: Int
+) {
+    val colors by animateColorAsState(
+        targetValue = when (counter) {
+            index -> {
+                Color(0xFFA77C30)
+            }
+            (index - 1) -> {
+                Color(0xFF6E5A3F)
+            }
+            else -> {
+                Color(0xFF404047)
+            }
+        }
+    )
+    Box(
+        modifier = Modifier
+            .width(6.dp)
+            .height(
+                when (index) {
+                    0 -> 8.dp
+                    1 -> 12.dp
+                    2 -> 16.dp
+                    else -> 0.dp
+                }
+            )
+            .padding(end = 2.dp)
+            .background(colors, shape = RoundedCornerShape(3.dp))
+    )
+}
+
+@Composable
+fun NoNetwork() {
+    Row(verticalAlignment = Alignment.Bottom) {
+        NonAnimatedBar(height = 8.dp, color = Color(0xFFEC4345))
+        NonAnimatedBar(height = 12.dp, color = Color(0xFF36393F))
+        NonAnimatedBar(height = 16.dp, color = Color(0xFF36393F))
+    }
+}
+
+@Composable
+fun NonAnimatedBar(
+    height: Dp,
+    color: Color
+) {
+    Box(
+        modifier = Modifier
+            .width(6.dp)
+            .height(height)
+            .padding(end = 2.dp)
+            .background(color, shape = RoundedCornerShape(3.dp))
+    )
+}
+
+
+/**
+ * Network utility to get current state of internet connection
+ */
+val Context.currentConnectivityState: ConnectionState
+    get() {
+        val connectivityManager =
+            getSystemService(Context.CONNECTIVITY_SERVICE) as ConnectivityManager
+        return getCurrentConnectivityState(connectivityManager)
+    }
+
+
+private fun getCurrentConnectivityState(
+    connectivityManager: ConnectivityManager
+): ConnectionState {
+    val connected = connectivityManager.allNetworks.any { network ->
+        connectivityManager.getNetworkCapabilities(network)
+            ?.hasCapability(NetworkCapabilities.NET_CAPABILITY_INTERNET)
+            ?: false
+    }
+
+
+    return if (connected) {
+        ConnectionState.Available
+    } else {
+        ConnectionState.Unavailable
+    }
+}
+
+/**
+ * Network Utility to observe availability or unavailability of Internet connection
+ */
+@ExperimentalCoroutinesApi
+fun Context.observeConnectivityAsFlow() = callbackFlow {
+    val connectivityManager = getSystemService(Context.CONNECTIVITY_SERVICE) as ConnectivityManager
+
+    val callback = networkCallback { connectionState -> trySend(connectionState) }
+
+    val networkRequest = NetworkRequest.Builder()
+        .addCapability(NetworkCapabilities.NET_CAPABILITY_INTERNET)
+        .build()
+
+    connectivityManager.registerNetworkCallback(networkRequest, callback)
+
+    val currentState = getCurrentConnectivityState(connectivityManager)
+    trySend(currentState)
+
+    awaitClose {
+        connectivityManager.unregisterNetworkCallback(callback)
+    }
+}
+
+
+fun networkCallback(callback: (ConnectionState) -> Unit): ConnectivityManager.NetworkCallback {
+    return object : ConnectivityManager.NetworkCallback() {
+        override fun onAvailable(network: Network) {
+            callback(ConnectionState.Available)
+        }
+
+        override fun onLost(network: Network) {
+            callback(ConnectionState.Unavailable)
+        }
+    }
+}
+
+@ExperimentalCoroutinesApi
+@Composable
+fun connectivityState(): State<ConnectionState> {
+    val context = LocalContext.current
+
+    return produceState(initialValue = context.currentConnectivityState) {
+        context.observeConnectivityAsFlow().collect { value = it }
+    }
+}
+
+
diff --git a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/createServer/CreateServer.kt b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/createServer/CreateServer.kt
index 3df211b..04dee26 100644
--- a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/createServer/CreateServer.kt
+++ b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/createServer/CreateServer.kt
@@ -26,25 +26,28 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
-import com.google.accompanist.insets.statusBarsPadding
 import dev.baseio.discordjetpackcompose.R
 import dev.baseio.discordjetpackcompose.navigator.ComposeNavigator
 import dev.baseio.discordjetpackcompose.navigator.DiscordScreen
 import dev.baseio.discordjetpackcompose.ui.components.DiscordAppBar
 import dev.baseio.discordjetpackcompose.ui.components.DiscordScaffold
 import dev.baseio.discordjetpackcompose.ui.routes.onboarding.commonui.CenteredTitleSubtitle
+import dev.baseio.discordjetpackcompose.ui.theme.DiscordColorProvider
 import dev.baseio.discordjetpackcompose.ui.theme.Typography
-import dev.baseio.discordjetpackcompose.ui.theme.create_server_card_bottom_button_bg
-import dev.baseio.discordjetpackcompose.ui.theme.create_server_screen
+import dev.baseio.discordjetpackcompose.ui.theme.contentColorFor
+import dev.baseio.discordjetpackcompose.ui.theme.onboarding_button_grey
 import dev.baseio.discordjetpackcompose.ui.theme.white
 
 @Composable
 fun CreateServer(
     composeNavigator: ComposeNavigator
 ) {
+    val backgroundColor = DiscordColorProvider.colors.background
+    val serverCardBackgroundColor = DiscordColorProvider.colors.surface
+    val contentColor = DiscordColorProvider.colors.contentColorFor(backgroundColor)
+
     val scaffoldState = rememberScaffoldState()
     DiscordScaffold(
-        modifier = Modifier.statusBarsPadding(),
         scaffoldState = scaffoldState,
         topAppBar = {
             DiscordAppBar(
@@ -57,7 +60,7 @@ fun CreateServer(
                         )
                     }
                 },
-                backgroundColor = create_server_screen,
+                backgroundColor = backgroundColor,
                 elevation = 0.dp
             )
         }
@@ -66,7 +69,7 @@ fun CreateServer(
             modifier = Modifier
                 .fillMaxSize()
                 .padding(paddingValues)
-                .background(color = create_server_screen),
+                .background(color = backgroundColor),
             horizontalAlignment = Alignment.CenterHorizontally
         ) {
             CenteredTitleSubtitle(
@@ -77,7 +80,7 @@ fun CreateServer(
             LazyColumn(
                 modifier = Modifier
                     .fillMaxHeight(0.8f)
-                    .background(color = create_server_screen)
+                    .background(color = backgroundColor)
             ) {
                 items(1) {
                     CreateServerCard(
@@ -130,7 +133,7 @@ fun HaveAnInviteBottomCard(
             .padding(horizontal = 16.dp)
             .padding(bottom = 16.dp),
         shape = RoundedCornerShape(6.dp),
-        colors = ButtonDefaults.buttonColors(backgroundColor = create_server_card_bottom_button_bg)
+        colors = ButtonDefaults.buttonColors(backgroundColor = onboarding_button_grey)
     ) {
         Text(
             text = stringResource(R.string.have_an_invite_already),
diff --git a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/createServer/CreateServerCard.kt b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/createServer/CreateServerCard.kt
index 053e201..6767080 100644
--- a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/createServer/CreateServerCard.kt
+++ b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/createServer/CreateServerCard.kt
@@ -32,8 +32,8 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import dev.baseio.discordjetpackcompose.R
+import dev.baseio.discordjetpackcompose.ui.theme.DiscordColorProvider
 import dev.baseio.discordjetpackcompose.ui.theme.Typography
-import dev.baseio.discordjetpackcompose.ui.theme.create_server_card_bg
 
 @OptIn(ExperimentalMaterialApi::class)
 @Composable
@@ -47,7 +47,7 @@ fun CreateServerCard(
         modifier = Modifier
             .padding(horizontal = 16.dp, vertical = 6.dp),
         onClick = { onClick() },
-        color = create_server_card_bg
+        color = DiscordColorProvider.colors.surface
     ) {
         Row(
             modifier = Modifier
diff --git a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/friends/FriendsScreen.kt b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/friends/FriendsScreen.kt
index 63cccd3..761ef93 100644
--- a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/friends/FriendsScreen.kt
+++ b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/friends/FriendsScreen.kt
@@ -74,7 +74,7 @@ fun FriendsScreen(
                     )
                 )
             },
-                backgroundColor = create_server_screen,
+                backgroundColor = DiscordColorProvider.colors.background,
                 actions = {
                     Icon(
                         painter = painterResource(id = R.drawable.ic_chat_bubble),
diff --git a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/main/chatscreen/ChannelMemberScreen.kt b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/main/chatscreen/ChannelMemberScreen.kt
index 63c592c..6e18ddb 100644
--- a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/main/chatscreen/ChannelMemberScreen.kt
+++ b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/dashboard/main/chatscreen/ChannelMemberScreen.kt
@@ -68,7 +68,7 @@ fun ChannelMemberScreen(
             modifier = Modifier
                 .fillMaxWidth()
                 .height(1.dp)
-                .background(create_server_screen)
+                .background(DiscordColorProvider.colors.background)
         )
         ChannelMemberActions()
         InviteMembers(onInviteButtonClicked)
diff --git a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/onboarding/commonui/DiscordDialog.kt b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/onboarding/commonui/DiscordDialog.kt
index c94a4e5..3dad03e 100644
--- a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/onboarding/commonui/DiscordDialog.kt
+++ b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/onboarding/commonui/DiscordDialog.kt
@@ -26,12 +26,11 @@ import androidx.compose.ui.unit.sp
 import androidx.compose.ui.window.Dialog
 import androidx.compose.ui.window.DialogProperties
 import dev.baseio.discordjetpackcompose.R
+import dev.baseio.discordjetpackcompose.ui.theme.DiscordColorProvider
 import dev.baseio.discordjetpackcompose.ui.theme.DiscordDialogTypography
 import dev.baseio.discordjetpackcompose.ui.theme.DiscordJetpackComposeTheme
-import dev.baseio.discordjetpackcompose.ui.theme.discord_dialog_bg
-import dev.baseio.discordjetpackcompose.ui.theme.discord_dialog_button_bg
-import dev.baseio.discordjetpackcompose.ui.theme.discord_dialog_button_row_bg
-import dev.baseio.discordjetpackcompose.ui.theme.discord_dialog_cancel_button_text
+import dev.baseio.discordjetpackcompose.ui.theme.dialog_text_grey
+import dev.baseio.discordjetpackcompose.ui.theme.onboarding_button_blue
 import dev.baseio.discordjetpackcompose.ui.theme.white
 
 @Composable
@@ -39,12 +38,12 @@ fun DiscordDialog(
     modifier: Modifier = Modifier,
     show: Boolean,
     shape: Shape = RectangleShape,
-    backgroundColor: Color = discord_dialog_bg,
+    backgroundColor: Color = DiscordColorProvider.colors.background,
     titleTextProvider: () -> Int,
     subTitleTextProvider: () -> Int,
     properties: DialogProperties = DialogProperties(),
     onDismissRequest: () -> Unit,
-    buttonRowBackgroundColor: Color = discord_dialog_button_row_bg,
+    buttonRowBackgroundColor: Color = DiscordColorProvider.colors.surface,
     confirmActionButtonTextProvider: () -> Int,
     onClickCancelButton: () -> Unit,
     onClickConfirmActionButton: () -> Unit
@@ -147,7 +146,7 @@ fun DialogNegativeAction(
             style = TextStyle(
                 fontWeight = FontWeight.Black,
                 fontSize = 14.sp,
-                color = discord_dialog_cancel_button_text
+                color = dialog_text_grey
             )
         )
     }
@@ -161,7 +160,7 @@ fun DialogPositiveAction(
     Button(
         onClick = { onClickConfirmActionButton() },
         elevation = ButtonDefaults.elevation(2.dp),
-        colors = ButtonDefaults.buttonColors(backgroundColor = discord_dialog_button_bg),
+        colors = ButtonDefaults.buttonColors(backgroundColor = onboarding_button_blue),
         modifier = Modifier
             .padding(end = 10.dp)
             .padding(vertical = 6.dp)
diff --git a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/onboarding/screens/register/RegisterScreen.kt b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/onboarding/screens/register/RegisterScreen.kt
index 0d794e4..bcb5e93 100644
--- a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/onboarding/screens/register/RegisterScreen.kt
+++ b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/onboarding/screens/register/RegisterScreen.kt
@@ -32,7 +32,6 @@ import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.hilt.navigation.compose.hiltViewModel
-import com.google.accompanist.insets.statusBarsPadding
 import com.google.accompanist.systemuicontroller.rememberSystemUiController
 import dev.baseio.discordjetpackcompose.R
 import dev.baseio.discordjetpackcompose.entities.CountryEntity
@@ -70,7 +69,6 @@ fun RegisterScreen(
     val onSelectionChange = { type: RegistrationType -> selectedOption = type }
 
     DiscordScaffold(
-        modifier = Modifier.statusBarsPadding(),
         navigator = composeNavigator,
         scaffoldState = scaffoldState
     ) {
diff --git a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/onboarding/screens/welcome/WelcomeScreen.kt b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/onboarding/screens/welcome/WelcomeScreen.kt
index 1627f97..5bcddae 100644
--- a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/onboarding/screens/welcome/WelcomeScreen.kt
+++ b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/routes/onboarding/screens/welcome/WelcomeScreen.kt
@@ -1,5 +1,6 @@
 package dev.baseio.discordjetpackcompose.ui.routes.onboarding.screens.welcome
 
+import android.content.res.Configuration
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
@@ -8,22 +9,19 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.material.Button
-import androidx.compose.material.ButtonDefaults.buttonColors
+import androidx.compose.foundation.layout.width
 import androidx.compose.material.Icon
-import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.SideEffect
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.res.colorResource
+import androidx.compose.ui.platform.LocalConfiguration
 import androidx.compose.ui.res.painterResource
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import com.google.accompanist.insets.systemBarsPadding
 import com.google.accompanist.systemuicontroller.rememberSystemUiController
 import dev.baseio.discordjetpackcompose.R
 import dev.baseio.discordjetpackcompose.navigator.ComposeNavigator
@@ -31,7 +29,6 @@ import dev.baseio.discordjetpackcompose.navigator.DiscordScreen
 import dev.baseio.discordjetpackcompose.ui.routes.onboarding.commonui.CenteredTitleSubtitle
 import dev.baseio.discordjetpackcompose.ui.routes.onboarding.commonui.OnboardingScreensButton
 import dev.baseio.discordjetpackcompose.ui.theme.DiscordColorProvider
-import dev.baseio.discordjetpackcompose.ui.theme.onboarding_button_blue
 import dev.baseio.discordjetpackcompose.ui.theme.onboarding_button_grey
 
 @Composable
@@ -47,17 +44,20 @@ fun WelcomeScreen(composeNavigator: ComposeNavigator) {
     Column(
         Modifier
             .fillMaxSize()
-            .systemBarsPadding()
             .background(DiscordColorProvider.colors.background),
-        verticalArrangement = Arrangement.SpaceAround
+        verticalArrangement = Arrangement.SpaceAround,
+        horizontalAlignment = Alignment.CenterHorizontally
     ) {
 
         Header()
-        Image(
-            painter = painterResource(id = R.drawable.welcomelogo),
-            contentDescription = null,
-            modifier = Modifier.padding(32.dp)
-        )
+
+        if (LocalConfiguration.current.orientation == Configuration.ORIENTATION_PORTRAIT) {
+            Image(
+                painter = painterResource(id = R.drawable.welcomelogo),
+                contentDescription = null,
+                modifier = Modifier.height((LocalConfiguration.current.screenHeightDp / 2.5).dp)
+            )
+        }
 
         CenteredTitleSubtitle(
             modifier = Modifier.padding(horizontal = 40.dp),
@@ -68,12 +68,12 @@ fun WelcomeScreen(composeNavigator: ComposeNavigator) {
 
         Column(Modifier.fillMaxWidth(), horizontalAlignment = Alignment.CenterHorizontally) {
             OnboardingScreensButton(
-                buttonTextProvider = {R.string.register},
+                buttonTextProvider = { R.string.register },
                 onClick = { composeNavigator.navigate(DiscordScreen.Register.name) }
             )
             Spacer(modifier = Modifier.size(2.dp))
             OnboardingScreensButton(
-                buttonTextProvider = {R.string.login},
+                buttonTextProvider = { R.string.login },
                 buttonBackgroundColor = onboarding_button_grey,
                 onClick = { composeNavigator.navigate(DiscordScreen.Login.name) }
             )
@@ -92,7 +92,7 @@ private fun Header() {
             painter = painterResource(id = R.drawable.discord_welcome_header_light),
             contentDescription = "",
             modifier = Modifier
-                .fillMaxWidth(0.5f),
+                .width(200.dp),
             tint = DiscordColorProvider.colors.brand
         )
     }
diff --git a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/theme/Color.kt b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/theme/Color.kt
index 4a0f227..eeedec7 100644
--- a/app/src/main/java/dev/baseio/discordjetpackcompose/ui/theme/Color.kt
+++ b/app/src/main/java/dev/baseio/discordjetpackcompose/ui/theme/Color.kt
@@ -764,49 +764,7 @@ val xbox = Color(0xFF107c10)
 val xbox_500 = Color(0xFF107c10)
 val youtube = Color(0xFFcb2120)
 val youtube_500 = Color(0xFFcb2120)
-
-val create_server_screen
-    @Composable get() = if (isSystemInDarkTheme()) {
-        Color(0xFF373840)
-    } else {
-        Color(0xFFFEFFFE)
-    }
-
-val create_server_card_bg
-    @Composable get() = if (isSystemInDarkTheme()) {
-        Color(0xFF2B2B2E)
-    } else {
-        Color(0xFFEBEDEF)
-    }
-
-val create_server_card_bottom_button_bg
-    @Composable get() = if (isSystemInDarkTheme()) {
-        Color(0xFF4E535D)
-    } else {
-        Color(0xFF747F8C)
-    }
-
-
-val discord_dialog_bg
-    @Composable get() = if (isSystemInDarkTheme()) {
-        Color(0xFF36393E)
-    } else {
-        Color(0xFFFEFFFE)
-    }
-
-val discord_dialog_button_row_bg
-    @Composable get() = if (isSystemInDarkTheme()) {
-        Color(0xFF303037)
-    } else {
-        Color(0xFFF9F8F9)
-    }
-val discord_dialog_cancel_button_text
-    @Composable get() = if (isSystemInDarkTheme()) {
-        Color(0xFFA7A8AA)
-    } else {
-        Color(0xFF4F5761)
-    }
-val discord_dialog_button_bg = Color(0xFF5864F1)
+val dialog_text_grey = Color(0xFFA7A8AA)
 
 val discord_icon_button
     @Composable get() = if (isSystemInDarkTheme()) {
diff --git a/app/src/main/res/drawable/ic_airplanemode.xml b/app/src/main/res/drawable/ic_airplanemode.xml
new file mode 100644
index 0000000..484a470
--- /dev/null
+++ b/app/src/main/res/drawable/ic_airplanemode.xml
@@ -0,0 +1,5 @@
+<vector android:height="16dp" android:tint="#000000"
+    android:viewportHeight="24" android:viewportWidth="24"
+    android:width="16dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="@android:color/white" android:pathData="M22,16v-2l-8.5,-5V3.5C13.5,2.67 12.83,2 12,2s-1.5,0.67 -1.5,1.5V9L2,14v2l8.5,-2.5V19L8,20.5L8,22l4,-1l4,1l0,-1.5L13.5,19v-5.5L22,16z"/>
+</vector>
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index ac20199..b4723e3 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -102,6 +102,9 @@
     <string name="server_emoji_nitro_benefit_msg">Use anywhere with nitro</string>
     <string name="emoji_count">%s EMOJIS</string>
     <string name="server_no_emojis">NO EMOJI</string>
+    <string name="connecting">Connecting…</string>
+    <string name="no_internet_status">Network connectivity limited or unavailable.</string>
+    <string name="airplane_mode_is_active">Airplane mode is active.</string>
     <string name="search_sheet_filter_dialog_title">Filter Options</string>
     <string name="search_sheet_filter_dialog_cancel_btn_txt">CANCEL</string>
     <string name="search_sheet_topbar_placeholder">Where would you like to go?</string>