diff --git a/backend/workers/thumbnails.go b/backend/workers/thumbnails.go
index a3dd8f6..e30d332 100644
--- a/backend/workers/thumbnails.go
+++ b/backend/workers/thumbnails.go
@@ -218,7 +218,8 @@ func generateOfficeThumbnail(filePath, destPath string, cfg *config.Config) erro
 				"ignorePrintArea": true,
 				"printGridlines":  true,
 				"printHeadings":   true,
-				"fitToWidth":      1,
+				"fitToWidth":      0,
+				"orientation":     "landscape",
 			},
 		}
 		pdfUrl, err := callConvert(pdfPayload)
diff --git a/frontend/src/components/FileExplorer.tsx b/frontend/src/components/FileExplorer.tsx
index 4d2e8e8..58b95cd 100644
--- a/frontend/src/components/FileExplorer.tsx
+++ b/frontend/src/components/FileExplorer.tsx
@@ -1222,10 +1222,10 @@ export default function FileExplorer({ onLogout }: FileExplorerProps) {
     })();
 
     if (isMedia && file.checksum && viewMode === 'grid') {
-      const isDoc = file.name.endsWith('.docx') || file.name.endsWith('.pptx') || file.name.endsWith('.xlsx');
+      const docType = file.name.endsWith('.docx') ? 'docs' : file.name.endsWith('.pptx') ? 'slides' : (file.name.endsWith('.xlsx') || file.name.endsWith('.xls')) ? 'sheets' : null;
       return (
         <div className="relative w-full h-full flex items-center justify-center overflow-hidden rounded-md">
-          <ThumbnailImage checksum={file.checksum} fallbackIcon={fallbackIcon} downloadToken={downloadToken} isDocument={isDoc} />
+          <ThumbnailImage checksum={file.checksum} fallbackIcon={fallbackIcon} downloadToken={downloadToken || ''} docType={docType} />
         </div>
       );
     }
diff --git a/frontend/src/components/OfficeHome.tsx b/frontend/src/components/OfficeHome.tsx
index 9106662..9569b96 100644
--- a/frontend/src/components/OfficeHome.tsx
+++ b/frontend/src/components/OfficeHome.tsx
@@ -244,7 +244,7 @@ export default function OfficeHome({ type, onFileSelect, onCreateBlank, onPinCha
         >
           {file.checksum ? (
             <div className="absolute inset-0 w-full h-full flex items-center justify-center z-0">
-              <ThumbnailImage checksum={file.checksum} fallbackIcon={<Icon className="w-16 h-16 text-3xl opacity-30 group-hover:opacity-60 transition-opacity" />} downloadToken={downloadToken} isDocument={true} />
+              <ThumbnailImage checksum={file.checksum} fallbackIcon={<Icon className="w-16 h-16 text-3xl opacity-30 group-hover:opacity-60 transition-opacity" />} downloadToken={downloadToken} docType={type} />
             </div>
           ) : (
             <Icon className="w-16 h-16 text-3xl opacity-30 group-hover:opacity-60 transition-opacity" />
diff --git a/frontend/src/components/ThumbnailImage.tsx b/frontend/src/components/ThumbnailImage.tsx
index ef91d2b..c97a71a 100644
--- a/frontend/src/components/ThumbnailImage.tsx
+++ b/frontend/src/components/ThumbnailImage.tsx
@@ -5,38 +5,66 @@ interface ThumbnailImageProps {
   checksum: string;
   fallbackIcon: React.ReactNode;
   downloadToken: string;
-  isDocument?: boolean;
+  docType?: 'docs' | 'slides' | 'sheets' | null;
 }
 
-export default function ThumbnailImage({ checksum, fallbackIcon, downloadToken, isDocument }: ThumbnailImageProps) {
+export default function ThumbnailImage({ checksum, fallbackIcon, downloadToken, docType }: ThumbnailImageProps) {
   const [errorCount, setErrorCount] = useState(0);
   const [key, setKey] = useState(0);
   const [showFallback, setShowFallback] = useState(false);
 
+  const docStyle = docType === 'docs' 
+    ? 'w-[85%] aspect-[1/1.4] bg-white border border-gray-300 dark:border-gray-600 shadow-md' 
+    : docType === 'slides' 
+    ? 'w-[85%] aspect-[16/9] bg-white border border-gray-300 dark:border-gray-600 shadow-md'
+    : docType === 'sheets'
+    ? 'w-[85%] aspect-[1.4/1] bg-white border border-gray-300 dark:border-gray-600 shadow-md'
+    : 'w-full h-full';
+
+  const imgElement = (
+    <img
+      key={key}
+      src={downloadToken ? `${api.getThumbnailUrl(checksum, downloadToken)}${errorCount > 0 ? `&t=${key}` : ''}` : ''}
+      alt=""
+      className={`object-contain ${docType ? 'w-full h-full object-cover mix-blend-multiply' : 'w-full h-full'}`}
+      style={{ display: showFallback ? 'none' : 'block' }}
+      onError={(e) => {
+        if (errorCount < 20) {
+          e.currentTarget.style.display = 'none';
+          setTimeout(() => {
+            setErrorCount(c => c + 1);
+            setKey(Date.now());
+          }, 2000);
+        } else {
+          setShowFallback(true);
+        }
+      }}
+      onLoad={(e) => {
+        e.currentTarget.style.display = 'block';
+        setShowFallback(false);
+      }}
+    />
+  );
+
+  if (docType) {
+    return (
+      <div 
+        className={`flex items-center justify-center overflow-hidden ${docStyle}`}
+        style={docType === 'sheets' ? {
+          backgroundImage: 'linear-gradient(to right, #f3f4f6 1px, transparent 1px), linear-gradient(to bottom, #f3f4f6 1px, transparent 1px)',
+          backgroundSize: '16px 16px',
+          backgroundPosition: 'left top'
+        } : {}}
+      >
+        {imgElement}
+        {showFallback && fallbackIcon}
+      </div>
+    );
+  }
+
   return (
     <>
-      <img
-        key={key}
-        src={downloadToken ? `${api.getThumbnailUrl(checksum, downloadToken)}${errorCount > 0 ? `&t=${key}` : ''}` : ''}
-        alt=""
-        className={`object-contain ${isDocument ? 'max-w-[85%] max-h-[85%] bg-white border border-gray-300 dark:border-gray-600 shadow-md' : 'w-full h-full'}`}
-        style={{ display: showFallback ? 'none' : 'block' }}
-        onError={(e) => {
-          if (errorCount < 20) {
-            e.currentTarget.style.display = 'none';
-            setTimeout(() => {
-              setErrorCount(c => c + 1);
-              setKey(Date.now());
-            }, 2000);
-          } else {
-            setShowFallback(true);
-          }
-        }}
-        onLoad={(e) => {
-          e.currentTarget.style.display = 'block';
-          setShowFallback(false);
-        }}
-      />
+      {imgElement}
       {showFallback && fallbackIcon}
     </>
   );