diff --git a/www/static/svg/arrow-step1-darkblue.svg b/www/static/svg/arrow-step1-darkblue.svg
new file mode 100644
index 0000000000..e058b7ad68
--- /dev/null
+++ b/www/static/svg/arrow-step1-darkblue.svg
@@ -0,0 +1,10 @@
+<svg width="129" height="32" viewBox="0 0 129 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2663_1822)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M116.821 0H2C0.89543 0 0 0.895431 0 2V16V30C0 31.1046 0.89543 32 2 32H116.821L129.056 16L116.821 0Z" fill="#2E7FFF"/>
+</g>
+<defs>
+<clipPath id="clip0_2663_1822">
+<rect width="129" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/www/static/svg/arrow-step1-grey.svg b/www/static/svg/arrow-step1-grey.svg
new file mode 100644
index 0000000000..aeccdeeee0
--- /dev/null
+++ b/www/static/svg/arrow-step1-grey.svg
@@ -0,0 +1,10 @@
+<svg width="129" height="32" viewBox="0 0 129 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2667_3468)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M116.821 0H2C0.89543 0 0 0.895431 0 2V16V30C0 31.1046 0.89543 32 2 32H116.821L129.056 16L116.821 0Z" fill="#EDEEF2"/>
+</g>
+<defs>
+<clipPath id="clip0_2667_3468">
+<rect width="129" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/www/static/svg/arrow-step1-lightblue.svg b/www/static/svg/arrow-step1-lightblue.svg
new file mode 100644
index 0000000000..bf2d6a8b18
--- /dev/null
+++ b/www/static/svg/arrow-step1-lightblue.svg
@@ -0,0 +1,10 @@
+<svg width="129" height="32" viewBox="0 0 129 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2663_1824)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M116.821 0H2C0.89543 0 0 0.895431 0 2V16V30C0 31.1046 0.89543 32 2 32H116.821L129.056 16L116.821 0Z" fill="#37B2FE"/>
+</g>
+<defs>
+<clipPath id="clip0_2663_1824">
+<rect width="129" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/www/static/svg/arrow-step1-white.svg b/www/static/svg/arrow-step1-white.svg
new file mode 100644
index 0000000000..7a51431691
--- /dev/null
+++ b/www/static/svg/arrow-step1-white.svg
@@ -0,0 +1,10 @@
+<svg width="129" height="32" viewBox="0 0 129 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2663_1798)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M116.821 0H2C0.89543 0 0 0.895431 0 2V16V30C0 31.1046 0.89543 32 2 32H116.821L129.056 16L116.821 0Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0_2663_1798">
+<rect width="129" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/www/static/svg/arrow-step2-darkblue.svg b/www/static/svg/arrow-step2-darkblue.svg
new file mode 100644
index 0000000000..8a3fa39b40
--- /dev/null
+++ b/www/static/svg/arrow-step2-darkblue.svg
@@ -0,0 +1,10 @@
+<svg width="141" height="32" viewBox="0 0 141 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2663_1859)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M128.112 0H0L11.8869 15.5444C12.0925 15.8133 12.0925 16.1867 11.8869 16.4556L0 32H128.112L140.347 16L128.112 0Z" fill="#2E7FFF"/>
+</g>
+<defs>
+<clipPath id="clip0_2663_1859">
+<rect width="140.35" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/www/static/svg/arrow-step2-grey.svg b/www/static/svg/arrow-step2-grey.svg
new file mode 100644
index 0000000000..ac92e87ca5
--- /dev/null
+++ b/www/static/svg/arrow-step2-grey.svg
@@ -0,0 +1,10 @@
+<svg width="141" height="32" viewBox="0 0 141 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2667_3470)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M128.112 0H0L11.8869 15.5444C12.0925 15.8133 12.0925 16.1867 11.8869 16.4556L0 32H128.112L140.347 16L128.112 0Z" fill="#EDEEF2"/>
+</g>
+<defs>
+<clipPath id="clip0_2667_3470">
+<rect width="140.35" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/www/static/svg/arrow-step2-lightblue.svg b/www/static/svg/arrow-step2-lightblue.svg
new file mode 100644
index 0000000000..640f3ac75f
--- /dev/null
+++ b/www/static/svg/arrow-step2-lightblue.svg
@@ -0,0 +1,10 @@
+<svg width="141" height="32" viewBox="0 0 141 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2663_1833)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M128.112 0H0L11.8869 15.5444C12.0925 15.8133 12.0925 16.1867 11.8869 16.4556L0 32H128.112L140.347 16L128.112 0Z" fill="#37B2FE"/>
+</g>
+<defs>
+<clipPath id="clip0_2663_1833">
+<rect width="140.35" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/www/static/svg/arrow-step2-white.svg b/www/static/svg/arrow-step2-white.svg
new file mode 100644
index 0000000000..ba4c48d807
--- /dev/null
+++ b/www/static/svg/arrow-step2-white.svg
@@ -0,0 +1,10 @@
+<svg width="141" height="32" viewBox="0 0 141 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2663_1861)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M128.112 0H0L11.8869 15.5444C12.0925 15.8133 12.0925 16.1867 11.8869 16.4556L0 32H128.112L140.347 16L128.112 0Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0_2663_1861">
+<rect width="140.35" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/www/static/svg/arrow-step3-darkblue.svg b/www/static/svg/arrow-step3-darkblue.svg
new file mode 100644
index 0000000000..71d32bcfa6
--- /dev/null
+++ b/www/static/svg/arrow-step3-darkblue.svg
@@ -0,0 +1,10 @@
+<svg width="133" height="32" viewBox="0 0 133 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2663_1848)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0L12.2353 16L0 32H131C132.105 32 133 31.1046 133 30V16V2C133 0.895431 132.105 0 131 0H0Z" fill="#2E7FFF"/>
+</g>
+<defs>
+<clipPath id="clip0_2663_1848">
+<rect width="133" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/www/static/svg/arrow-step3-grey.svg b/www/static/svg/arrow-step3-grey.svg
new file mode 100644
index 0000000000..729b217740
--- /dev/null
+++ b/www/static/svg/arrow-step3-grey.svg
@@ -0,0 +1,10 @@
+<svg width="133" height="32" viewBox="0 0 133 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2667_3466)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0L12.2353 16L0 32H131C132.105 32 133 31.1046 133 30V16V2C133 0.895431 132.105 0 131 0H0Z" fill="#EDEEF2"/>
+</g>
+<defs>
+<clipPath id="clip0_2667_3466">
+<rect width="133" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/www/static/svg/arrow-step3-lightblue.svg b/www/static/svg/arrow-step3-lightblue.svg
new file mode 100644
index 0000000000..29b78f2934
--- /dev/null
+++ b/www/static/svg/arrow-step3-lightblue.svg
@@ -0,0 +1,10 @@
+<svg width="133" height="32" viewBox="0 0 133 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2663_1850)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0L12.2353 16L0 32H131C132.105 32 133 31.1046 133 30V16V2C133 0.895431 132.105 0 131 0H0Z" fill="#37B2FE"/>
+</g>
+<defs>
+<clipPath id="clip0_2663_1850">
+<rect width="133" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/www/static/svg/arrow-step3-white.svg b/www/static/svg/arrow-step3-white.svg
new file mode 100644
index 0000000000..e561520ade
--- /dev/null
+++ b/www/static/svg/arrow-step3-white.svg
@@ -0,0 +1,10 @@
+<svg width="133" height="32" viewBox="0 0 133 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_2663_1841)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0 0L12.2353 16L0 32H131C132.105 32 133 31.1046 133 30V16V2C133 0.895431 132.105 0 131 0H0Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0_2663_1841">
+<rect width="133" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>