diff --git a/app/src/main/res/values-night/colors.xml b/app/src/main/res/values-night/colors.xml
index 1e42df329..b43bb4459 100644
--- a/app/src/main/res/values-night/colors.xml
+++ b/app/src/main/res/values-night/colors.xml
@@ -35,6 +35,13 @@
     <color name="sync_disconnected_icon_fill_normal_theme">@color/sync_disconnected_icon_fill_dark_theme</color>
     <color name="sync_disconnected_background_normal_theme">@color/sync_disconnected_background_dark_theme</color>
     <color name="swipe_delete_background_normal_theme">@color/swipe_delete_background_dark_theme</color>
+    <color name="onboarding_card_background_start_gradient_normal_theme">@color/onboarding_card_background_start_gradient_dark_theme</color>
+    <color name="onboarding_card_background_end_gradient_normal_theme">@color/onboarding_card_background_end_gradient_dark_theme</color>
+    <color name="onboarding_card_button_normal_theme">@color/onboarding_card_button_dark_theme</color>
+    <color name="onboarding_card_finish_button_normal_theme">@color/onboarding_card_finish_button_dark_theme</color>
+    <color name="onboarding_finish_button_text_normal_theme">@color/primary_text_dark_theme</color>
+    <color name="onboarding_illustration_selected_normal_theme">@color/onboarding_illustration_selected_dark_theme</color>
+    <color name="onboarding_illustration_deselected_normal_theme">@color/onboarding_illustration_deselected_dark_theme</color>
 
     <!-- Tab tray -->
     <color name="tab_tray_item_text_normal_theme">@color/tab_tray_item_text_dark_theme</color>
@@ -52,7 +59,4 @@
 
     <!-- Reader View colors -->
     <color name="mozac_feature_readerview_text_color">@color/primary_text_dark_theme</color>
-
-    <!-- Onboarding colors -->
-    <color name="onboarding_card_icon">@color/accent_dark_theme</color>
 </resources>
diff --git a/app/src/main/res/values/attrs.xml b/app/src/main/res/values/attrs.xml
index 649088be0..4efcac268 100644
--- a/app/src/main/res/values/attrs.xml
+++ b/app/src/main/res/values/attrs.xml
@@ -43,6 +43,13 @@
     <attr name="syncDisconnected" format="reference" />
     <attr name="syncDisconnectedBackground" format="reference" />
     <attr name="swipeDeleteBackground" format="reference" />
+    <attr name="onboardingDarkGradientStartBackground" format="reference" />
+    <attr name="onboardingDarkGradientEndBackground" format="reference" />
+    <attr name="onboardingActionButtonBackground" format="reference" />
+    <attr name="onboardingFinishButtonBackground" format="reference" />
+    <attr name="onboardingFinishButtonText" format="reference" />
+    <attr name="onboardingSelected" format="reference"/>
+    <attr name="onboardingDeselected" format="reference"/>
 
     <!-- Tab tray -->
     <attr name="tabTrayItemText" format="reference"/>
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
index 5210f6fb9..b3813fbd3 100644
--- a/app/src/main/res/values/colors.xml
+++ b/app/src/main/res/values/colors.xml
@@ -52,6 +52,10 @@
     <color name="sync_disconnected_icon_fill_light_theme">#C45A27</color>
     <color name="sync_disconnected_background_light_theme">#FFFDE2</color>
     <color name="swipe_delete_background_light_theme">#E0E0E6</color>
+    <color name="onboarding_card_button_light_theme">#F0F0F4</color>
+    <color name="onboarding_card_finish_button_light_theme">@color/accent_light_theme</color>
+    <color name="onboarding_illustration_selected_light_theme">@color/accent_bright_light_theme</color>
+    <color name="onboarding_illustration_deselected_light_theme">#9915141A</color>
 
     <!-- Tab Tray -->
     <color name="tab_tray_item_text_light_theme">@color/ink_80</color>
@@ -92,6 +96,12 @@
     <color name="sync_disconnected_icon_fill_dark_theme">#FFF36E</color>
     <color name="sync_disconnected_background_dark_theme">#5B5846</color>
     <color name="swipe_delete_background_dark_theme">#4A4A55</color>
+    <color name="onboarding_card_background_start_gradient_dark_theme">@color/accent_bright_dark_theme</color>
+    <color name="onboarding_card_background_end_gradient_dark_theme">@color/accent_high_contrast_dark_theme</color>
+    <color name="onboarding_card_button_dark_theme">#4A4A55</color>
+    <color name="onboarding_card_finish_button_dark_theme">@color/accent_high_contrast_dark_theme</color>
+    <color name="onboarding_illustration_selected_dark_theme">@color/accent_dark_theme</color>
+    <color name="onboarding_illustration_deselected_dark_theme">#99FBFBFE</color>
 
     <!-- Tab Tray -->
     <color name="tab_tray_item_text_dark_theme">@color/light_grey_05</color>
