diff --git a/src/views/autocomplete/AutoCompleteDemo.vue b/src/views/autocomplete/AutoCompleteDemo.vue
index 7c25ddfb9..ec2d53f25 100644
--- a/src/views/autocomplete/AutoCompleteDemo.vue
+++ b/src/views/autocomplete/AutoCompleteDemo.vue
@@ -16,7 +16,7 @@
             <AutoComplete v-model="brand" :suggestions="filteredBrands" @complete="searchBrand($event)" placeholder="Hint: type 'v' or 'f'" :dropdown="true">
                 <template #item="slotProps">
                     <div class="p-clearfix p-autocomplete-brand-item">
-                        <img :alt="slotProps.item" :src="'/demo/images/car/' + slotProps.item + '.png'" />
+                        <img :alt="slotProps.item" :src="'demo/images/car/' + slotProps.item + '.png'" />
                         <div>{{slotProps.item}}</div>
                     </div>
                 </template>
diff --git a/src/views/autocomplete/AutoCompleteDoc.vue b/src/views/autocomplete/AutoCompleteDoc.vue
index 1af6cc73a..bf73158be 100644
--- a/src/views/autocomplete/AutoCompleteDoc.vue
+++ b/src/views/autocomplete/AutoCompleteDoc.vue
@@ -62,7 +62,7 @@ export default {
 <template v-pre>
 &lt;AutoComplete v-model="brand" :suggestions="filteredBrands" @complete="searchBrand($event)" placeholder="Hint: type 'v' or 'f'" :dropdown="true"&gt;
 	&lt;template #item="slotProps"&gt;
-		&lt;img :alt="slotProps.item" :src="'/demo/images/car/' + slotProps.item + '.png'" /&gt;
+		&lt;img :alt="slotProps.item" :src="'demo/images/car/' + slotProps.item + '.png'" /&gt;
         &lt;div&gt;{{slotProps.item}}&lt;/div&gt;
 	&lt;/template&gt;
 &lt;/AutoComplete&gt;
@@ -275,7 +275,7 @@ export default {
 			&lt;AutoComplete v-model="brand" :suggestions="filteredBrands" @complete="searchBrand($event)" placeholder="Hint: type 'v' or 'f'" :dropdown="true"&gt;
 				&lt;template #item="slotProps"&gt;
 					&lt;div class="p-clearfix p-autocomplete-brand-item"&gt;
-						&lt;img :alt="slotProps.item" :src="'/demo/images/car/' + slotProps.item + '.png'" /&gt;
+						&lt;img :alt="slotProps.item" :src="'demo/images/car/' + slotProps.item + '.png'" /&gt;
 						&lt;div&gt;{{slotProps.item}}&lt;/div&gt;
 					&lt;/div&gt;
 				&lt;/template&gt;
diff --git a/src/views/dataview/DataViewDemo.vue b/src/views/dataview/DataViewDemo.vue
index 6cafd58a9..9115cf5bd 100644
--- a/src/views/dataview/DataViewDemo.vue
+++ b/src/views/dataview/DataViewDemo.vue
@@ -24,7 +24,7 @@
 					<div class="p-col-12 car-details" style="padding: 2em; border-bottom: 1px solid #d9d9d9">
 						<div class="p-grid">
 							<div class="p-col-12 p-md-3">
-								<img :src="'/demo/images/car/' + slotProps.data.brand + '.png'" :alt="slotProps.data.brand"/>
+								<img :src="'demo/images/car/' + slotProps.data.brand + '.png'" :alt="slotProps.data.brand"/>
 							</div>
 							<div class="p-col-12 p-md-8 car-details">
 								<div class="p-grid">
@@ -46,7 +46,7 @@
 				<template #gridItem="slotProps">
 					<div style="padding: .5em" class="p-col-12 p-md-3">
 						<Panel :header="slotProps.data.vin" style="text-align: center">
-							<img :src="'/demo/images/car/' + slotProps.data.brand + '.png'" :alt="slotProps.data.brand"/>
+							<img :src="'demo/images/car/' + slotProps.data.brand + '.png'" :alt="slotProps.data.brand"/>
 							<div class="car-detail">{{slotProps.data.year}} - {{slotProps.data.color}}</div>
 							<hr class="ui-widget-content" style="border-top: 0" />
 							<Button icon="pi pi-search"></Button>
diff --git a/src/views/dataview/DataViewDoc.vue b/src/views/dataview/DataViewDoc.vue
index c5c0903df..c35ebe51d 100644
--- a/src/views/dataview/DataViewDoc.vue
+++ b/src/views/dataview/DataViewDoc.vue
@@ -36,7 +36,7 @@ mounted() {
 	&lt;div class="p-col-12 car-details" style="padding: 2em; border-bottom: 1px solid #d9d9d9"&gt;
 		&lt;div class="p-grid"&gt;
 			&lt;div class="p-col-12 p-md-3"&gt;
-				&lt;img :src="'/demo/images/car/' + slotProps.data.brand + '.png'" :alt="slotProps.data.brand"/&gt;
+				&lt;img :src="'demo/images/car/' + slotProps.data.brand + '.png'" :alt="slotProps.data.brand"/&gt;
 			&lt;/div&gt;
 			&lt;div class="p-col-12 p-md-8 car-data"&gt;
 				&lt;div&gt;Vin: &lt;b&gt;{{slotProps.data.vin}}&lt;/b&gt;&lt;/div&gt;
@@ -54,7 +54,7 @@ mounted() {
 &lt;template #gridItem="slotProps"&gt;
 	&lt;div style="padding: .5em" class="p-col-12 p-md-3"&gt;
 		&lt;Panel :header="slotProps.data.vin" style="text-align: center"&gt;
-			&lt;img :src="'/demo/images/car/' + slotProps.data.brand + '.png'" :alt="slotProps.data.brand"/&gt;
+			&lt;img :src="'demo/images/car/' + slotProps.data.brand + '.png'" :alt="slotProps.data.brand"/&gt;
 			&lt;div class="car-detail"&gt;{{slotProps.data.year}} - {{slotProps.data.color}}&lt;/div&gt;
 			&lt;hr class="ui-widget-content" style="border-top: 0" /&gt;
 			&lt;Button icon="pi pi-search"&gt;&lt;/Button&gt;
@@ -366,7 +366,7 @@ mounted() {
 					&lt;div class="p-col-12 car-details" style="padding: 2em; border-bottom: 1px solid #d9d9d9"&gt;
 						&lt;div class="p-grid"&gt;
 							&lt;div class="p-col-12 p-md-3"&gt;
-								&lt;img :src="'/demo/images/car/' + slotProps.data.brand + '.png'" :alt="slotProps.data.brand"/&gt;
+								&lt;img :src="'demo/images/car/' + slotProps.data.brand + '.png'" :alt="slotProps.data.brand"/&gt;
 							&lt;/div&gt;
 							&lt;div class="p-col-12 p-md-8 car-data"&gt;
 								&lt;div&gt;Vin: &lt;b&gt;{{slotProps.data.vin}}&lt;/b&gt;&lt;/div&gt;
@@ -384,7 +384,7 @@ mounted() {
 				&lt;template #gridItem="slotProps"&gt;
 					&lt;div style="padding: .5em" class="p-col-12 p-md-3"&gt;
 						&lt;Panel :header="slotProps.data.vin" style="text-align: center"&gt;
-							&lt;img :src="'/demo/images/car/' + slotProps.data.brand + '.png'" :alt="slotProps.data.brand"/&gt;
+							&lt;img :src="'demo/images/car/' + slotProps.data.brand + '.png'" :alt="slotProps.data.brand"/&gt;
 							&lt;div class="car-detail"&gt;{{slotProps.data.year}} - {{slotProps.data.color}}&lt;/div&gt;
 							&lt;hr class="ui-widget-content" style="border-top: 0" /&gt;
 							&lt;Button icon="pi pi-search"&gt;&lt;/Button&gt;
diff --git a/src/views/dropdown/DropdownDemo.vue b/src/views/dropdown/DropdownDemo.vue
index 1215973c9..ff5c5443a 100644
--- a/src/views/dropdown/DropdownDemo.vue
+++ b/src/views/dropdown/DropdownDemo.vue
@@ -18,7 +18,7 @@
             <Dropdown v-model="selectedCar" :options="cars" optionLabel="brand" placeholder="Select a Car" :filter="true" :showClear="true">
                 <template #option="slotProps">
                     <div class="p-clearfix p-dropdown-car-option">
-                        <img :alt="slotProps.option.brand" :src="'/demo/images/car/' + slotProps.option.brand + '.png'" />
+                        <img :alt="slotProps.option.brand" :src="'demo/images/car/' + slotProps.option.brand + '.png'" />
                         <span>{{slotProps.option.brand}}</span>
                     </div>
                 </template>
diff --git a/src/views/dropdown/DropdownDoc.vue b/src/views/dropdown/DropdownDoc.vue
index 0c94c22eb..bdde75363 100644
--- a/src/views/dropdown/DropdownDoc.vue
+++ b/src/views/dropdown/DropdownDoc.vue
@@ -45,7 +45,7 @@ data() {
 &lt;Dropdown v-model="selectedCar" :options="cars" optionLabel="brand" placeholder="Select a Car" :filter="true" :showClear="true"&gt;
 	&lt;template #option="slotProps"&gt;
 		&lt;div class="p-clearfix p-dropdown-car-option"&gt;
-			&lt;img :alt="slotProps.option.brand" :src="'/demo/images/car/' + slotProps.option.brand + '.png'" /&gt;
+			&lt;img :alt="slotProps.option.brand" :src="'demo/images/car/' + slotProps.option.brand + '.png'" /&gt;
 			&lt;span&gt;{{slotProps.option.brand}}&lt;/span&gt;
 		&lt;/div&gt;
 	&lt;/template&gt;
@@ -265,7 +265,7 @@ data() {
 			&lt;Dropdown v-model="selectedCar" :options="cars" optionLabel="brand" placeholder="Select a Car" :filter="true" :showClear="true"&gt;
 				&lt;template #option="slotProps"&gt;
 					&lt;div class="p-clearfix p-dropdown-car-option"&gt;
-						&lt;img :alt="slotProps.option.brand" :src="'/demo/images/car/' + slotProps.option.brand + '.png'" /&gt;
+						&lt;img :alt="slotProps.option.brand" :src="'demo/images/car/' + slotProps.option.brand + '.png'" /&gt;
 						&lt;span&gt;{{slotProps.option.brand}}&lt;/span&gt;
 					&lt;/div&gt;
 				&lt;/template&gt;
diff --git a/src/views/flexgrid/FlexGridDemo.vue b/src/views/flexgrid/FlexGridDemo.vue
index 065fcbf12..f7774859c 100644
--- a/src/views/flexgrid/FlexGridDemo.vue
+++ b/src/views/flexgrid/FlexGridDemo.vue
@@ -400,10 +400,10 @@
                                 Curabitur vel sodales purus. Vestibulum interdum facilisis nulla imperdiet suscipit. Quisque lectus felis,
                                 condimentum eget hendrerit sit amet.</div>
 
-                            <div class="p-col-6 p-md-3"><img alt="Galleria 1" src="/demo/images/nature/nature1.jpg" style="width: 100%" /></div>
-                            <div class="p-col-6 p-md-3"><img alt="Galleria 2" src="/demo/images/nature/nature2.jpg" style="width: 100%" /></div>
-                            <div class="p-col-6 p-md-3"><img alt="Galleria 3" src="/demo/images/nature/nature3.jpg" style="width: 100%" /></div>
-                            <div class="p-col-6 p-md-3"><img alt="Galleria 4" src="/demo/images/nature/nature4.jpg" style="width: 100%" /></div>
+                            <div class="p-col-6 p-md-3"><img alt="Galleria 1" src="demo/images/nature/nature1.jpg" style="width: 100%" /></div>
+                            <div class="p-col-6 p-md-3"><img alt="Galleria 2" src="demo/images/nature/nature2.jpg" style="width: 100%" /></div>
+                            <div class="p-col-6 p-md-3"><img alt="Galleria 3" src="demo/images/nature/nature3.jpg" style="width: 100%" /></div>
+                            <div class="p-col-6 p-md-3"><img alt="Galleria 4" src="demo/images/nature/nature4.jpg" style="width: 100%" /></div>
         
                             <div class="p-col-12 p-md-6">Phasellus faucibus purus volutpat mauris lacinia sodales. Ut sit amet sapien
                                 facilisis, commodo dui non, fringilla tellus. Quisque tempus facilisis nisi sodales finibus. Pellentesque
diff --git a/src/views/flexgrid/FlexGridDoc.vue b/src/views/flexgrid/FlexGridDoc.vue
index 1014d62b5..dc0b298f7 100644
--- a/src/views/flexgrid/FlexGridDoc.vue
+++ b/src/views/flexgrid/FlexGridDoc.vue
@@ -964,10 +964,10 @@
 								Curabitur vel sodales purus. Vestibulum interdum facilisis nulla imperdiet suscipit. Quisque lectus felis,
 								condimentum eget hendrerit sit amet.&lt;/div&gt;
 
-							&lt;div class="p-col-6 p-md-3"&gt;&lt;img alt="Galleria 1" src="/demo/images/nature/nature1.jpg" style="width: 100%" /&gt;&lt;/div&gt;
-							&lt;div class="p-col-6 p-md-3"&gt;&lt;img alt="Galleria 2" src="/demo/images/nature/nature2.jpg" style="width: 100%" /&gt;&lt;/div&gt;
-							&lt;div class="p-col-6 p-md-3"&gt;&lt;img alt="Galleria 3" src="/demo/images/nature/nature3.jpg" style="width: 100%" /&gt;&lt;/div&gt;
-							&lt;div class="p-col-6 p-md-3"&gt;&lt;img alt="Galleria 4" src="/demo/images/nature/nature4.jpg" style="width: 100%" /&gt;&lt;/div&gt;
+							&lt;div class="p-col-6 p-md-3"&gt;&lt;img alt="Galleria 1" src="demo/images/nature/nature1.jpg" style="width: 100%" /&gt;&lt;/div&gt;
+							&lt;div class="p-col-6 p-md-3"&gt;&lt;img alt="Galleria 2" src="demo/images/nature/nature2.jpg" style="width: 100%" /&gt;&lt;/div&gt;
+							&lt;div class="p-col-6 p-md-3"&gt;&lt;img alt="Galleria 3" src="demo/images/nature/nature3.jpg" style="width: 100%" /&gt;&lt;/div&gt;
+							&lt;div class="p-col-6 p-md-3"&gt;&lt;img alt="Galleria 4" src="demo/images/nature/nature4.jpg" style="width: 100%" /&gt;&lt;/div&gt;
 
 							&lt;div class="p-col-12 p-md-6"&gt;Phasellus faucibus purus volutpat mauris lacinia sodales. Ut sit amet sapien
 								facilisis, commodo dui non, fringilla tellus. Quisque tempus facilisis nisi sodales finibus. Pellentesque
diff --git a/src/views/listbox/ListboxDemo.vue b/src/views/listbox/ListboxDemo.vue
index 4f209597c..ff991160e 100644
--- a/src/views/listbox/ListboxDemo.vue
+++ b/src/views/listbox/ListboxDemo.vue
@@ -15,7 +15,7 @@
             <Listbox v-model="selectedCars" :options="cars" :multiple="true" :filter="true" optionLabel="brand" listStyle="max-height:250px" style="width:15em">
                 <template #option="slotProps">
                     <div class="p-clearfix">
-                        <img :alt="slotProps.option.brand" :src="'/demo/images/car/' + slotProps.option.brand + '.png'" style="display:inline-block;margin:5px 0 0 5px;width:48px" />
+                        <img :alt="slotProps.option.brand" :src="'demo/images/car/' + slotProps.option.brand + '.png'" style="display:inline-block;margin:5px 0 0 5px;width:48px" />
                         <span style="float:right;margin:1.25em .5em 0 0">{{slotProps.option.brand}}</span>
                     </div>
                 </template>
diff --git a/src/views/listbox/ListboxDoc.vue b/src/views/listbox/ListboxDoc.vue
index 984cd7fd7..75cda6c15 100644
--- a/src/views/listbox/ListboxDoc.vue
+++ b/src/views/listbox/ListboxDoc.vue
@@ -43,7 +43,7 @@ data() {
 &lt;Listbox v-model="selectedCars" :options="cars" :multiple="true" :filter="true" optionLabel="brand" listStyle="max-height:250px" style="width:15em"&gt;
 	&lt;template #option="slotProps"&gt;
 		&lt;div class="p-clearfix"&gt;
-			&lt;img :alt="slotProps.option.brand" :src="'/demo/images/car/' + slotProps.option.brand + '.png'" style="display:inline-block;margin:5px 0 0 5px;width:48px" /&gt;
+			&lt;img :alt="slotProps.option.brand" :src="'demo/images/car/' + slotProps.option.brand + '.png'" style="display:inline-block;margin:5px 0 0 5px;width:48px" /&gt;
 			&lt;span style="float:right;margin:1.25em .5em 0 0"&gt;{{slotProps.option.brand}}&lt;/span&gt;
 		&lt;/div&gt;
 	&lt;/template&gt;
@@ -229,7 +229,7 @@ data() {
 			&lt;Listbox v-model="selectedCars" :options="cars" :multiple="true" :filter="true" optionLabel="brand" listStyle="max-height:250px" style="width:15em"&gt;
 				&lt;template #option="slotProps"&gt;
 					&lt;div class="p-clearfix"&gt;
-						&lt;img :alt="slotProps.option.brand" :src="'/demo/images/car/' + slotProps.option.brand + '.png'" style="display:inline-block;margin:5px 0 0 5px;width:48px" /&gt;
+						&lt;img :alt="slotProps.option.brand" :src="'demo/images/car/' + slotProps.option.brand + '.png'" style="display:inline-block;margin:5px 0 0 5px;width:48px" /&gt;
 						&lt;span style="float:right;margin:1.25em .5em 0 0"&gt;{{slotProps.option.brand}}&lt;/span&gt;
 					&lt;/div&gt;
 				&lt;/template&gt;
diff --git a/src/views/multiselect/MultiSelectDemo.vue b/src/views/multiselect/MultiSelectDemo.vue
index cb766f11a..8ac93dea5 100644
--- a/src/views/multiselect/MultiSelectDemo.vue
+++ b/src/views/multiselect/MultiSelectDemo.vue
@@ -15,7 +15,7 @@
             <MultiSelect v-model="selectedCars2" :options="cars" optionLabel="brand" placeholder="Select a Car" :filter="true">
                 <template #value="slotProps">
                     <div class="p-multiselect-car-token" v-for="option of slotProps.value" :key="option.brand">
-                        <img :alt="option.brand" :src="'/demo/images/car/' + option.brand + '.png'" />
+                        <img :alt="option.brand" :src="'demo/images/car/' + option.brand + '.png'" />
                         <span>{{option.brand}}</span>
                     </div>
                     <div class="p-multiselect-empty-car-token" v-if="!slotProps.value || slotProps.value.length === 0">
@@ -24,7 +24,7 @@
                 </template>
                 <template #option="slotProps">
                     <div class="p-multiselect-car-option">
-                        <img :alt="slotProps.option.brand" :src="'/demo/images/car/' + slotProps.option.brand + '.png'" />
+                        <img :alt="slotProps.option.brand" :src="'demo/images/car/' + slotProps.option.brand + '.png'" />
                         <span>{{slotProps.option.brand}}</span>
                     </div>
                 </template>
diff --git a/src/views/multiselect/MultiSelectDoc.vue b/src/views/multiselect/MultiSelectDoc.vue
index 0a96da2ad..0d4a5d358 100644
--- a/src/views/multiselect/MultiSelectDoc.vue
+++ b/src/views/multiselect/MultiSelectDoc.vue
@@ -40,7 +40,7 @@ data() {
 &lt;MultiSelect v-model="selectedCars2" :options="cars" optionLabel="brand" placeholder="Select a Car"&gt;
 	&lt;template #value="slotProps"&gt;
 		&lt;div class="p-multiselect-car-token" v-for="option of slotProps.value" :key="option.brand"&gt;
-			&lt;img :alt="option.brand" :src="'/demo/images/car/' + option.brand + '.png'" /&gt;
+			&lt;img :alt="option.brand" :src="'demo/images/car/' + option.brand + '.png'" /&gt;
 			&lt;span&gt;{{option.brand}}&lt;/span&gt;
 		&lt;/div&gt;
 		&lt;div class="p-multiselect-empty-car-token" v-if="!slotProps.value || slotProps.value.length === 0"&gt;
@@ -49,7 +49,7 @@ data() {
 	&lt;/template&gt;
 	&lt;template #option="slotProps"&gt;
 		&lt;div class="p-multiselect-car-option"&gt;
-			&lt;img :alt="slotProps.option.brand" :src="'/demo/images/car/' + slotProps.option.brand + '.png'" /&gt;
+			&lt;img :alt="slotProps.option.brand" :src="'demo/images/car/' + slotProps.option.brand + '.png'" /&gt;
 			&lt;span&gt;{{slotProps.option.brand}}&lt;/span&gt;
 		&lt;/div&gt;
 	&lt;/template&gt;
@@ -252,7 +252,7 @@ data() {
 			&lt;MultiSelect v-model="selectedCars2" :options="cars" optionLabel="brand" placeholder="Select a Car" :filter="true"&gt;
 				&lt;template #value="slotProps"&gt;
 					&lt;div class="p-multiselect-car-token" v-for="option of slotProps.value" :key="option.brand"&gt;
-						&lt;img :alt="option.brand" :src="'/demo/images/car/' + option.brand + '.png'" /&gt;
+						&lt;img :alt="option.brand" :src="'demo/images/car/' + option.brand + '.png'" /&gt;
 						&lt;span&gt;{{option.brand}}&lt;/span&gt;
 					&lt;/div&gt;
 					&lt;div class="p-multiselect-empty-car-token" v-if="!slotProps.value || slotProps.value.length === 0"&gt;
@@ -261,7 +261,7 @@ data() {
 				&lt;/template&gt;
 				&lt;template #option="slotProps"&gt;
 					&lt;div class="p-multiselect-car-option"&gt;
-						&lt;img :alt="slotProps.option.brand" :src="'/demo/images/car/' + slotProps.option.brand + '.png'" /&gt;
+						&lt;img :alt="slotProps.option.brand" :src="'demo/images/car/' + slotProps.option.brand + '.png'" /&gt;
 						&lt;span&gt;{{slotProps.option.brand}}&lt;/span&gt;
 					&lt;/div&gt;
 				&lt;/template&gt;
diff --git a/src/views/overlaypanel/OverlayPanelDemo.vue b/src/views/overlaypanel/OverlayPanelDemo.vue
index 4dc136709..cda9998fa 100644
--- a/src/views/overlaypanel/OverlayPanelDemo.vue
+++ b/src/views/overlaypanel/OverlayPanelDemo.vue
@@ -11,7 +11,7 @@
             <Button type="button" label="Toggle" @click="toggle" />
 
             <OverlayPanel ref="op" appendTo="body" :showCloseIcon="true">
-                <img src="/demo/images/nature/nature1.jpg" alt="Nature Image">
+                <img src="demo/images/nature/nature1.jpg" alt="Nature Image">
             </OverlayPanel>
         </div>
 
diff --git a/src/views/overlaypanel/OverlayPanelDoc.vue b/src/views/overlaypanel/OverlayPanelDoc.vue
index 70d227509..50046f672 100644
--- a/src/views/overlaypanel/OverlayPanelDoc.vue
+++ b/src/views/overlaypanel/OverlayPanelDoc.vue
@@ -13,7 +13,7 @@ import OverlayPanel from 'primevue/overlaypanel';
 &lt;Button type="button" label="Toggle" @click="toggle" /&gt;
 
 &lt;OverlayPanel ref="op"&gt;
-	&lt;img src="/demo/images/nature/nature1.jpg" alt="Nature Image"&gt;
+	&lt;img src="demo/images/nature/nature1.jpg" alt="Nature Image"&gt;
 &lt;/OverlayPanel&gt;
 </CodeHighlight>
 
@@ -28,7 +28,7 @@ toggle(event) {
 					Additionally enabling <i>showCloseIcon</i> property displays a close icon at the top right corner to close the panel.</p>
 <CodeHighlight>
 &lt;OverlayPanel ref="op" :showCloseIcon="true" :dismissable="true"&gt;
-	&lt;img src="/demo/images/nature/nature1.jpg" alt="Nature Image"&gt;
+	&lt;img src="demo/images/nature/nature1.jpg" alt="Nature Image"&gt;
 &lt;/OverlayPanel&gt;
 </CodeHighlight>
 
@@ -159,7 +159,7 @@ toggle(event) {
 			&lt;Button type="button" label="Toggle" @click="toggle" /&gt;
 
 			&lt;OverlayPanel ref="op" appendTo="body" :showCloseIcon="true"&gt;
-				&lt;img src="/demo/images/nature/nature1.jpg" alt="Nature Image"&gt;
+				&lt;img src="demo/images/nature/nature1.jpg" alt="Nature Image"&gt;
 			&lt;/OverlayPanel&gt;
 		&lt;/div&gt;
 	&lt;/div&gt;
diff --git a/src/views/paginator/PaginatorDemo.vue b/src/views/paginator/PaginatorDemo.vue
index b3185d0ae..0546c8149 100644
--- a/src/views/paginator/PaginatorDemo.vue
+++ b/src/views/paginator/PaginatorDemo.vue
@@ -22,7 +22,7 @@
             </Paginator>
 
             <div class="image-gallery">
-                <img :src="'/demo/images/nature/' + image + '.jpg'" />
+                <img :src="'demo/images/nature/' + image + '.jpg'" />
             </div>
 		</div>
 
diff --git a/src/views/paginator/PaginatorDoc.vue b/src/views/paginator/PaginatorDoc.vue
index 2128ca78d..36f51e8b3 100644
--- a/src/views/paginator/PaginatorDoc.vue
+++ b/src/views/paginator/PaginatorDoc.vue
@@ -243,7 +243,7 @@ onPage(event) {
             &lt;/Paginator&gt;
 
             &lt;div class="image-gallery"&gt;
-                &lt;img :src="&#39;/demo/images/nature/&#39; + image + &#39;.jpg&#39;" /&gt;
+                &lt;img :src="&#39;demo/images/nature/&#39; + image + &#39;.jpg&#39;" /&gt;
             &lt;/div&gt;
 		&lt;/div&gt;
 
diff --git a/src/views/selectbutton/SelectButtonDemo.vue b/src/views/selectbutton/SelectButtonDemo.vue
index aeb1a3aca..fa37e9ceb 100644
--- a/src/views/selectbutton/SelectButtonDemo.vue
+++ b/src/views/selectbutton/SelectButtonDemo.vue
@@ -20,7 +20,7 @@
             <SelectButton v-model="selectedCar" :options="cars" optionLabel="brand">
                 <template #option="slotProps">
                     <div style="text-align: center; padding: 1em; width: 125px">
-                        <img :alt="slotProps.option.brand" :src="'/demo/images/car/' + slotProps.option.brand + '.png'" style="width:48px" />
+                        <img :alt="slotProps.option.brand" :src="'demo/images/car/' + slotProps.option.brand + '.png'" style="width:48px" />
                         <div style="margin-top: 1em">{{slotProps.option.brand}}</div>
                     </div>
                 </template>
diff --git a/src/views/selectbutton/SelectButtonDoc.vue b/src/views/selectbutton/SelectButtonDoc.vue
index 1cdf22ef6..a55658a89 100644
--- a/src/views/selectbutton/SelectButtonDoc.vue
+++ b/src/views/selectbutton/SelectButtonDoc.vue
@@ -41,7 +41,7 @@ export default {
 &lt;SelectButton v-model="selectedCar" :options="cars" optionLabel="brand"&gt;
 	&lt;template #option="slotProps"&gt;
 		&lt;div style="text-align: center; padding: 1em; width: 125px"&gt;
-			&lt;img :alt="slotProps.option.brand" :src="'/demo/images/car/' + slotProps.option.brand + '.png'" style="width:48px" /&gt;
+			&lt;img :alt="slotProps.option.brand" :src="'demo/images/car/' + slotProps.option.brand + '.png'" style="width:48px" /&gt;
 			&lt;div style="margin-top: 1em"&gt;{{slotProps.option.brand}}&lt;/div&gt;
 		&lt;/div&gt;
 	&lt;/template&gt;
@@ -176,7 +176,7 @@ export default {
 			&lt;SelectButton v-model="selectedCar" :options="cars" optionLabel="brand"&gt;
 				&lt;template #option="slotProps"&gt;
 					&lt;div style="text-align: center; padding: 1em; width: 125px"&gt;
-						&lt;img :alt="slotProps.option.brand" :src="'/demo/images/car/' + slotProps.option.brand + '.png'" style="width:48px" /&gt;
+						&lt;img :alt="slotProps.option.brand" :src="'demo/images/car/' + slotProps.option.brand + '.png'" style="width:48px" /&gt;
 						&lt;div style="margin-top: 1em"&gt;{{slotProps.option.brand}}&lt;/div&gt;
 					&lt;/div&gt;
 				&lt;/template&gt;