diff --git a/src/constants/tint-mapper.js b/src/constants/tint-mapper.js
new file mode 100644
index 000000000..dc978dc38
--- /dev/null
+++ b/src/constants/tint-mapper.js
@@ -0,0 +1,76 @@
+const tintMap = {
+    backglass: [
+        // Blue Shade
+        { name: "blue shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BlueTint.svg" },
+        { name: "blue shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BrownTint.svg" },
+        { name: "blue shade, gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GrayTint.svg" },
+        { name: "blue shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GreenTint.svg" },
+        { name: "blue shade", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-NoTint.svg" },
+
+        // Brown Shade
+        { name: "brown shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BrownShade-BrownTint.svg" },
+
+        // Gray Shade
+        { name: "gray shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BlueTint.svg" },
+        { name: "gray shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BrownTint.svg" },
+        { name: "gray shade, gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GrayTint.svg" },
+        { name: "gray shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GreenTint.svg" },
+
+        // Green Shade
+        { name: "green shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BlueTint.svg" },
+        { name: "green shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BrownTint.svg" },
+        { name: "green shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-GreenTint.svg" },
+
+        // Tints Only
+        { name: "blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BlueTint.svg" },
+        { name: "brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BrownTint.svg" },
+        { name: "dark brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkBrownTint.svg" },
+        { name: "dark gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkGrayTint.svg" },
+        { name: "gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GrayTint.svg" },
+        { name: "green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GreenTint.svg" },
+        { name: "gray tint privacy", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-Privacy.svg" },
+
+        // No shade or tint
+        { name: "no shade, no tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-NoTint.svg" }, // ???
+    ],
+
+    windhshield: [
+        // Blue Shade
+        { name: "blue shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BlueTint.svg" },
+        { name: "blue shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BrownTint.svg" },
+        { name: "blue shade, gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GrayTint.svg" },
+        { name: "blue shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GreenTint.svg" },
+        { name: "blue shade", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-NoTint.svg" },
+
+        // Brown Shade
+        { name: "brown shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BrownShade-BrownTint.svg" },
+
+        // Gray Shade
+        { name: "gray shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BlueTint.svg" },
+        { name: "gray shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BrownTint.svg" },
+        { name: "gray shade, gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GrayTint.svg" },
+        { name: "gray shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GreenTint.svg" },
+
+        // Green Shade
+        { name: "green shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BlueTint.svg" },
+        { name: "green shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BrownTint.svg" },
+        { name: "green shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-GreenTint.svg" },
+
+        // Tints Only
+        { name: "blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BlueTint.svg" },
+        { name: "brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BrownTint.svg" },
+        { name: "dark brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkBrownTint.svg" },
+        { name: "dark gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkGrayTint.svg" },
+        { name: "gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GrayTint.svg" },
+        { name: "green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GreenTint.svg" },
+        { name: "gray tint privacy", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-Privacy.svg" },
+
+        // No shade or tint
+        { name: "no shade, no tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-NoTint.svg" }, // ???
+
+    ]
+}
+
+export function getTintImage(glassType, colorString) {
+    return tintMap[glassType.toLowerCase()].find(item => item.name == colorString.toLowerCase())
+}
\ No newline at end of file
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BlueTint.svg
new file mode 100644
index 000000000..007c490f0
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BlueTint.svg
@@ -0,0 +1,18 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="url(#paint0_linear_841_8976)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8976" x1="51.9586" y1="33.0102" x2="51.9586" y2="6.98049" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CADCDD"/>
+<stop offset="0.2653" stop-color="#C8DBDC"/>
+<stop offset="0.3972" stop-color="#C0D6D7"/>
+<stop offset="0.4996" stop-color="#B3CDD0"/>
+<stop offset="0.5869" stop-color="#A0C1C5"/>
+<stop offset="0.6645" stop-color="#88B1B8"/>
+<stop offset="0.7353" stop-color="#6A9EA7"/>
+<stop offset="0.8009" stop-color="#468793"/>
+<stop offset="0.8607" stop-color="#1E6D7C"/>
+<stop offset="0.8993" stop-color="#005A6B"/>
+<stop offset="1" stop-color="#005A6B"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BrownTint.svg
new file mode 100644
index 000000000..d1ffeb8e0
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BrownTint.svg
@@ -0,0 +1,18 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="url(#paint0_linear_841_9006)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_9006" x1="51.9586" y1="33.0065" x2="51.9586" y2="6.97682" gradientUnits="userSpaceOnUse">
+<stop stop-color="#D0CDC2"/>
+<stop offset="0.2632" stop-color="#CECCC1"/>
+<stop offset="0.394" stop-color="#C6C8BE"/>
+<stop offset="0.4956" stop-color="#B9C0B8"/>
+<stop offset="0.5823" stop-color="#A6B6B1"/>
+<stop offset="0.6593" stop-color="#8EA8A6"/>
+<stop offset="0.7295" stop-color="#70989A"/>
+<stop offset="0.7947" stop-color="#4C848B"/>
+<stop offset="0.854" stop-color="#246E7A"/>
+<stop offset="0.8993" stop-color="#005A6B"/>
+<stop offset="1" stop-color="#005A6B"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GrayTint.svg
new file mode 100644
index 000000000..417ce474d
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GrayTint.svg
@@ -0,0 +1,19 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="url(#paint0_linear_841_8763)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8763" x1="51.9586" y1="33.0065" x2="51.9586" y2="6.97682" gradientUnits="userSpaceOnUse">
+<stop stop-color="#E7E7E8"/>
+<stop offset="0.2559" stop-color="#E5E6E7"/>
+<stop offset="0.383" stop-color="#DDE1E3"/>
+<stop offset="0.4818" stop-color="#D0D9DC"/>
+<stop offset="0.5659" stop-color="#BDCDD1"/>
+<stop offset="0.6409" stop-color="#A5BFC4"/>
+<stop offset="0.7091" stop-color="#87ACB4"/>
+<stop offset="0.7724" stop-color="#6397A1"/>
+<stop offset="0.8318" stop-color="#3A7D8A"/>
+<stop offset="0.8859" stop-color="#0C6272"/>
+<stop offset="0.8993" stop-color="#005A6B"/>
+<stop offset="1" stop-color="#005A6B"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GreenTint.svg
new file mode 100644
index 000000000..4cf1c3831
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GreenTint.svg
@@ -0,0 +1,18 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="url(#paint0_linear_841_8750)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8750" x1="51.9586" y1="33.0219" x2="51.9586" y2="6.99218" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CBE9DD"/>
+<stop offset="0.265" stop-color="#C9E7DC"/>
+<stop offset="0.3966" stop-color="#C1E2D7"/>
+<stop offset="0.4989" stop-color="#B4D9D0"/>
+<stop offset="0.5861" stop-color="#A1CCC6"/>
+<stop offset="0.6636" stop-color="#89BAB8"/>
+<stop offset="0.7343" stop-color="#6BA5A7"/>
+<stop offset="0.7998" stop-color="#478C93"/>
+<stop offset="0.8595" stop-color="#1F707D"/>
+<stop offset="0.8993" stop-color="#005A6B"/>
+<stop offset="1" stop-color="#005A6B"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-NoTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-NoTint.svg
new file mode 100644
index 000000000..220b1ab04
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-NoTint.svg
@@ -0,0 +1,19 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="url(#paint0_linear_841_8908)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8908" x1="51.9812" y1="33.0046" x2="51.9812" y2="6.97492" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="0.2491" stop-color="#FDFEFE"/>
+<stop offset="0.3729" stop-color="#F5F9F9"/>
+<stop offset="0.4691" stop-color="#E8F0F2"/>
+<stop offset="0.551" stop-color="#D5E4E7"/>
+<stop offset="0.6239" stop-color="#BDD4D9"/>
+<stop offset="0.6904" stop-color="#9FC1C7"/>
+<stop offset="0.752" stop-color="#7BAAB3"/>
+<stop offset="0.8099" stop-color="#528F9A"/>
+<stop offset="0.8626" stop-color="#247280"/>
+<stop offset="0.8993" stop-color="#005A6B"/>
+<stop offset="1" stop-color="#005A6B"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BrownShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BrownShade-BrownTint.svg
new file mode 100644
index 000000000..dbd059625
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BrownShade-BrownTint.svg
@@ -0,0 +1,18 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="url(#paint0_linear_841_8984)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8984" x1="51.9519" y1="33.0065" x2="51.9519" y2="6.97682" gradientUnits="userSpaceOnUse">
+<stop stop-color="#D0CDC2"/>
+<stop offset="0.2738" stop-color="#CECBC0"/>
+<stop offset="0.4097" stop-color="#C9C6B8"/>
+<stop offset="0.5154" stop-color="#C0BCAB"/>
+<stop offset="0.6055" stop-color="#B3AD98"/>
+<stop offset="0.6856" stop-color="#A39B80"/>
+<stop offset="0.7586" stop-color="#8E8462"/>
+<stop offset="0.8262" stop-color="#766A3E"/>
+<stop offset="0.8879" stop-color="#5B4B16"/>
+<stop offset="0.8993" stop-color="#55450E"/>
+<stop offset="1" stop-color="#55450E"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BlueTint.svg
new file mode 100644
index 000000000..2ec4a0535
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BlueTint.svg
@@ -0,0 +1,17 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="url(#paint0_linear_841_8980)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8980" x1="51.9552" y1="33.0102" x2="51.9552" y2="6.98049" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CADCDD"/>
+<stop offset="0.2908" stop-color="#C8DADB"/>
+<stop offset="0.4353" stop-color="#C1D2D3"/>
+<stop offset="0.5475" stop-color="#B6C5C6"/>
+<stop offset="0.6432" stop-color="#A5B2B3"/>
+<stop offset="0.7282" stop-color="#909A9B"/>
+<stop offset="0.8057" stop-color="#767C7D"/>
+<stop offset="0.8761" stop-color="#58595A"/>
+<stop offset="0.8993" stop-color="#4C4C4D"/>
+<stop offset="1" stop-color="#4C4C4D"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BrownTint.svg
new file mode 100644
index 000000000..f9cc80c12
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BrownTint.svg
@@ -0,0 +1,17 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="url(#paint0_linear_841_9018)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_9018" x1="51.9552" y1="33.0065" x2="51.9552" y2="6.97682" gradientUnits="userSpaceOnUse">
+<stop stop-color="#D0CDC2"/>
+<stop offset="0.2978" stop-color="#CECBC0"/>
+<stop offset="0.4457" stop-color="#C6C3B9"/>
+<stop offset="0.5606" stop-color="#B9B6AE"/>
+<stop offset="0.6585" stop-color="#A6A49D"/>
+<stop offset="0.7456" stop-color="#8E8C87"/>
+<stop offset="0.8237" stop-color="#71706D"/>
+<stop offset="0.8959" stop-color="#4E4E4F"/>
+<stop offset="0.8993" stop-color="#4C4C4D"/>
+<stop offset="1" stop-color="#4C4C4D"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GrayTint.svg
new file mode 100644
index 000000000..fcfe78cf6
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GrayTint.svg
@@ -0,0 +1,17 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="url(#paint0_linear_841_8978)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8978" x1="51.9552" y1="33.0065" x2="51.9552" y2="6.97682" gradientUnits="userSpaceOnUse">
+<stop stop-color="#E7E7E8"/>
+<stop offset="0.2851" stop-color="#E5E5E6"/>
+<stop offset="0.4267" stop-color="#DDDDDE"/>
+<stop offset="0.5368" stop-color="#D0D0D1"/>
+<stop offset="0.6305" stop-color="#BDBDBE"/>
+<stop offset="0.7139" stop-color="#A5A5A6"/>
+<stop offset="0.7899" stop-color="#878788"/>
+<stop offset="0.8589" stop-color="#646465"/>
+<stop offset="0.8993" stop-color="#4C4C4D"/>
+<stop offset="1" stop-color="#4C4C4D"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GreenTint.svg
new file mode 100644
index 000000000..b420ec6f4
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GreenTint.svg
@@ -0,0 +1,17 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="url(#paint0_linear_841_8932)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8932" x1="51.9552" y1="33.0219" x2="51.9552" y2="6.99218" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CBE9DD"/>
+<stop offset="0.2841" stop-color="#C9E7DB"/>
+<stop offset="0.4252" stop-color="#C3DFD4"/>
+<stop offset="0.5349" stop-color="#B8D2C8"/>
+<stop offset="0.6283" stop-color="#A9BFB7"/>
+<stop offset="0.7114" stop-color="#96A7A0"/>
+<stop offset="0.7871" stop-color="#7D8985"/>
+<stop offset="0.8559" stop-color="#616665"/>
+<stop offset="0.8993" stop-color="#4C4C4D"/>
+<stop offset="1" stop-color="#4C4C4D"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BlueTint.svg
new file mode 100644
index 000000000..e1f2e9688
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BlueTint.svg
@@ -0,0 +1,20 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="#CEE7DB"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="url(#paint0_linear_841_8920)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8920" x1="51.9618" y1="33.0102" x2="51.9618" y2="6.98049" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CADCDD"/>
+<stop offset="0.2653" stop-color="#C8DBDB"/>
+<stop offset="0.3972" stop-color="#C0D6D5"/>
+<stop offset="0.4996" stop-color="#B3CFCB"/>
+<stop offset="0.5869" stop-color="#A0C4BD"/>
+<stop offset="0.6645" stop-color="#88B6AA"/>
+<stop offset="0.7353" stop-color="#6AA593"/>
+<stop offset="0.8009" stop-color="#469177"/>
+<stop offset="0.8607" stop-color="#1E7A58"/>
+<stop offset="0.8993" stop-color="#006941"/>
+<stop offset="1" stop-color="#006941"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BrownTint.svg
new file mode 100644
index 000000000..b8f49b565
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BrownTint.svg
@@ -0,0 +1,18 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="url(#paint0_linear_841_8982)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8982" x1="51.9814" y1="33.0065" x2="51.9814" y2="6.97682" gradientUnits="userSpaceOnUse">
+<stop stop-color="#D0CDC2"/>
+<stop offset="0.2632" stop-color="#CECCC1"/>
+<stop offset="0.394" stop-color="#C6C8BC"/>
+<stop offset="0.4956" stop-color="#B9C2B4"/>
+<stop offset="0.5823" stop-color="#A6B9A8"/>
+<stop offset="0.6593" stop-color="#8EAD99"/>
+<stop offset="0.7295" stop-color="#709F86"/>
+<stop offset="0.7947" stop-color="#4C8E70"/>
+<stop offset="0.854" stop-color="#247A57"/>
+<stop offset="0.8993" stop-color="#006941"/>
+<stop offset="1" stop-color="#006941"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-GreenTint.svg
new file mode 100644
index 000000000..b07e8dbcc
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-GreenTint.svg
@@ -0,0 +1,18 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="url(#paint0_linear_841_8896)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8896" x1="51.9618" y1="33.0219" x2="51.9618" y2="6.99218" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CBE9DD"/>
+<stop offset="0.265" stop-color="#C9E8DB"/>
+<stop offset="0.3966" stop-color="#C1E3D5"/>
+<stop offset="0.4989" stop-color="#B4DACB"/>
+<stop offset="0.5861" stop-color="#A1CFBD"/>
+<stop offset="0.6636" stop-color="#89BFAA"/>
+<stop offset="0.7343" stop-color="#6BAC93"/>
+<stop offset="0.7998" stop-color="#479678"/>
+<stop offset="0.8595" stop-color="#1F7D59"/>
+<stop offset="0.8993" stop-color="#006941"/>
+<stop offset="1" stop-color="#006941"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BlueTint.svg
new file mode 100644
index 000000000..1e4fd4eba
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BlueTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="#CBDDDE" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BrownTint.svg
new file mode 100644
index 000000000..658774678
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BrownTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="#D1CEC3" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkBrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkBrownTint.svg
new file mode 100644
index 000000000..f36ebd878
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkBrownTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="#5D564C" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DaryGrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DaryGrayTint.svg
new file mode 100644
index 000000000..5aab7ea07
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DaryGrayTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="#D3D3D3" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GrayTint.svg
new file mode 100644
index 000000000..ee14d3c4b
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GrayTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="#E9E9EB" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GreenTint.svg
new file mode 100644
index 000000000..5f5b99de0
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GreenTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="#CBE9DD" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-NoTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-NoTint.svg
new file mode 100644
index 000000000..ec1ced501
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-NoTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="white" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-Privacy.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-Privacy.svg
new file mode 100644
index 000000000..caa726f47
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-Privacy.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M78.25 33H25.7083C24.2188 33 23 31.7812 23 30.2917V9.70833C23 8.21874 24.2188 7 25.7083 7H78.25C79.7396 7 80.9583 8.21874 80.9583 9.70833V30.2917C80.9583 31.7812 79.7396 33 78.25 33Z" fill="#626167" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BlueTint.svg
new file mode 100644
index 000000000..b4cf30c92
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BlueTint.svg
@@ -0,0 +1,18 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="url(#paint0_linear_841_8966)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8966" x1="51.9716" y1="34.0522" x2="51.9716" y2="5.97896" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CADCDD"/>
+<stop offset="0.2653" stop-color="#C8DBDC"/>
+<stop offset="0.3972" stop-color="#C0D6D7"/>
+<stop offset="0.4996" stop-color="#B3CDD0"/>
+<stop offset="0.5869" stop-color="#A0C1C5"/>
+<stop offset="0.6645" stop-color="#88B1B8"/>
+<stop offset="0.7353" stop-color="#6A9EA7"/>
+<stop offset="0.8009" stop-color="#468793"/>
+<stop offset="0.8607" stop-color="#1E6D7C"/>
+<stop offset="0.8993" stop-color="#005A6B"/>
+<stop offset="1" stop-color="#005A6B"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BrownTint.svg
new file mode 100644
index 000000000..dbca11b88
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BrownTint.svg
@@ -0,0 +1,18 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="url(#paint0_linear_841_9004)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_9004" x1="51.9716" y1="34.0483" x2="51.9716" y2="5.975" gradientUnits="userSpaceOnUse">
+<stop stop-color="#D0CDC2"/>
+<stop offset="0.2632" stop-color="#CECCC1"/>
+<stop offset="0.394" stop-color="#C6C8BE"/>
+<stop offset="0.4956" stop-color="#B9C0B8"/>
+<stop offset="0.5823" stop-color="#A6B6B1"/>
+<stop offset="0.6593" stop-color="#8EA8A6"/>
+<stop offset="0.7295" stop-color="#70989A"/>
+<stop offset="0.7947" stop-color="#4C848B"/>
+<stop offset="0.854" stop-color="#246E7A"/>
+<stop offset="0.8993" stop-color="#005A6B"/>
+<stop offset="1" stop-color="#005A6B"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GrayTint.svg
new file mode 100644
index 000000000..7ef277564
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GrayTint.svg
@@ -0,0 +1,19 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="url(#paint0_linear_825_8758)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_825_8758" x1="51.9716" y1="34.0483" x2="51.9716" y2="5.975" gradientUnits="userSpaceOnUse">
+<stop stop-color="#E7E7E8"/>
+<stop offset="0.2559" stop-color="#E5E6E7"/>
+<stop offset="0.383" stop-color="#DDE1E3"/>
+<stop offset="0.4818" stop-color="#D0D9DC"/>
+<stop offset="0.5659" stop-color="#BDCDD1"/>
+<stop offset="0.6409" stop-color="#A5BFC4"/>
+<stop offset="0.7091" stop-color="#87ACB4"/>
+<stop offset="0.7724" stop-color="#6397A1"/>
+<stop offset="0.8318" stop-color="#3A7D8A"/>
+<stop offset="0.8859" stop-color="#0C6272"/>
+<stop offset="0.8993" stop-color="#005A6B"/>
+<stop offset="1" stop-color="#005A6B"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GreenTint.svg
new file mode 100644
index 000000000..18bc35fb5
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GreenTint.svg
@@ -0,0 +1,17 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.99" fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="url(#paint0_linear_206_8118)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_206_8118" x1="51.9712" y1="34.0648" x2="51.9712" y2="5.99159" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CEDEE7"/>
+<stop offset="0.265" stop-color="#C9E7DC"/>
+<stop offset="0.3966" stop-color="#C1E2D7"/>
+<stop offset="0.4989" stop-color="#B4D9D0"/>
+<stop offset="0.5861" stop-color="#A1CCC6"/>
+<stop offset="0.6636" stop-color="#89BAB8"/>
+<stop offset="0.7343" stop-color="#6BA5A7"/>
+<stop offset="0.7998" stop-color="#478C93"/>
+<stop offset="0.8993" stop-color="#125B7E"/>
+<stop offset="1" stop-color="#125B7E"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-NoTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-NoTint.svg
new file mode 100644
index 000000000..2217911a8
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-NoTint.svg
@@ -0,0 +1,19 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="url(#paint0_linear_841_8906)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8906" x1="52.0028" y1="34.0462" x2="52.0028" y2="5.97295" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="0.2491" stop-color="#FDFEFE"/>
+<stop offset="0.3729" stop-color="#F5F9F9"/>
+<stop offset="0.4691" stop-color="#E8F0F2"/>
+<stop offset="0.551" stop-color="#D5E4E7"/>
+<stop offset="0.6239" stop-color="#BDD4D9"/>
+<stop offset="0.6904" stop-color="#9FC1C7"/>
+<stop offset="0.752" stop-color="#7BAAB3"/>
+<stop offset="0.8099" stop-color="#528F9A"/>
+<stop offset="0.8626" stop-color="#247280"/>
+<stop offset="0.8993" stop-color="#005A6B"/>
+<stop offset="1" stop-color="#005A6B"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BrownShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BrownShade-BrownTint.svg
new file mode 100644
index 000000000..8c8b1da66
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BrownShade-BrownTint.svg
@@ -0,0 +1,18 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="url(#paint0_linear_841_8974)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8974" x1="51.9623" y1="34.0483" x2="51.9623" y2="5.975" gradientUnits="userSpaceOnUse">
+<stop stop-color="#D0CDC2"/>
+<stop offset="0.2738" stop-color="#CECBC0"/>
+<stop offset="0.4097" stop-color="#C9C6B8"/>
+<stop offset="0.5154" stop-color="#C0BCAB"/>
+<stop offset="0.6055" stop-color="#B3AD98"/>
+<stop offset="0.6856" stop-color="#A39B80"/>
+<stop offset="0.7586" stop-color="#8E8462"/>
+<stop offset="0.8262" stop-color="#766A3E"/>
+<stop offset="0.8879" stop-color="#5B4B16"/>
+<stop offset="0.8993" stop-color="#55450E"/>
+<stop offset="1" stop-color="#55450E"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BlueTint.svg
new file mode 100644
index 000000000..a924b6664
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BlueTint.svg
@@ -0,0 +1,17 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="url(#paint0_linear_841_8970)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8970" x1="51.9669" y1="34.0522" x2="51.9669" y2="5.97896" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CADCDD"/>
+<stop offset="0.2908" stop-color="#C8DADB"/>
+<stop offset="0.4353" stop-color="#C1D2D3"/>
+<stop offset="0.5475" stop-color="#B6C5C6"/>
+<stop offset="0.6432" stop-color="#A5B2B3"/>
+<stop offset="0.7282" stop-color="#909A9B"/>
+<stop offset="0.8057" stop-color="#767C7D"/>
+<stop offset="0.8761" stop-color="#58595A"/>
+<stop offset="0.8993" stop-color="#4C4C4D"/>
+<stop offset="1" stop-color="#4C4C4D"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BrownTint.svg
new file mode 100644
index 000000000..b26eedee1
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BrownTint.svg
@@ -0,0 +1,17 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="url(#paint0_linear_841_9016)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_9016" x1="51.9669" y1="34.0483" x2="51.9669" y2="5.975" gradientUnits="userSpaceOnUse">
+<stop stop-color="#D0CDC2"/>
+<stop offset="0.2978" stop-color="#CECBC0"/>
+<stop offset="0.4457" stop-color="#C6C3B9"/>
+<stop offset="0.5606" stop-color="#B9B6AE"/>
+<stop offset="0.6585" stop-color="#A6A49D"/>
+<stop offset="0.7456" stop-color="#8E8C87"/>
+<stop offset="0.8237" stop-color="#71706D"/>
+<stop offset="0.8959" stop-color="#4E4E4F"/>
+<stop offset="0.8993" stop-color="#4C4C4D"/>
+<stop offset="1" stop-color="#4C4C4D"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GrayTint.svg
new file mode 100644
index 000000000..69373ca2c
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GrayTint.svg
@@ -0,0 +1,17 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="url(#paint0_linear_841_8968)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8968" x1="51.9669" y1="34.0483" x2="51.9669" y2="5.975" gradientUnits="userSpaceOnUse">
+<stop stop-color="#E7E7E8"/>
+<stop offset="0.2851" stop-color="#E5E5E6"/>
+<stop offset="0.4267" stop-color="#DDDDDE"/>
+<stop offset="0.5368" stop-color="#D0D0D1"/>
+<stop offset="0.6305" stop-color="#BDBDBE"/>
+<stop offset="0.7139" stop-color="#A5A5A6"/>
+<stop offset="0.7899" stop-color="#878788"/>
+<stop offset="0.8589" stop-color="#646465"/>
+<stop offset="0.8993" stop-color="#4C4C4D"/>
+<stop offset="1" stop-color="#4C4C4D"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GreenTint.svg
new file mode 100644
index 000000000..14824eb51
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GreenTint.svg
@@ -0,0 +1,17 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="url(#paint0_linear_841_8930)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8930" x1="51.9669" y1="34.0648" x2="51.9669" y2="5.99157" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CBE9DD"/>
+<stop offset="0.2841" stop-color="#C9E7DB"/>
+<stop offset="0.4252" stop-color="#C3DFD4"/>
+<stop offset="0.5349" stop-color="#B8D2C8"/>
+<stop offset="0.6283" stop-color="#A9BFB7"/>
+<stop offset="0.7114" stop-color="#96A7A0"/>
+<stop offset="0.7871" stop-color="#7D8985"/>
+<stop offset="0.8559" stop-color="#616665"/>
+<stop offset="0.8993" stop-color="#4C4C4D"/>
+<stop offset="1" stop-color="#4C4C4D"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BlueTint.svg
new file mode 100644
index 000000000..fcc3d63a3
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BlueTint.svg
@@ -0,0 +1,18 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="url(#paint0_linear_841_8918)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8918" x1="51.976" y1="34.0522" x2="51.976" y2="5.97896" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CADCDD"/>
+<stop offset="0.2653" stop-color="#C8DBDB"/>
+<stop offset="0.3972" stop-color="#C0D6D5"/>
+<stop offset="0.4996" stop-color="#B3CFCB"/>
+<stop offset="0.5869" stop-color="#A0C4BD"/>
+<stop offset="0.6645" stop-color="#88B6AA"/>
+<stop offset="0.7353" stop-color="#6AA593"/>
+<stop offset="0.8009" stop-color="#469177"/>
+<stop offset="0.8607" stop-color="#1E7A58"/>
+<stop offset="0.8993" stop-color="#006941"/>
+<stop offset="1" stop-color="#006941"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BrownTint.svg
new file mode 100644
index 000000000..2fdf4bcf9
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BrownTint.svg
@@ -0,0 +1,18 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="url(#paint0_linear_841_8972)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8972" x1="52.0031" y1="34.0483" x2="52.0031" y2="5.975" gradientUnits="userSpaceOnUse">
+<stop stop-color="#D0CDC2"/>
+<stop offset="0.2632" stop-color="#CECCC1"/>
+<stop offset="0.394" stop-color="#C6C8BC"/>
+<stop offset="0.4956" stop-color="#B9C2B4"/>
+<stop offset="0.5823" stop-color="#A6B9A8"/>
+<stop offset="0.6593" stop-color="#8EAD99"/>
+<stop offset="0.7295" stop-color="#709F86"/>
+<stop offset="0.7947" stop-color="#4C8E70"/>
+<stop offset="0.854" stop-color="#247A57"/>
+<stop offset="0.8993" stop-color="#006941"/>
+<stop offset="1" stop-color="#006941"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-GreenTint.svg
new file mode 100644
index 000000000..65a735289
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-GreenTint.svg
@@ -0,0 +1,18 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="url(#paint0_linear_841_8894)" stroke="black"/>
+<defs>
+<linearGradient id="paint0_linear_841_8894" x1="51.976" y1="34.0648" x2="51.976" y2="5.99157" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CBE9DD"/>
+<stop offset="0.265" stop-color="#C9E8DB"/>
+<stop offset="0.3966" stop-color="#C1E3D5"/>
+<stop offset="0.4989" stop-color="#B4DACB"/>
+<stop offset="0.5861" stop-color="#A1CFBD"/>
+<stop offset="0.6636" stop-color="#89BFAA"/>
+<stop offset="0.7343" stop-color="#6BAC93"/>
+<stop offset="0.7998" stop-color="#479678"/>
+<stop offset="0.8595" stop-color="#1F7D59"/>
+<stop offset="0.8993" stop-color="#006941"/>
+<stop offset="1" stop-color="#006941"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BlueTint.svg
new file mode 100644
index 000000000..cbeb84ab4
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BlueTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="#CBDDDE" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BrownTint.svg
new file mode 100644
index 000000000..f70fef994
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BrownTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="#D1CEC3" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkBrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkBrownTint.svg
new file mode 100644
index 000000000..feedfa3f0
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkBrownTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="#5D564C" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkGrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkGrayTint.svg
new file mode 100644
index 000000000..9f55ee8a7
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkGrayTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="#D3D3D3" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GrayTint.svg
new file mode 100644
index 000000000..249a9866c
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GrayTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="#E9E9EB" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GreenTint.svg
new file mode 100644
index 000000000..ce17261a5
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GreenTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="#CBE9DD" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-NoTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-NoTint.svg
new file mode 100644
index 000000000..5a9bc647f
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-NoTint.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="white" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-Privacy.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-Privacy.svg
new file mode 100644
index 000000000..ca1f024ac
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-Privacy.svg
@@ -0,0 +1,3 @@
+<svg width="104" height="40" viewBox="0 0 104 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51.9768 32.4623C54.8365 32.4623 73.392 32.1997 87.6574 34.0091C90.1732 34.3302 91.889 32.1711 91.9744 30.7698C92.5182 22.8924 84.227 12.0979 84.227 12.0979C84.227 12.0979 81.7113 8.18778 75.6493 7.42988C75.6493 7.42988 61.3546 6 52.0061 6C43.2576 6 28.3617 7.42988 28.3617 7.42988C22.3009 8.18778 19.7851 12.0967 19.7851 12.0967C19.7851 12.0967 11.3793 22.9222 12.0366 30.7698C12.1232 31.9371 13.8378 34.3302 16.3536 34.0091C30.5641 32.1997 49.1184 32.4623 51.9768 32.4623Z" fill="#626167" stroke="black"/>
+</svg>
diff --git a/src/layouts/vehicle-parts/part-question/part-question.vue b/src/layouts/vehicle-parts/part-question/part-question.vue
new file mode 100644
index 000000000..7c29a6e61
--- /dev/null
+++ b/src/layouts/vehicle-parts/part-question/part-question.vue
@@ -0,0 +1,65 @@
+<template>
+<p>Select your current {{ colorQuestionText }} color:</p>
+<div v-for="(item, i) in colorAnswers" :key="i">
+    <listCard isRadio buttonImage="./assets/BackGlass-BlueTint-BlueShade.svg" :buttonLabel="item.ColorAnswerText" altText="" buttonID="sample-button" groupID="radio-demo-2" />
+
+    <buttonQuestion buttonType="radio" class="radioQuestion" questionText="ok now select your features" :answers="testTest" textPosition="text-start" :loaderEnabled=false isRequired=true />
+</div>
+</template>
+
+<script>
+import listCard from "@/ux-components/list-card/list-card";
+import buttonQuestion from "@/common-components/button-question/button-question";
+
+import {
+    getTintImage
+} from "@/constants/tint-mapper";
+
+export default {
+    name: "part-question",
+    data() {
+        return {
+            glassColorQuestion: String,
+            glassFeatureQuestion: String,
+            testTest: [
+                {
+                    // Computed to covert my data to name/text data,
+                    // look at answersToDisplay in damage-location-question.vue
+
+                    Name: "DB12209GTYN", // Backing value
+                    Text: "heated glass, solar, 1 hole", // Display to user
+                },
+
+                {
+                    Name: "Zzzzzz",
+                    Text: "AAAAAAA",
+                },
+            ]
+        };
+    },
+    props: {
+        glassName: String,
+        colorAnswers: Array,
+    },
+    components: {
+        listCard,
+        buttonQuestion
+    },
+    mounted() {
+        const s = getTintImage("Backglass", "Green Tint");
+
+        console.log("hi");
+    },
+    computed: {
+        colorQuestionText() {
+            return "Backglass";
+        },
+    },
+    methods: {
+        initializeComponent(cmsContent, initialData) {
+            this.glassColorQuestion = cmsContent.ColorQuestion;
+            this.glassFeatureQuestion = cmsContent.FeatureQuestion;
+        },
+    },
+};
+</script>
diff --git a/src/layouts/vehicle-parts/response.json b/src/layouts/vehicle-parts/response.json
new file mode 100644
index 000000000..6bcde0a58
--- /dev/null
+++ b/src/layouts/vehicle-parts/response.json
@@ -0,0 +1,96 @@
+{
+    "partsOrQuestions": [
+      {
+        "glassName": "Backglass",
+        "parts": [
+          {
+            "partNumber": "DB12209GTYN",
+            "description": "heated glass, solar, 1 hole",
+            "color": "Green Tint",
+            "requiresRecalibration": false,
+            "requiresCapabilityQuestions": false,
+            "childParts": null
+          },
+          {
+            "partNumber": "DB12209YPYN",
+            "description": "heated glass, solar, 1 hole",
+            "color": "Gray Tint Privacy",
+            "requiresRecalibration": false,
+            "requiresCapabilityQuestions": false,
+            "childParts": null
+          }
+        ],
+        "partQuestions": null
+      },
+      {
+        "glassName": "DriverRearQuarterGlass",
+        "parts": [
+          {
+            "partNumber": "DQ12204GTYNOEM",
+            "description": "solar, driver side, encap",
+            "color": "Green Tint",
+            "requiresRecalibration": false,
+            "requiresCapabilityQuestions": false,
+            "childParts": null
+          },
+          {
+            "partNumber": "DQ12204YPYNOEM",
+            "description": "solar, driver side, encap",
+            "color": "Gray Tint Privacy",
+            "requiresRecalibration": false,
+            "requiresCapabilityQuestions": false,
+            "childParts": null
+          },
+          {
+            "partNumber": "DQ12205GTYNOEM",
+            "description": "solar, antenna, driver side, encap",
+            "color": "Green Tint",
+            "requiresRecalibration": false,
+            "requiresCapabilityQuestions": false,
+            "childParts": null
+          },
+          {
+            "partNumber": "DQ12205YPYNOEM",
+            "description": "solar, antenna, driver side, encap",
+            "color": "Gray Tint Privacy",
+            "requiresRecalibration": false,
+            "requiresCapabilityQuestions": false,
+            "childParts": null
+          },
+          {
+            "partNumber": "DQ12207GTYN",
+            "description": "solar, driver side, encap, chrome molding",
+            "color": "Green Tint",
+            "requiresRecalibration": false,
+            "requiresCapabilityQuestions": false,
+            "childParts": null
+          },
+          {
+            "partNumber": "DQ12207YPYNOEM",
+            "description": "solar, driver side, encap, chrome molding",
+            "color": "Gray Tint Privacy",
+            "requiresRecalibration": false,
+            "requiresCapabilityQuestions": false,
+            "childParts": null
+          },
+          {
+            "partNumber": "DQ12208GTYNOEM",
+            "description": "solar, antenna, driver side, encap, chrome molding",
+            "color": "Green Tint",
+            "requiresRecalibration": false,
+            "requiresCapabilityQuestions": false,
+            "childParts": null
+          },
+          {
+            "partNumber": "DQ12208YPYNOEM",
+            "description": "solar, antenna, driver side, encap, chrome molding",
+            "color": "Gray Tint Privacy",
+            "requiresRecalibration": false,
+            "requiresCapabilityQuestions": false,
+            "childParts": null
+          }
+        ],
+        "partQuestions": null
+      }
+    ]
+  }
\ No newline at end of file
diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue
new file mode 100644
index 000000000..a0aeb2ebb
--- /dev/null
+++ b/src/layouts/vehicle-parts/vehicle-parts.vue
@@ -0,0 +1,44 @@
+<template>
+<div class="container-fluid shadow rounded-3 p-0 position-relative">
+    <div v-for="(item, i) in Parts" :key="i">
+        <partQuestion :glassName="item.glassName" :colorAnswers="item.colorAnswers" />
+    </div>
+</div>
+</template>
+
+<script>
+import partQuestion from "@/layouts/vehicle-parts/part-question/part-question";
+export default {
+    name: "vehicle-parts",
+    data() {
+        return {
+            Parts: [{
+                glassName: 'Backglass',
+                colorAnswers: [{
+                        ColorAnswerText: 'Green Tint',
+                        FeatureAnswers: [{
+                            FeatureAnswerText: 'heated glass, solar, 1 hole',
+                            PartNumber: 'DB12209GTYN'
+                        }]
+                    },
+                    {
+                        ColorAnswerText: 'Gray Tint Privacy',
+                        FeatureAnswers: [{
+                            FeatureAnswerText: 'heated glass, solar, 1 hole',
+                            PartNumber: 'DB12209YPYN'
+                        }]
+                    }
+                ]
+            }]
+        }
+    },
+    components: {
+        partQuestion,
+    },
+    methods: {
+        arePagePrerequisitesValid() {
+            return true;
+        },
+    }
+}
+</script>