diff --git a/Habitica/res/layout/bottom_navigation_item.xml b/Habitica/res/layout/bottom_navigation_item.xml
index f5cd4e615..ab9e92b15 100644
--- a/Habitica/res/layout/bottom_navigation_item.xml
+++ b/Habitica/res/layout/bottom_navigation_item.xml
@@ -1,41 +1,63 @@
 <?xml version="1.0" encoding="utf-8"?>
 <merge xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
-    android:orientation="vertical"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
-    tools:parentTag="android.widget.LinearLayout"
+    tools:parentTag="android.widget.RelativeLayout"
     tools:background="@color/brand_100">
-<ImageView
-    android:id="@+id/icon_view"
-    android:layout_width="wrap_content"
-    android:layout_height="wrap_content"
-    tools:src="@drawable/icon_habits_selected"
-    android:layout_gravity="center"/>
+        <ImageView
+            android:id="@+id/icon_view"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            tools:src="@drawable/icon_habits_selected"
+            android:layout_gravity="center"
+            android:layout_alignParentTop="true"
+            android:layout_marginTop="6dp"
+            android:layout_centerHorizontal="true"/>
+        <TextView
+            android:id="@+id/title_view"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:textColor="@color/brand_500"
+            tools:text="@string/habits"
+            android:layout_gravity="center"
+            android:textSize="12sp"
+            android:letterSpacing="0.05"
+            android:fontFamily="@string/font_family_regular"
+            android:paddingStart="@dimen/spacing_small"
+            android:paddingEnd="@dimen/spacing_small"
+            android:layout_centerHorizontal="true"
+            android:layout_below="@id/icon_view"
+            />
+        <TextView
+            android:id="@+id/selected_title_view"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:textColor="@color/white"
+            tools:text="@string/habits"
+            android:layout_gravity="center"
+            android:textSize="12sp"
+            android:letterSpacing="0.05"
+            android:fontFamily="@string/font_family_medium"
+            android:paddingStart="@dimen/spacing_small"
+            android:paddingEnd="@dimen/spacing_small"
+            android:layout_centerHorizontal="true"
+            android:layout_below="@id/icon_view"
+            />
     <TextView
-        android:id="@+id/title_view"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:textColor="@color/brand_500"
-        tools:text="@string/habits"
-        android:layout_gravity="center"
-        android:textSize="12sp"
-        android:letterSpacing="0.05"
-        android:fontFamily="@string/font_family_regular"
-        android:paddingStart="@dimen/spacing_small"
-        android:paddingEnd="@dimen/spacing_small"
-        />
-    <TextView
-        android:id="@+id/selected_title_view"
+        android:id="@+id/badge"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
+        android:layout_alignParentTop="true"
+        android:layout_alignEnd="@id/icon_view"
+        android:minWidth="20dp"
+        android:gravity="center"
+        tools:text="10"
         android:textColor="@color/white"
-        tools:text="@string/habits"
-        android:layout_gravity="center"
-        android:textSize="12sp"
-        android:letterSpacing="0.05"
-        android:fontFamily="@string/font_family_medium"
-        android:paddingStart="@dimen/spacing_small"
-        android:paddingEnd="@dimen/spacing_small"
-        />
+        style="@style/Overline"
+        android:background="@drawable/badge_circle"
+        android:padding="3dp"
+        android:layout_marginEnd="-10dp"
+        android:visibility="invisible"
+        tools:visibility="visible"/>
 </merge>
\ No newline at end of file
diff --git a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/tasks/TasksFragment.kt b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/tasks/TasksFragment.kt
index f61981e7c..a75927170 100644
--- a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/tasks/TasksFragment.kt
+++ b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/fragments/tasks/TasksFragment.kt
@@ -233,13 +233,13 @@ class TasksFragment : BaseMainFragment() {
                     }
                     else -> ""
                 }
-                /*val tab = bottomNavigation?.id(id)
+                val tab = bottomNavigation?.tabWithId(id)
                 if (step.shouldDisplay()) {
-                    tab?.setBadgeCount(1)
+                    tab?.badgeCount = 1
                     activeTutorialFragments.add(taskType)
                 } else {
-                    tab?.removeBadge()
-                }*/
+                    tab?.badgeCount = 0
+                }
             }
             if (activeTutorialFragments.size == 1) {
                 val fragment = viewFragmentsDictionary?.get(indexForTaskType(activeTutorialFragments[0]))
diff --git a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/views/navigation/BottomNavigationItem.kt b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/views/navigation/BottomNavigationItem.kt
index d5393bf8d..1e31ab513 100644
--- a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/views/navigation/BottomNavigationItem.kt
+++ b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/views/navigation/BottomNavigationItem.kt
@@ -5,7 +5,7 @@ import android.graphics.PorterDuff
 import android.util.AttributeSet
 import android.view.View
 import android.widget.ImageView
-import android.widget.LinearLayout
+import android.widget.RelativeLayout
 import android.widget.TextView
 import androidx.core.content.ContextCompat
 import com.habitrpg.android.habitica.R
@@ -14,11 +14,12 @@ import com.habitrpg.android.habitica.ui.helpers.bindView
 
 class BottomNavigationItem @JvmOverloads constructor(
         context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
-) : LinearLayout(context, attrs, defStyleAttr) {
+) : RelativeLayout(context, attrs, defStyleAttr) {
 
     private val iconView: ImageView by bindView(R.id.icon_view)
     private val selectedTitleView: TextView by bindView(R.id.selected_title_view)
     private val titleView: TextView by bindView(R.id.title_view)
+    private val badge: TextView by bindView(R.id.badge)
 
     var isActive = false
     set(value) {
@@ -34,6 +35,17 @@ class BottomNavigationItem @JvmOverloads constructor(
         }
     }
 
+    var badgeCount: Int = 0
+    set(value) {
+        field = value
+        if (value == 0) {
+            badge.visibility = View.INVISIBLE
+        } else {
+            badge.visibility = View.VISIBLE
+            badge.text = value.toString()
+        }
+    }
+
     init {
         inflate(R.layout.bottom_navigation_item, true)
 
@@ -46,7 +58,6 @@ class BottomNavigationItem @JvmOverloads constructor(
             titleView.text = attributes.getString(R.styleable.BottomNavigationItem_title)
             selectedTitleView.text = attributes.getString(R.styleable.BottomNavigationItem_title)
         }
-        orientation = VERTICAL
     }
 
 }
\ No newline at end of file
diff --git a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/views/navigation/HabiticaBottomNavigationView.kt b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/views/navigation/HabiticaBottomNavigationView.kt
index 28b610ea3..e158f4a62 100644
--- a/Habitica/src/main/java/com/habitrpg/android/habitica/ui/views/navigation/HabiticaBottomNavigationView.kt
+++ b/Habitica/src/main/java/com/habitrpg/android/habitica/ui/views/navigation/HabiticaBottomNavigationView.kt
@@ -209,6 +209,16 @@ class HabiticaBottomNavigationView @JvmOverloads constructor(
         }
     }
 
+    fun tabWithId(id: Int): BottomNavigationItem? {
+        return when(id) {
+            R.id.tab_habits -> habitsTab
+            R.id.tab_dailies -> dailiesTab
+            R.id.tab_todos -> rewardsTab
+            R.id.tab_rewards -> todosTab
+            else -> null
+        }
+    }
+
     private fun updateItemSelection() {
         habitsTab.isActive = activeTaskType == Task.TYPE_HABIT
         dailiesTab.isActive = activeTaskType == Task.TYPE_DAILY