diff --git a/packages/nc-gui-v2/components/cell/attachment/Carousel.vue b/packages/nc-gui-v2/components/cell/attachment/Carousel.vue
index ee5eb47d24..cc92d6daf5 100644
--- a/packages/nc-gui-v2/components/cell/attachment/Carousel.vue
+++ b/packages/nc-gui-v2/components/cell/attachment/Carousel.vue
@@ -86,7 +86,7 @@ onClickOutside(carouselRef, () => {
 
           <template #customPaging="props">
             <a>
-              <img
+              <nuxt-img
                 class="!block"
                 :alt="imageItems[props.i].title || `#${props.i}`"
                 :src="imageItems[props.i].url || imageItems[props.i].data"
diff --git a/packages/nc-gui-v2/components/cell/attachment/index.vue b/packages/nc-gui-v2/components/cell/attachment/index.vue
index 245677c7e2..d629504a5c 100644
--- a/packages/nc-gui-v2/components/cell/attachment/index.vue
+++ b/packages/nc-gui-v2/components/cell/attachment/index.vue
@@ -100,7 +100,7 @@ onMounted(() => {
     </div>
 
     <template v-if="visibleItems.length">
-      <div ref="sortableRef" :class="{ dragging }" class="flex flex-wrap gap-2 py-1 scrollbar-thin-primary">
+      <div ref="sortableRef" :class="{ dragging }" class="flex flex-wrap gap-2 p-1 scrollbar-thin-primary">
         <div
           v-for="(item, i) of visibleItems"
           :id="item.url"
@@ -114,8 +114,9 @@ onMounted(() => {
               <div class="text-center w-full">{{ item.title }}</div>
             </template>
 
-            <img
+            <nuxt-img
               v-if="isImage(item.title, item.mimetype)"
+              placeholder
               width="150"
               height="150"
               :alt="item.title || `#${i}`"