From c3acb372011ab94db4697cbca4426d680fcdc24c Mon Sep 17 00:00:00 2001
From: Brezo Cordero <8002881+brezocordero@users.noreply.github.com>
Date: Fri, 22 Mar 2024 15:50:49 -0500
Subject: [PATCH] Add product icons

business and starter are the same icon in the figma file

[MAILPOET-5906]
---
 .../_premium-tiers-page.scss                  | 18 +++++++
 .../assets/img/upgrade/1-starter-plan.svg     | 54 +++++++++++++++++++
 mailpoet/assets/img/upgrade/2-tier-1-plan.svg | 35 ++++++++++++
 .../assets/img/upgrade/3-business-plan.svg    | 54 +++++++++++++++++++
 mailpoet/views/upgrade_tiers.html             |  3 ++
 5 files changed, 164 insertions(+)
 create mode 100644 mailpoet/assets/img/upgrade/1-starter-plan.svg
 create mode 100644 mailpoet/assets/img/upgrade/2-tier-1-plan.svg
 create mode 100644 mailpoet/assets/img/upgrade/3-business-plan.svg

diff --git a/mailpoet/assets/css/src/components-plugin/_premium-tiers-page.scss b/mailpoet/assets/css/src/components-plugin/_premium-tiers-page.scss
index 5950a52986..6634af37b1 100644
--- a/mailpoet/assets/css/src/components-plugin/_premium-tiers-page.scss
+++ b/mailpoet/assets/css/src/components-plugin/_premium-tiers-page.scss
@@ -138,3 +138,21 @@
     padding: 0;
   }
 }