@@ -129,7 +139,14 @@
     <color name="menu_category_private_theme">@color/primary_text_private_theme</color>
     <color name="sync_disconnected_icon_fill_private_theme">#C45A27</color>
     <color name="sync_disconnected_background_private_theme">#5B5846</color>
-    <color name="swipe_delete_background_private_theme">#312A65</color>
+    <color name="swipe_delete_background_private_theme">@color/accent_light_theme</color>
+    <color name="onboarding_card_background_start_gradient_private_theme">#7542E5</color>
+    <color name="onboarding_card_background_end_gradient_private_theme">#B833E1</color>
+    <color name="onboarding_card_button_private_theme">@color/accent_light_theme</color>
+    <color name="onboarding_card_finish_button_private_theme">#F0F0F4</color>
+    <color name="onboarding_finish_button_text_private_theme">@color/accent_light_theme</color>
+    <color name="onboarding_illustration_selected_private_theme">@color/accent_private_theme</color>
+    <color name="onboarding_illustration_deselected_private_theme">@color/onboarding_illustration_deselected_dark_theme</color>
 
     <!-- Tab Tray -->
     <color name="tab_tray_item_text_private_theme">@color/light_grey_05</color>
@@ -167,6 +184,13 @@
     <color name="sync_disconnected_icon_fill_normal_theme">@color/sync_disconnected_icon_fill_light_theme</color>
     <color name="sync_disconnected_background_normal_theme">@color/sync_disconnected_background_light_theme</color>
     <color name="swipe_delete_background_normal_theme">@color/swipe_delete_background_light_theme</color>
+    <color name="onboarding_card_background_start_gradient_normal_theme">@color/onboarding_card_background_start_gradient_dark_theme</color>
+    <color name="onboarding_card_background_end_gradient_normal_theme">@color/onboarding_card_background_end_gradient_dark_theme</color>
+    <color name="onboarding_card_button_normal_theme">@color/onboarding_card_button_light_theme</color>
+    <color name="onboarding_card_finish_button_normal_theme">@color/onboarding_card_finish_button_light_theme</color>
+    <color name="onboarding_finish_button_text_normal_theme">@color/primary_text_dark_theme</color>
+    <color name="onboarding_illustration_selected_normal_theme">@color/onboarding_illustration_selected_light_theme</color>
+    <color name="onboarding_illustration_deselected_normal_theme">@color/onboarding_illustration_deselected_light_theme</color>
 
     <!-- Tab tray -->
     <color name="tab_tray_item_text_normal_theme">@color/tab_tray_item_text_light_theme</color>
@@ -266,7 +290,6 @@
     <color name="onboarding_card_primary_text_dark">#FFFFFF</color>
     <color name="onboarding_card_button_background_dark">#F9F9FB</color>
     <color name="onboarding_card_button_text_dark">#312A65</color>
-    <color name="onboarding_card_icon">@color/accent_bright_light_theme</color>
 
     <!-- Share UI -->
     <color name="default_share_background">#E3E2E3</color>
diff --git a/app/src/main/res/values/styles.xml b/app/src/main/res/values/styles.xml
index c9e60539e..c60e3728e 100644
--- a/app/src/main/res/values/styles.xml
+++ b/app/src/main/res/values/styles.xml
@@ -66,6 +66,13 @@
         <item name="syncDisconnected">@color/sync_disconnected_icon_fill_normal_theme</item>
         <item name="syncDisconnectedBackground">@color/sync_disconnected_background_normal_theme</item>
         <item name="swipeDeleteBackground">@color/swipe_delete_background_normal_theme</item>
+        <item name="onboardingDarkGradientStartBackground">@color/onboarding_card_background_start_gradient_normal_theme</item>
+        <item name="onboardingDarkGradientEndBackground">@color/onboarding_card_background_end_gradient_normal_theme</item>
+        <item name="onboardingActionButtonBackground">@color/onboarding_card_button_normal_theme</item>
+        <item name="onboardingFinishButtonBackground">@color/onboarding_card_finish_button_normal_theme</item>
+        <item name="onboardingFinishButtonText">@color/onboarding_finish_button_text_normal_theme</item>
+        <item name="onboardingSelected">@color/onboarding_illustration_selected_normal_theme</item>
+        <item name="onboardingDeselected">@color/onboarding_illustration_deselected_normal_theme</item>
 
         <item name="tabTrayItemText">@color/tab_tray_item_text_normal_theme</item>
         <item name="tabTrayItemUrl">@color/tab_tray_item_url_normal_theme</item>
