diff --git a/Channel-Frontend/src/features/assets/components/AssetCard.tsx b/Channel-Frontend/src/features/assets/components/AssetCard.tsx
index 1b8b60b..fa29a4d 100644
--- a/Channel-Frontend/src/features/assets/components/AssetCard.tsx
+++ b/Channel-Frontend/src/features/assets/components/AssetCard.tsx
@@ -85,8 +85,28 @@ export const AssetCard: React.FC<AssetCardProps> = ({
     const isOffice = type.includes('word') || type.includes('presentation') || type.includes('sheet') || 
                      url.toLowerCase().endsWith('.docx') || url.toLowerCase().endsWith('.doc') || 
                      url.toLowerCase().endsWith('.pptx') || url.toLowerCase().endsWith('.ppt') || 
-                     url.toLowerCase().endsWith('.xlsx') || url.toLowerCase().endsWith('.xls');
-    return type === 'url' || type.includes('pdf') || type.includes('image') || type.includes('png') || type.includes('jpg') || isOffice;
+                     url.toLowerCase().endsWith('.xlsx') || url.toLowerCase().endsWith('.xls') ||
+                     url.toLowerCase().endsWith('.csv') || type.includes('csv');
+
+    const isTextOrCode = url.toLowerCase().endsWith('.md') ||
+                         url.toLowerCase().endsWith('.txt') ||
+                         url.toLowerCase().endsWith('.json') ||
+                         url.toLowerCase().endsWith('.js') ||
+                         url.toLowerCase().endsWith('.ts') ||
+                         url.toLowerCase().endsWith('.tsx') ||
+                         url.toLowerCase().endsWith('.jsx') ||
+                         url.toLowerCase().endsWith('.py') ||
+                         url.toLowerCase().endsWith('.yaml') ||
+                         url.toLowerCase().endsWith('.yml') ||
+                         url.toLowerCase().endsWith('.css') ||
+                         url.toLowerCase().endsWith('.html') ||
+                         url.toLowerCase().endsWith('.sh') ||
+                         type.includes('text') ||
+                         type.includes('markdown') ||
+                         type.includes('json') ||
+                         type.includes('javascript');
+
+    return type === 'url' || type.includes('pdf') || type.includes('image') || type.includes('png') || type.includes('jpg') || isOffice || isTextOrCode;
   };
 
   const getFullAssetUrl = (url: string) => {
diff --git a/Channel-Frontend/src/features/assets/components/AssetViewerModal.tsx b/Channel-Frontend/src/features/assets/components/AssetViewerModal.tsx
index b05a022..7d64b04 100644
--- a/Channel-Frontend/src/features/assets/components/AssetViewerModal.tsx
+++ b/Channel-Frontend/src/features/assets/components/AssetViewerModal.tsx
@@ -605,12 +605,14 @@ export const AssetViewerModal: React.FC<AssetViewerModalProps> = ({
                         min-width: 100%;
                         font-size: 11px;
                         font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+                        color: #0f172a;
                       }
                       .excel-preview-container th, .excel-preview-container td {
                         border: 1px solid #e2e8f0;
                         padding: 6px 12px;
                         text-align: left;
                         white-space: nowrap;
+                        color: #0f172a;
                       }
                       .excel-preview-container tr:nth-child(even) {
                         background-color: #f8fafc;
diff --git a/Channel-Frontend/src/features/assets/components/SpreadsheetThumbnail.tsx b/Channel-Frontend/src/features/assets/components/SpreadsheetThumbnail.tsx
index 9c5bba0..396f0bb 100644
--- a/Channel-Frontend/src/features/assets/components/SpreadsheetThumbnail.tsx
+++ b/Channel-Frontend/src/features/assets/components/SpreadsheetThumbnail.tsx
@@ -89,6 +89,7 @@ export const SpreadsheetThumbnail: React.FC<SpreadsheetThumbnailProps> = ({ url,
             width: 100%;
             font-size: 10px;
             font-family: monospace;
+            color: #0f172a;
           }
           .excel-thumbnail-container td {
             border: 1px solid #cbd5e1;
@@ -96,6 +97,7 @@ export const SpreadsheetThumbnail: React.FC<SpreadsheetThumbnailProps> = ({ url,
             white-space: nowrap;
             overflow: hidden;
             text-overflow: ellipsis;
+            color: #0f172a;
           }
           .excel-thumbnail-container tr:nth-child(even) {
             background-color: #f8fafc;