diff --git a/.storybook/public/index.css b/.storybook/public/index.css
index 12c2ab80e32b..8ace4b240684 100644
--- a/.storybook/public/index.css
+++ b/.storybook/public/index.css
@@ -1,24 +1,28 @@
 .search-field *, .sidebar-item, .search-result-item--label {
-    color: #fff !important;
+    color: #E7ECE9 !important;
 }
 
 .sidebar-subheading *, .search-result-item {
-    color: #fff;
+    color: #E7ECE9;
 }
 
 a.sidebar-item > svg {
     color: #03d47c;
 }
 
+a.sidebar-item[data-selected="true"], a.sidebar-item[data-selected="true"]:focus, a.sidebar-item[data-selected="true"]:hover {
+    background: #1A3D32;
+}
+
 .search-result-item--label span {
-    color: #ffffffaa !important;
+    color: #E7ECE9aa !important;
 }
 
 #panel-tab-content :is(input:checked ~ span:last-of-type, input:not(:checked) ~ span:first-of-type) {
-    background: #ff7101;
-    color: #fff;
+    background: #03D47C;
+    color: #E7ECE9;
 }
 
 .sidebar-container {
-    background: #0b1b34;
+    background: #07271f;
 }
diff --git a/.storybook/public/logo.png b/.storybook/public/logo.png
index f956ed3d2264..23c909e83f0b 100644
Binary files a/.storybook/public/logo.png and b/.storybook/public/logo.png differ
diff --git a/.storybook/public/logomark.svg b/.storybook/public/logomark.svg
index 095f92d9ec26..d1ca5ca84d06 100644
--- a/.storybook/public/logomark.svg
+++ b/.storybook/public/logomark.svg
@@ -1,15 +1,25 @@
-<svg width="445" height="100" viewBox="0 0 445 100" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M34.0003 73H66.0003V63.5H45.7003V54.6H63.0003V44.9H45.7003V36.4H66.0003V27H34.0003V73Z" fill="#FFFFFF"/>
-    <path d="M90.0003 50C90.0003 59.6 86.6003 68.4 81.0003 75.3L88.1003 82.4C95.5003 73.7 100 62.4 100 50C100 37.8 95.6003 26.6 88.4003 18L81.3003 25.1C86.7003 31.9 90.0003 40.6 90.0003 50Z" fill="#03D47C"/>
-    <path d="M75.3003 81C68.4003 86.6 59.6003 90 50.0003 90C40.6003 90 31.9003 86.7 25.1003 81.3L18.0003 88.4C26.7003 95.7 37.9003 100 50.0003 100C62.4003 100 73.7003 95.5 82.4003 88.1L75.3003 81Z" fill="#0185FF"/>
-    <path d="M19.3 75.7C13.5 68.7 10 59.8 10 50C10 27.9 27.9 10 50 10C59.8 10 68.7 13.5 75.7 19.3L82.8 12.2C74 4.6 62.5 0 50 0C22.4 0 0 22.4 0 50C0 62.5 4.6 74 12.2 82.8L19.3 75.7Z" fill="#FED607"/>
-    <path d="M132 74.972H165.956V64.7354H144.484V55.2478H162.71V44.7615H144.484V35.7732H165.956V25.5365H132V74.972Z" fill="#FFFFFF"/>
-    <path d="M233.118 35.7731C227.875 35.7731 224.38 37.2711 221.384 41.5156H221.134L219.636 36.7718H210.648V88.2047H222.382V71.9758H222.632C224.879 74.4726 228.125 75.7209 232.619 75.7209C243.105 75.7209 250.596 66.9824 250.596 56.2464V54.7483C250.596 43.0136 241.857 35.7731 233.118 35.7731ZM230.122 66.2333C224.63 66.2333 222.133 61.7392 222.133 55.747C222.133 50.0045 224.63 45.5104 230.122 45.5104C235.615 45.5104 238.112 50.2542 238.112 55.9967C238.112 61.7392 235.366 66.2333 230.122 66.2333Z" fill="#FFFFFF"/>
-    <path d="M290.793 54.7483C290.793 42.0149 281.805 35.7731 272.067 35.7731C261.082 35.7731 252.593 43.513 252.593 55.4973V56.7457C252.593 68.9797 261.831 76.2203 272.567 76.2203C281.305 76.2203 289.045 71.9758 290.793 63.2372H279.558C278.309 66.2333 275.812 67.232 272.816 67.232C267.823 67.232 265.076 63.7366 264.577 58.9928H290.543C290.543 57.9941 290.793 56.2464 290.793 54.7483ZM264.827 51.2529C265.326 47.2581 267.823 44.262 272.317 44.262C276.312 44.262 279.058 47.0084 279.058 51.2529H264.827Z" fill="#FFFFFF"/>
-    <path d="M315.512 35.7731C310.768 35.7731 307.023 37.5208 304.276 41.7653H304.027L302.529 36.7718H293.291V74.7222H305.275V52.7509C305.275 48.0071 307.522 45.5104 311.517 45.5104C314.763 45.5104 317.259 47.5078 317.259 52.7509V74.7222H329.244V49.2555C329.244 42.0149 324.999 35.7731 315.512 35.7731Z" fill="#FFFFFF"/>
-    <path d="M347.219 50.5039C345.222 50.0045 343.724 49.2555 343.724 47.0084C343.724 45.2607 344.972 44.0123 347.719 44.0123C350.715 44.0123 352.213 45.5104 352.213 48.0071H362.949V47.2581C362.949 39.2685 355.708 36.0228 347.469 36.0228C340.228 36.0228 331.989 39.0189 331.989 48.0071V48.5065C331.989 51.2529 332.988 53.7496 334.736 55.4974C338.481 59.2425 344.223 59.7418 348.218 60.7405C351.464 61.4895 352.213 62.9876 352.213 64.7353C352.213 66.9824 350.465 68.2307 347.719 68.2307C344.473 68.2307 342.475 66.483 342.226 62.7379H331.49V63.4869C331.989 72.7249 338.98 76.2203 347.719 76.2203C355.459 76.2203 363.947 72.7249 363.947 63.7366V62.7379C363.947 59.9915 362.949 57.4947 361.451 55.747C357.955 51.7522 351.963 51.2529 347.219 50.5039Z" fill="#FFFFFF"/>
-    <path d="M378.429 37.0217H366.444V74.9721H378.429V37.0217Z" fill="#FFFFFF"/>
-    <path d="M208.151 37.0217H194.918L188.676 46.5093L182.185 37.0217H168.702L181.436 54.7485L166.955 74.9721H180.187L188.177 63.4871L196.167 74.9721H209.899L195.168 54.4989L208.151 37.0217Z" fill="#FFFFFF"/>
-    <path d="M372.438 18.5456C368.443 18.5456 365.197 21.7913 365.197 25.7861C365.197 29.7809 368.443 33.0267 372.438 33.0267C376.433 33.0267 379.678 29.7809 379.678 25.7861C379.678 21.7913 376.433 18.5456 372.438 18.5456Z" fill="#FFFFFF"/>
-    <path d="M399.9 37.0215V35.7732C399.9 32.5274 402.147 29.2816 405.642 29.2816C406.142 29.2816 409.138 29.2816 409.138 29.2816V18.7953H404.893C394.657 19.045 387.916 26.7849 387.916 36.5222V37.0215H380.925V46.0098H387.916V74.7223H399.9V46.0098H407.64L417.627 72.2256L410.636 88.4544H423.12L444.342 37.0215H431.858L423.619 59.7419L416.129 37.0215H399.9Z" fill="#FFFFFF"/>
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 26.5.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 78 19" style="enable-background:new 0 0 78 19;" xml:space="preserve"
+	fill="#03D47C"
+>
+<g>
+	<polygon points="0,14 8.7,14 8.7,11.4 3.2,11.4 3.2,9.1 7.6,9.1 7.6,6.5 3.2,6.5 3.2,4.2 8.7,4.2 8.7,1.7 0,1.7 	"/>
+	<polygon points="19.4,4.4 15.6,4.4 14.4,6.7 13,4.4 9.1,4.4 12.3,9 8.9,14 12.7,14 14.2,11.4 15.7,14 19.6,14 16.2,9 	"/>
+	<path d="M25.4,4.1c-1.1,0-2,0.4-2.6,1.2v-1h-2.9V18H23v-4.7c0.6,0.6,1.4,1,2.4,1c2.5,0,4.3-2,4.3-5C29.7,6.1,28.1,4.1,25.4,4.1z
+		 M24.8,11.7c-1.2,0-1.9-0.9-1.9-2.5c0-1.6,0.7-2.5,1.9-2.5s1.9,0.9,1.9,2.5C26.6,10.8,25.9,11.7,24.8,11.7z"/>
+	<path d="M35.2,11.8c-1,0-1.7-0.5-1.8-1.9H40V9.5c0-3-1.7-5.3-4.9-5.3c-2.3,0-4.9,1.2-4.9,5c0,3.1,2,5,5.1,5c1.8,0,4.1-0.7,4.8-3.5
+		h-3.2C36.7,11.2,36.3,11.8,35.2,11.8z M35.1,6.4c0.9,0,1.5,0.5,1.6,1.6h-3.3C33.7,6.8,34.3,6.4,35.1,6.4z"/>
+	<path d="M46.1,4.1c-1.1,0-2,0.5-2.6,1.4V4.4h-2.9V14h3.1V8.6c0-1.3,0.7-1.9,1.5-1.9c0.9,0,1.5,0.4,1.5,1.8v5.4h3.1V8.4
+		C49.7,5.3,48.5,4.1,46.1,4.1z"/>
+	<path d="M61.1,0c-1,0-1.6,0.7-1.6,1.6c0,0.9,0.7,1.6,1.6,1.6c1,0,1.7-0.7,1.7-1.6C62.7,0.7,62.1,0,61.1,0z"/>
+	<rect x="59.6" y="4.4" width="3.1" height="9.6"/>
+	<path d="M55.5,8l-0.8-0.2c-0.8-0.2-1.1-0.5-1.1-0.9C53.6,6.4,54,6,54.8,6c0.9,0,1.4,0.3,1.4,1.2h2.7c-0.1-2-1.2-3.2-4.2-3.2
+		c-2.6,0-4.1,1-4.1,3.1c0,1.7,1.1,2.5,3.7,3l0.7,0.2c0.8,0.2,1.1,0.6,1.1,0.9c0,0.5-0.5,0.8-1.3,0.8c-1.1,0-1.6-0.4-1.7-1.3h-3
+		c0.2,2.3,1.8,3.5,4.6,3.5s4.5-1,4.5-3.2C59.2,9.4,58.1,8.6,55.5,8z"/>
+	<path d="M74.8,4.4l-1.7,5.9l-1.7-5.9h-4V4.1c0-0.8,0.6-1.6,1.5-1.6h0.4V0h-0.6c-2.7,0-4.5,1.9-4.5,4.3v0.1H63v2.8h1.2V14h3.1V7.2
+		h1.8l2.3,6.5l-0.4,1c-0.3,0.7-0.6,1-1.3,1c-0.3,0-0.7,0-1.1-0.1l-0.2,2.5c0.5,0.1,1,0.2,1.8,0.2c1.9,0,2.8-0.8,3.8-3.3l4-10.6H74.8
+		z"/>
+</g>
 </svg>