+
+.mailpoet-tiers-page-tier-header__icon {
+  background-repeat: no-repeat;
+  background-size: contain;
+  height: 40px;
+  &.free {
+    background-image: url('../../img/upgrade/1-starter-plan.svg');
+    width: 30.44px;
+  }
+  &.basic {
+    background-image: url('../../img/upgrade/2-tier-1-plan.svg');
+    width: 40.37px;
+  }
+  &.pro {
+    background-image: url('../../img/upgrade/3-business-plan.svg');
+    width: 30.44px;
+  }
+}
diff --git a/mailpoet/assets/img/upgrade/1-starter-plan.svg b/mailpoet/assets/img/upgrade/1-starter-plan.svg
new file mode 100644
index 0000000000..af128e9dbd
--- /dev/null
+++ b/mailpoet/assets/img/upgrade/1-starter-plan.svg
@@ -0,0 +1,54 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="31" height="40" viewBox="0 0 31 40" fill="none">
+  <path opacity="0.55" d="M16.9584 40.0001C22.4694 40.0001 26.937 39.272 26.937 38.3739C26.937 37.4758 22.4694 36.7478 16.9584 36.7478C11.4474 36.7478 6.97977 37.4758 6.97977 38.3739C6.97977 39.272 11.4474 40.0001 16.9584 40.0001Z" fill="#F5A278"/>
+  <path d="M18.7654 32.6325H14.3275V38.6374H18.7654V32.6325Z" fill="#3D60F2"/>
+  <path opacity="0.76" d="M18.7654 34.4597L14.3275 36.0267V32.6325H18.7654V34.4597Z" fill="#06035B"/>
+  <path d="M26.2037 32.7626H6.62491L5.05789 13.1838H27.7707L26.2037 32.7626Z" fill="#3D60F2"/>
+  <path d="M30.7712 13.3139H1.79324L16.3162 0.000198364L30.7712 13.3139Z" fill="#3D60F2"/>
+  <path opacity="0.76" d="M20.4911 25.6786C22.5975 25.6786 24.3051 23.971 24.3051 21.8645C24.3051 19.7581 22.5975 18.0505 20.4911 18.0505C18.3846 18.0505 16.677 19.7581 16.677 21.8645C16.677 23.971 18.3846 25.6786 20.4911 25.6786Z" fill="#06035B"/>
+  <path opacity="0.76" d="M5.25084 16.2378L27.9016 13.3137H5.18875L5.25084 16.2378Z" fill="#06035B"/>
+  <path opacity="0.51" d="M11.2226 32.7862H14.4749C15.4062 31.991 16.1531 31.0025 16.6637 29.8894C17.1743 28.7763 17.4363 27.5653 17.4316 26.3407C17.4316 26.1574 17.4316 25.9978 17.4316 25.8174C17.4363 25.0471 17.2319 24.2899 16.8402 23.6266C16.4884 23.026 15.9864 22.5274 15.3835 22.1795C14.7806 21.8317 14.0977 21.6467 13.4017 21.6427C12.3114 21.6598 11.2725 22.1092 10.5135 22.892C9.7545 23.6749 9.33744 24.7271 9.35404 25.8174C9.35404 25.9091 9.35404 25.9978 9.35404 26.0865L7.28439 25.8647L11.2226 32.7862ZM10.7111 27.2041C11.1431 27.1059 11.5671 26.9754 11.9795 26.8138C11.5597 27.5796 11.7312 28.0408 11.7312 28.0408L10.7111 27.2041Z" fill="#06035B"/>
+  <path d="M4.00837 30.5153L0.333282 37.0022C0.333282 37.0022 4.511 37.7857 7.13353 32.3011L4.00837 30.5153Z" fill="#FB8959"/>
+  <path d="M6.94701 32.7871C6.94701 32.7871 4.07908 32.8699 3.25418 31.8676L3.87212 30.7175L6.94701 32.7871Z" fill="#EF5F32"/>
+  <path d="M13.95 23.455C13.7017 25.2911 10.2247 25.8203 10.2247 25.8203L9.3377 24.6081C9.3377 24.5194 9.3377 24.4307 9.3377 24.339C9.3211 23.2487 9.73816 22.1965 10.4972 21.4136C11.2562 20.6308 12.2951 20.1814 13.3853 20.1643C14.0807 20.1677 14.7633 20.3518 15.3662 20.6986C15.969 21.0453 16.4713 21.5428 16.8239 22.1422C15.8866 22.0742 14.1452 22.1186 13.95 23.455Z" fill="url(#paint0_linear_1845_9969)"/>
+  <path d="M1.31733 23.7543L9.34754 24.6087L11.7128 26.5631C11.7128 26.5631 11.4911 25.9718 12.1563 25.0227C12.4668 24.5733 13.8564 24.044 13.9303 23.4557C14.1107 22.1193 15.8669 22.0749 16.8042 22.1488C17.1958 22.8122 17.4002 23.5694 17.3955 24.3397C17.3955 24.52 17.3955 24.6797 17.3955 24.863C17.3955 29.4754 13.7736 33.2185 9.30319 33.2185C4.83277 33.2185 1.24637 29.4754 1.24637 24.863C1.24597 24.4923 1.26968 24.1219 1.31733 23.7543Z" fill="url(#paint1_linear_1845_9969)"/>
+  <path d="M17.4304 24.3391C17.4304 24.3391 18.9974 23.2955 18.9974 23.0353C18.9974 22.7751 17.1702 23.0353 17.1702 23.0353L17.4304 24.3391Z" fill="#B5BAFE"/>
+  <path d="M1.27874 23.6472C1.25804 23.8748 1.24622 24.1054 1.24622 24.339C1.24622 28.088 4.16737 31.1393 7.7715 31.1393C11.0888 31.1393 13.8296 28.567 14.2436 25.226L1.27874 23.6472Z" fill="#F86937"/>
+  <path d="M16.2727 21.3528C16.2727 21.3528 12.7987 21.3528 11.9827 24.9273L12.781 25.0249C12.781 25.0249 15.912 22.4911 17.4288 25.2319C17.4288 25.2319 17.7274 22.8074 16.2727 21.3528Z" fill="#FF6008"/>
+  <path d="M15.214 23.165C15.5031 23.165 15.7374 22.9307 15.7374 22.6417C15.7374 22.3527 15.5031 22.1184 15.214 22.1184C14.925 22.1184 14.6907 22.3527 14.6907 22.6417C14.6907 22.9307 14.925 23.165 15.214 23.165Z" fill="#0A0851"/>
+  <path d="M11.3558 26.9802C11.3558 27.0068 11.3558 27.0364 11.3558 27.063C11.353 27.2627 11.4268 27.4559 11.562 27.6028C11.6973 27.7497 11.8837 27.8392 12.083 27.8529C12.2823 27.8665 12.4792 27.8033 12.6332 27.6761C12.7872 27.549 12.8866 27.3676 12.911 27.1694L11.3558 26.9802Z" fill="url(#paint2_linear_1845_9969)"/>
+  <path d="M10.9145 25.5046C10.9129 25.5321 10.9129 25.5598 10.9145 25.5874C10.9125 25.7868 10.9868 25.9794 11.1223 26.1257C11.2578 26.272 11.4442 26.3609 11.6432 26.3741C11.8421 26.3873 12.0386 26.3239 12.1923 26.1969C12.346 26.0698 12.4452 25.8887 12.4697 25.6908L10.9145 25.5046Z" fill="url(#paint3_linear_1845_9969)"/>
+  <path d="M9.08052 26.382C9.07899 26.4096 9.07899 26.4372 9.08052 26.4648C9.07856 26.5693 9.0972 26.6731 9.13537 26.7703C9.17354 26.8676 9.23049 26.9563 9.30298 27.0316C9.37546 27.1068 9.46206 27.167 9.55782 27.2088C9.65358 27.2505 9.75662 27.273 9.86107 27.2749C10.0521 27.2718 10.2355 27.1993 10.3769 27.0709C10.5184 26.9425 10.6083 26.767 10.6298 26.5772L9.08052 26.382Z" fill="url(#paint4_linear_1845_9969)"/>
+  <path d="M9.78064 28.0996C9.77917 28.1281 9.77917 28.1568 9.78064 28.1853C9.77862 28.3847 9.85299 28.5773 9.9885 28.7236C10.124 28.8699 10.3104 28.9588 10.5093 28.9721C10.7083 28.9853 10.9048 28.9219 11.0585 28.7948C11.2122 28.6678 11.3114 28.4867 11.3358 28.2888L9.78064 28.0996Z" fill="url(#paint5_linear_1845_9969)"/>
+  <path d="M8.1294 28.9424C8.12793 28.97 8.12793 28.9976 8.1294 29.0252C8.12654 29.2249 8.20033 29.4181 8.3356 29.565C8.47087 29.712 8.65732 29.8015 8.85658 29.8151C9.05583 29.8287 9.25274 29.7655 9.40676 29.6383C9.56079 29.5112 9.66022 29.3298 9.68459 29.1316L8.1294 28.9424Z" fill="url(#paint6_linear_1845_9969)"/>
+  <path d="M9.09601 32.5708C16.0737 32.2189 17.4189 25.0166 17.4189 25.1999C17.4189 29.8152 13.8089 33.2183 9.33846 33.2183C7.62848 33.2012 5.96748 32.645 4.59201 31.6289C3.21654 30.6129 2.19673 29.1887 1.67783 27.5593C2.92848 30.51 5.78163 32.7393 9.09601 32.5708Z" fill="white"/>
+  <defs>
+    <linearGradient id="paint0_linear_1845_9969" x1="16.3774" y1="20.4008" x2="12.0282" y2="22.8548" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FFF3E9"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+    <linearGradient id="paint1_linear_1845_9969" x1="475.549" y1="1316.48" x2="1359.88" y2="1316.48" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FFF3E9"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+    <linearGradient id="paint2_linear_1845_9969" x1="11.8348" y1="27.4266" x2="14.7678" y2="27.4266" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FCC9B2" stop-opacity="0"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+    <linearGradient id="paint3_linear_1845_9969" x1="344.529" y1="121.847" x2="326.875" y2="124.873" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FCC9B2" stop-opacity="0"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+    <linearGradient id="paint4_linear_1845_9969" x1="355.754" y1="128.039" x2="323.505" y2="128.039" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FCC9B2" stop-opacity="0"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+    <linearGradient id="paint5_linear_1845_9969" x1="344.739" y1="132.707" x2="327.06" y2="135.696" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FCC9B2" stop-opacity="0"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+    <linearGradient id="paint6_linear_1845_9969" x1="352.91" y1="136.072" x2="327.604" y2="136.072" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FCC9B2" stop-opacity="0"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+  </defs>
+</svg>
diff --git a/mailpoet/assets/img/upgrade/2-tier-1-plan.svg b/mailpoet/assets/img/upgrade/2-tier-1-plan.svg
new file mode 100644
index 0000000000..c017d07735
--- /dev/null
+++ b/mailpoet/assets/img/upgrade/2-tier-1-plan.svg
@@ -0,0 +1,35 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="41" height="40" viewBox="0 0 41 40" fill="none">
+  <g clip-path="url(#clip0_1845_9901)">
+    <path d="M34.394 9.73248C35.0538 6.04667 31.1929 2.27175 25.7702 1.30095C20.3476 0.330152 15.4168 2.5311 14.7569 6.21691C14.0971 9.90272 17.9581 13.6776 23.3807 14.6484C28.8033 15.6192 33.7341 13.4183 34.394 9.73248Z" fill="#5C64F7"/>
+    <path d="M31.7004 12.6459C31.978 11.0956 28.7706 9.22424 24.5365 8.46623C20.3024 7.70821 16.645 8.35054 16.3675 9.90091C16.0899 11.4513 19.2973 13.3226 23.5314 14.0806C27.7655 14.8386 31.4229 14.1963 31.7004 12.6459Z" fill="#0A0851"/>
+    <path d="M16.2483 10.5634L22.0851 22.7468L31.5814 13.3069" stroke="#0A0851" stroke-width="0.121834" stroke-miterlimit="10"/>
+    <path d="M13.0532 22.0519L7.20963 20.1364C7.20963 20.1364 9.43649 26.4741 15.0003 26.7967" fill="#F86937"/>
+    <path d="M13.4777 19.4596C13.4777 19.4596 13.6176 16.2174 16.6048 17.0883C19.1926 17.8419 18.509 20.1206 19.1926 22.0519C20.3794 25.3956 27.712 29.3846 27.712 29.3846C27.712 29.3846 21.9046 31.9972 16.7965 29.9915C14.3982 29.0439 13.9786 27.3833 13.1979 25.9619C13.1979 25.9619 12.2909 22.3723 13.4777 19.4596Z" fill="#F86937"/>
+    <path d="M13.9783 17.8239C13.9783 17.8239 13.8925 18.5955 15.0071 18.2525C16.1217 17.9096 17.4054 17.4809 18.0891 18.8504C18.7727 20.2199 17.6536 22.1106 15.332 21.506C13.0104 20.9013 13.0623 21.506 13.0623 21.506C13.0623 21.506 13.1142 19.3648 13.9783 17.8239Z" fill="#0A0851"/>
+    <path d="M18.3623 21.3096L27.6759 17.7381C27.6759 17.7381 25.704 27.2457 20.1628 26.1469C20.1628 26.1469 18.0668 25.6957 17.1891 24.1502C17.0455 23.892 16.9621 23.6047 16.945 23.3098C16.9279 23.0149 16.9776 22.7199 17.0903 22.4468C17.2031 22.1738 17.3761 21.9297 17.5963 21.7328C17.8166 21.5359 18.0784 21.3913 18.3623 21.3096Z" fill="#F86937"/>
+    <path opacity="0.4" d="M21.049 21.6594L25.2275 20.2853C25.2275 20.2853 24.6341 23.9359 21.3243 25.5468C21.0414 25.5245 20.7696 25.4271 20.5369 25.2648C19.1268 24.3375 19.4494 22.1738 21.049 21.6594Z" fill="#0A0851"/>
+    <path d="M14.1226 19.0602L9.94644 18.7263L13.4751 20.3463C13.4751 20.3463 14.0144 20.247 14.1226 19.0602Z" fill="#3539FA"/>
+    <path d="M16.6135 19.6807C16.93 19.6807 17.1866 19.4241 17.1866 19.1076C17.1866 18.7911 16.93 18.5345 16.6135 18.5345C16.297 18.5345 16.0404 18.7911 16.0404 19.1076C16.0404 19.4241 16.297 19.6807 16.6135 19.6807Z" fill="#3539FA"/>
+    <path d="M16.6202 19.3378C16.7423 19.3378 16.8413 19.2388 16.8413 19.1166C16.8413 18.9945 16.7423 18.8955 16.6202 18.8955C16.4981 18.8955 16.3991 18.9945 16.3991 19.1166C16.3991 19.2388 16.4981 19.3378 16.6202 19.3378Z" fill="white"/>
+    <path d="M13.2048 24.2833C13.1739 24.0555 13.1977 23.8236 13.2741 23.6067C13.3504 23.3899 13.4773 23.1943 13.6441 23.0361C13.8109 22.8779 14.0129 22.7616 14.2335 22.6968C14.454 22.632 14.6869 22.6205 14.9127 22.6633C14.9711 22.6723 15.0285 22.6867 15.0842 22.7062C17.566 23.7328 17.4825 30.3299 21.3361 30.5871C21.3361 30.5871 14.1795 32.0017 13.2048 24.2833Z" fill="url(#paint0_linear_1845_9901)"/>
+    <path opacity="0.4" d="M12.771 22.0203C12.3842 23.4918 12.5671 25.055 13.2832 26.3974C12.6762 25.7812 12.209 25.0415 11.9135 24.2285C11.618 23.4156 11.5011 22.5486 11.5707 21.6864L12.771 22.0203Z" fill="#0A0851"/>
+    <path d="M27.1747 29.1612L31.1659 31.1083L29.9972 32.7621L25.2299 28.7731" fill="#FF5502"/>
+    <path opacity="0.55" d="M26.2297 34.8265C26.2297 34.8265 19.4047 33.651 16.4671 35.5033C16.2821 35.5214 14.3553 35.7447 13.6604 36.8209H15.497C17.0312 36.5953 16.1197 37.6354 16.1197 37.6354C16.1197 37.6354 14.9352 38.7049 17.0222 38.9553C17.7148 39.0388 18.9151 37.9806 20.526 36.9653L24.3051 38.7049C24.3051 38.7049 26.0559 36.5998 24.4405 35.7289C23.881 35.1017 23.6531 35.553 24.1607 35.4875C25.1886 35.3082 26.2397 35.3082 27.2675 35.4875L29.9253 36.2073L30.7398 35.4853C30.7398 35.4853 29.6974 35.1604 26.2297 34.8265Z" fill="#F5A278"/>
+    <path d="M23.382 9.76474L22.1027 19.9108" stroke="#0A0851" stroke-width="0.121834" stroke-miterlimit="10"/>
+    <path opacity="0.7" d="M20.6949 1.43488C20.6949 1.43488 16.3314 3.60984 18.7546 9.06757L16.2118 10.6469C16.2118 10.6469 11.722 3.60984 20.6949 1.43488Z" fill="#0A0851"/>
+    <path opacity="0.5" d="M20.8077 1.59506C20.8077 1.59506 18.3259 3.62563 19.7044 8.83969L22.8856 8.59602C22.8856 8.59602 22.3126 2.29448 23.7881 1.32432C23.7994 1.32432 21.1529 0.505322 20.8077 1.59506Z" fill="#0A0851"/>
+    <path d="M18.1679 8.38619L19.3117 8.01843C19.3117 8.01843 18.4612 3.15859 20.7264 1.84549C20.3744 1.89738 16.4599 2.86303 18.1679 8.38619Z" fill="#7E9FFC"/>
+    <path d="M16.5119 9.30671L15.7403 9.85722C15.7403 9.85722 13.0938 7.94397 15.8463 3.86703C15.8463 3.86703 13.9782 7.32352 16.5119 9.30671Z" fill="#7E9FFC"/>
+    <path d="M22.2517 8.41327H23.0729C23.0729 8.41327 22.7638 3.44965 23.9957 2.05758C23.9957 2.05758 22.1479 1.46195 22.2517 8.41327Z" fill="#7E9FFC"/>
+    <path d="M16.3608 10.5544C16.3608 10.5544 15.2327 7.72738 24.7809 8.57796C25.4162 8.6343 26.0429 8.76299 26.649 8.96151C27.8493 9.34958 29.8348 10.0535 30.4214 10.6401C30.4214 10.6401 28.7067 7.72512 18.7614 7.89659C18.7614 7.89659 13.8767 9.01115 16.1036 10.6401" fill="#7E9FFC"/>
+  </g>
+  <defs>
+    <linearGradient id="paint0_linear_1845_9901" x1="13.1935" y1="26.6613" x2="21.3361" y2="26.6613" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FFF3E9"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+    <clipPath id="clip0_1845_9901">
+      <rect width="40.3362" height="40" fill="white" transform="translate(0.666656)"/>
+    </clipPath>
+  </defs>
+</svg>
diff --git a/mailpoet/assets/img/upgrade/3-business-plan.svg b/mailpoet/assets/img/upgrade/3-business-plan.svg
new file mode 100644
index 0000000000..af128e9dbd
--- /dev/null
+++ b/mailpoet/assets/img/upgrade/3-business-plan.svg
@@ -0,0 +1,54 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="31" height="40" viewBox="0 0 31 40" fill="none">
+  <path opacity="0.55" d="M16.9584 40.0001C22.4694 40.0001 26.937 39.272 26.937 38.3739C26.937 37.4758 22.4694 36.7478 16.9584 36.7478C11.4474 36.7478 6.97977 37.4758 6.97977 38.3739C6.97977 39.272 11.4474 40.0001 16.9584 40.0001Z" fill="#F5A278"/>
+  <path d="M18.7654 32.6325H14.3275V38.6374H18.7654V32.6325Z" fill="#3D60F2"/>
+  <path opacity="0.76" d="M18.7654 34.4597L14.3275 36.0267V32.6325H18.7654V34.4597Z" fill="#06035B"/>
+  <path d="M26.2037 32.7626H6.62491L5.05789 13.1838H27.7707L26.2037 32.7626Z" fill="#3D60F2"/>
+  <path d="M30.7712 13.3139H1.79324L16.3162 0.000198364L30.7712 13.3139Z" fill="#3D60F2"/>
+  <path opacity="0.76" d="M20.4911 25.6786C22.5975 25.6786 24.3051 23.971 24.3051 21.8645C24.3051 19.7581 22.5975 18.0505 20.4911 18.0505C18.3846 18.0505 16.677 19.7581 16.677 21.8645C16.677 23.971 18.3846 25.6786 20.4911 25.6786Z" fill="#06035B"/>
+  <path opacity="0.76" d="M5.25084 16.2378L27.9016 13.3137H5.18875L5.25084 16.2378Z" fill="#06035B"/>
+  <path opacity="0.51" d="M11.2226 32.7862H14.4749C15.4062 31.991 16.1531 31.0025 16.6637 29.8894C17.1743 28.7763 17.4363 27.5653 17.4316 26.3407C17.4316 26.1574 17.4316 25.9978 17.4316 25.8174C17.4363 25.0471 17.2319 24.2899 16.8402 23.6266C16.4884 23.026 15.9864 22.5274 15.3835 22.1795C14.7806 21.8317 14.0977 21.6467 13.4017 21.6427C12.3114 21.6598 11.2725 22.1092 10.5135 22.892C9.7545 23.6749 9.33744 24.7271 9.35404 25.8174C9.35404 25.9091 9.35404 25.9978 9.35404 26.0865L7.28439 25.8647L11.2226 32.7862ZM10.7111 27.2041C11.1431 27.1059 11.5671 26.9754 11.9795 26.8138C11.5597 27.5796 11.7312 28.0408 11.7312 28.0408L10.7111 27.2041Z" fill="#06035B"/>
+  <path d="M4.00837 30.5153L0.333282 37.0022C0.333282 37.0022 4.511 37.7857 7.13353 32.3011L4.00837 30.5153Z" fill="#FB8959"/>
+  <path d="M6.94701 32.7871C6.94701 32.7871 4.07908 32.8699 3.25418 31.8676L3.87212 30.7175L6.94701 32.7871Z" fill="#EF5F32"/>
+  <path d="M13.95 23.455C13.7017 25.2911 10.2247 25.8203 10.2247 25.8203L9.3377 24.6081C9.3377 24.5194 9.3377 24.4307 9.3377 24.339C9.3211 23.2487 9.73816 22.1965 10.4972 21.4136C11.2562 20.6308 12.2951 20.1814 13.3853 20.1643C14.0807 20.1677 14.7633 20.3518 15.3662 20.6986C15.969 21.0453 16.4713 21.5428 16.8239 22.1422C15.8866 22.0742 14.1452 22.1186 13.95 23.455Z" fill="url(#paint0_linear_1845_9969)"/>
+  <path d="M1.31733 23.7543L9.34754 24.6087L11.7128 26.5631C11.7128 26.5631 11.4911 25.9718 12.1563 25.0227C12.4668 24.5733 13.8564 24.044 13.9303 23.4557C14.1107 22.1193 15.8669 22.0749 16.8042 22.1488C17.1958 22.8122 17.4002 23.5694 17.3955 24.3397C17.3955 24.52 17.3955 24.6797 17.3955 24.863C17.3955 29.4754 13.7736 33.2185 9.30319 33.2185C4.83277 33.2185 1.24637 29.4754 1.24637 24.863C1.24597 24.4923 1.26968 24.1219 1.31733 23.7543Z" fill="url(#paint1_linear_1845_9969)"/>
+  <path d="M17.4304 24.3391C17.4304 24.3391 18.9974 23.2955 18.9974 23.0353C18.9974 22.7751 17.1702 23.0353 17.1702 23.0353L17.4304 24.3391Z" fill="#B5BAFE"/>
+  <path d="M1.27874 23.6472C1.25804 23.8748 1.24622 24.1054 1.24622 24.339C1.24622 28.088 4.16737 31.1393 7.7715 31.1393C11.0888 31.1393 13.8296 28.567 14.2436 25.226L1.27874 23.6472Z" fill="#F86937"/>
+  <path d="M16.2727 21.3528C16.2727 21.3528 12.7987 21.3528 11.9827 24.9273L12.781 25.0249C12.781 25.0249 15.912 22.4911 17.4288 25.2319C17.4288 25.2319 17.7274 22.8074 16.2727 21.3528Z" fill="#FF6008"/>
+  <path d="M15.214 23.165C15.5031 23.165 15.7374 22.9307 15.7374 22.6417C15.7374 22.3527 15.5031 22.1184 15.214 22.1184C14.925 22.1184 14.6907 22.3527 14.6907 22.6417C14.6907 22.9307 14.925 23.165 15.214 23.165Z" fill="#0A0851"/>
+  <path d="M11.3558 26.9802C11.3558 27.0068 11.3558 27.0364 11.3558 27.063C11.353 27.2627 11.4268 27.4559 11.562 27.6028C11.6973 27.7497 11.8837 27.8392 12.083 27.8529C12.2823 27.8665 12.4792 27.8033 12.6332 27.6761C12.7872 27.549 12.8866 27.3676 12.911 27.1694L11.3558 26.9802Z" fill="url(#paint2_linear_1845_9969)"/>
+  <path d="M10.9145 25.5046C10.9129 25.5321 10.9129 25.5598 10.9145 25.5874C10.9125 25.7868 10.9868 25.9794 11.1223 26.1257C11.2578 26.272 11.4442 26.3609 11.6432 26.3741C11.8421 26.3873 12.0386 26.3239 12.1923 26.1969C12.346 26.0698 12.4452 25.8887 12.4697 25.6908L10.9145 25.5046Z" fill="url(#paint3_linear_1845_9969)"/>
+  <path d="M9.08052 26.382C9.07899 26.4096 9.07899 26.4372 9.08052 26.4648C9.07856 26.5693 9.0972 26.6731 9.13537 26.7703C9.17354 26.8676 9.23049 26.9563 9.30298 27.0316C9.37546 27.1068 9.46206 27.167 9.55782 27.2088C9.65358 27.2505 9.75662 27.273 9.86107 27.2749C10.0521 27.2718 10.2355 27.1993 10.3769 27.0709C10.5184 26.9425 10.6083 26.767 10.6298 26.5772L9.08052 26.382Z" fill="url(#paint4_linear_1845_9969)"/>
+  <path d="M9.78064 28.0996C9.77917 28.1281 9.77917 28.1568 9.78064 28.1853C9.77862 28.3847 9.85299 28.5773 9.9885 28.7236C10.124 28.8699 10.3104 28.9588 10.5093 28.9721C10.7083 28.9853 10.9048 28.9219 11.0585 28.7948C11.2122 28.6678 11.3114 28.4867 11.3358 28.2888L9.78064 28.0996Z" fill="url(#paint5_linear_1845_9969)"/>
+  <path d="M8.1294 28.9424C8.12793 28.97 8.12793 28.9976 8.1294 29.0252C8.12654 29.2249 8.20033 29.4181 8.3356 29.565C8.47087 29.712 8.65732 29.8015 8.85658 29.8151C9.05583 29.8287 9.25274 29.7655 9.40676 29.6383C9.56079 29.5112 9.66022 29.3298 9.68459 29.1316L8.1294 28.9424Z" fill="url(#paint6_linear_1845_9969)"/>
+  <path d="M9.09601 32.5708C16.0737 32.2189 17.4189 25.0166 17.4189 25.1999C17.4189 29.8152 13.8089 33.2183 9.33846 33.2183C7.62848 33.2012 5.96748 32.645 4.59201 31.6289C3.21654 30.6129 2.19673 29.1887 1.67783 27.5593C2.92848 30.51 5.78163 32.7393 9.09601 32.5708Z" fill="white"/>
+  <defs>
+    <linearGradient id="paint0_linear_1845_9969" x1="16.3774" y1="20.4008" x2="12.0282" y2="22.8548" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FFF3E9"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+    <linearGradient id="paint1_linear_1845_9969" x1="475.549" y1="1316.48" x2="1359.88" y2="1316.48" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FFF3E9"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+    <linearGradient id="paint2_linear_1845_9969" x1="11.8348" y1="27.4266" x2="14.7678" y2="27.4266" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FCC9B2" stop-opacity="0"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+    <linearGradient id="paint3_linear_1845_9969" x1="344.529" y1="121.847" x2="326.875" y2="124.873" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FCC9B2" stop-opacity="0"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+    <linearGradient id="paint4_linear_1845_9969" x1="355.754" y1="128.039" x2="323.505" y2="128.039" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FCC9B2" stop-opacity="0"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+    <linearGradient id="paint5_linear_1845_9969" x1="344.739" y1="132.707" x2="327.06" y2="135.696" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FCC9B2" stop-opacity="0"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+    <linearGradient id="paint6_linear_1845_9969" x1="352.91" y1="136.072" x2="327.604" y2="136.072" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FCC9B2" stop-opacity="0"/>
+      <stop offset="1" stop-color="#FCC9B2"/>
+    </linearGradient>
+  </defs>
+</svg>
diff --git a/mailpoet/views/upgrade_tiers.html b/mailpoet/views/upgrade_tiers.html
index 245a2319e3..e1b41da2cd 100644
--- a/mailpoet/views/upgrade_tiers.html
+++ b/mailpoet/views/upgrade_tiers.html
@@ -29,6 +29,7 @@
       <div class="mailpoet-tiers-page-content__tier">
         <div class="mailpoet-tiers-page-tier-header">
           <div class="mailpoet-tiers-page-tier-header__title">
+            <div class="mailpoet-tiers-page-tier-header__icon free"></div>
             <h2 class="mailpoet-tiers-page-tier-header-label">
               <%= __('Free') %>
             </h2>
@@ -39,6 +40,7 @@
       <div class="mailpoet-tiers-page-content__tier">
         <div class="mailpoet-tiers-page-tier-header">
           <div class="mailpoet-tiers-page-tier-header__title">
+            <div class="mailpoet-tiers-page-tier-header__icon basic"></div>
             <h2 class="mailpoet-tiers-page-tier-header-label">
               <%= __('Basic') %>
             </h2>
@@ -54,6 +56,7 @@
         </div>
         <div class="mailpoet-tiers-page-tier-header">
           <div class="mailpoet-tiers-page-tier-header__title">
+            <div class="mailpoet-tiers-page-tier-header__icon pro"></div>
             <h2 class="mailpoet-tiers-page-tier-header-label">
               <%= __('Pro') %>
             </h2>