diff --git a/components/molecules/VImg/VImg.vue b/components/molecules/VImg/VImg.vue
index 0377ca6..ce192d0 100644
--- a/components/molecules/VImg/VImg.vue
+++ b/components/molecules/VImg/VImg.vue
@@ -55,11 +55,11 @@ export default defineComponent({
         const width = computed(() => parseSize(props.width))
         const height = computed(() => parseSize(props.height))
         const modifiers = computed<ImageOptions['modifiers']>(() => ({
+            ...props.modifiers,
             width: width.value,
             height: height.value,
-            quality: getInt(props.quality) || $img.options.quality,
-            format: props.format,
-            ...props.modifiers,
+            quality: getInt(props.quality || props.modifiers?.quality) || $img.options.quality,
+            format: props.format || props.modifiers?.format,
         }))
         const options = computed<ImageOptions>(() => ({
             provider: props.provider,
diff --git a/components/molecules/VRoadizImage/VRoadizImage.vue b/components/molecules/VRoadizImage/VRoadizImage.vue
index 8b80b79..f3658ea 100644
--- a/components/molecules/VRoadizImage/VRoadizImage.vue
+++ b/components/molecules/VRoadizImage/VRoadizImage.vue
@@ -59,7 +59,10 @@ export default defineComponent({
                         ($img.options.presets?.default?.sizes || $img.options.screens)) ||
                     undefined,
                 provider: 'interventionRequest',
-                modifiers: modifiers.value,
+                modifiers: {
+                    ...modifiers.value,
+                    format: props.format || 'webp',
+                },
             }
         })
         const imageComponent = h(isPicture.value ? VPicture : VImg, imageComponentProps.value, slots.default)