diff --git a/.storybook/theme.js b/.storybook/theme.js
index e33243058453..0867f6a830b5 100644
--- a/.storybook/theme.js
+++ b/.storybook/theme.js
@@ -2,14 +2,22 @@ import {create} from '@storybook/theming';
 import colors from '../src/styles/colors';
 
 export default create({
-    appBg: colors.dark,
-    barSelectedColor: colors.blue,
-    base: 'light',
-    brandTitle: 'Expensify UI Docs',
+    brandTitle: 'New Expensify UI Docs',
     brandImage: 'logomark.svg',
-    colorPrimary: colors.dark,
-    colorSecondary: colors.orange,
     fontBase: 'ExpensifyNeue-Regular',
     fontCode: 'monospace',
-    textInverseColor: colors.black,
+    base: 'dark',
+    appBg: colors.greenHighlightBackground,
+    colorPrimary: colors.greenDefaultButton,
+    colorSecondary: colors.green,
+    appContentBg: colors.greenAppBackground,
+    textColor: colors.white,
+    barTextColor: colors.white,
+    barSelectedColor: colors.green,
+    barBg: colors.greenAppBackground,
+    appBorderColor: colors.greenBorders,
+    inputBg: colors.greenHighlightBackground,
+    inputBorder: colors.greenBorders,
+    appBorderRadius: 8,
+    inputBorderRadius: 8,
 });