@@ -97,6 +104,10 @@
         <item name="buttonBarPositiveButtonStyle">@style/DialogButtonStyleLight</item>
     </style>
 
+    <style name="Switch.Colored" parent="Theme.AppCompat">
+        <item name="colorControlActivated">?attr/onboardingSelected</item>
+    </style>
+
     <style name="DialogStyleDark" parent="BaseDialogStyle">
         <item name="buttonBarNegativeButtonStyle">@style/DialogButtonStyleDark</item>
         <item name="buttonBarPositiveButtonStyle">@style/DialogButtonStyleDark</item>
@@ -177,6 +188,13 @@
         <item name="syncDisconnected">@color/sync_disconnected_icon_fill_private_theme</item>
         <item name="syncDisconnectedBackground">@color/sync_disconnected_background_private_theme</item>
         <item name="swipeDeleteBackground">@color/swipe_delete_background_private_theme</item>
+        <item name="onboardingDarkGradientStartBackground">@color/onboarding_card_background_start_gradient_private_theme</item>
+        <item name="onboardingDarkGradientEndBackground">@color/onboarding_card_background_end_gradient_private_theme</item>
+        <item name="onboardingActionButtonBackground">@color/onboarding_card_button_private_theme</item>
+        <item name="onboardingFinishButtonBackground">@color/onboarding_card_finish_button_private_theme</item>
+        <item name="onboardingFinishButtonText">@color/onboarding_finish_button_text_private_theme</item>
+        <item name="onboardingSelected">@color/onboarding_illustration_selected_private_theme</item>
+        <item name="onboardingDeselected">@color/onboarding_illustration_deselected_private_theme</item>
 
         <!-- Tab Tray -->
         <item name="tabTrayItemText">@color/tab_tray_item_text_private_theme</item>
@@ -227,7 +245,7 @@
 
     <!-- Ideally we should consolidate this with NeutralButton in the future -->
     <style name="NeutralOnboardingButton" parent="NeutralButton">
-        <item name="backgroundTint">?neutralFaded</item>
+        <item name="backgroundTint">?onboardingActionButtonBackground</item>
         <item name="android:textColor">?primaryText</item>
     </style>
 
@@ -242,6 +260,12 @@
         <item name="android:textColor">?contrastText</item>
     </style>
 
+    <style name="FinishOnboardingButton" parent="NeutralButton">
+        <item name="backgroundTint">?onboardingFinishButtonBackground</item>
+        <item name="android:textColor">?onboardingFinishButtonText</item>
+    </style>
+
+
     <style name="search_pill" parent="Widget.AppCompat.Button.Borderless">
         <item name="android:layout_width">wrap_content</item>
         <item name="android:layout_height">32dp</item>
@@ -404,12 +428,17 @@
 
     <style name="OnboardingCardLight">
         <item name="android:background">@drawable/onboarding_card_background_light</item>
-        <item name="android:padding">16dp</item>
         <item name="android:layout_marginBottom">16dp</item>
+        <item name="android:elevation">5dp</item>
     </style>
 
-    <style name="OnboardingCardDark" parent="OnboardingCardLight">
+    <style name="OnboardingCardLightWithPadding" parent="OnboardingCardLight">
+        <item name="android:padding">16dp</item>
+    </style>
+
+    <style name="OnboardingCardDark" parent="OnboardingCardLightWithPadding">
         <item name="android:background">@drawable/onboarding_card_background_dark</item>
+        <item name="android:elevation">0dp</item>
     </style>
 
     <style name="SearchShortcutsLabelStyle">
diff --git a/mozilla-lint-rules/src/main/java/org/mozilla/fenix/lintrules/ButtonStyleXmlDetector.kt b/mozilla-lint-rules/src/main/java/org/mozilla/fenix/lintrules/ButtonStyleXmlDetector.kt
index 1b7851793..ceac3222d 100644
--- a/mozilla-lint-rules/src/main/java/org/mozilla/fenix/lintrules/ButtonStyleXmlDetector.kt
+++ b/mozilla-lint-rules/src/main/java/org/mozilla/fenix/lintrules/ButtonStyleXmlDetector.kt
@@ -1,3 +1,7 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
 package org.mozilla.fenix.lintrules
 
 import com.android.SdkConstants
@@ -59,4 +63,4 @@ class ButtonStyleXmlDetector : ResourceXmlDetector() {
             message = ERROR_MESSAGE
         )
     }
-}
\ No newline at end of file
+}