diff --git a/server/routes/auth.ts b/server/routes/auth.ts
index 4e7f77278..560f04d57 100644
--- a/server/routes/auth.ts
+++ b/server/routes/auth.ts
@@ -262,8 +262,6 @@ authRoutes.post('/jellyfin', async (req, res, next) => {
             urlBase: body.urlBase,
           });
 
-    const { externalHostname } = getSettings().jellyfin;
-
     // Try to find deviceId that corresponds to jellyfin user, else generate a new one
     let user = await userRepository.findOne({
       where: { jellyfinUsername: body.username },
@@ -281,11 +279,6 @@ authRoutes.post('/jellyfin', async (req, res, next) => {
     // First we need to attempt to log the user in to jellyfin
     const jellyfinserver = new JellyfinAPI(hostname ?? '', undefined, deviceId);
 
-    const jellyfinHost =
-      externalHostname && externalHostname.length > 0
-        ? externalHostname
-        : hostname;
-
     const ip = req.ip;
     let clientIp;
 
@@ -336,7 +329,7 @@ authRoutes.post('/jellyfin', async (req, res, next) => {
             jellyfinAuthToken: account.AccessToken,
             permissions: Permission.ADMIN,
             avatar: account.User.PrimaryImageTag
-              ? `${jellyfinHost}/Users/${account.User.Id}/Images/Primary/?tag=${account.User.PrimaryImageTag}&quality=90`
+              ? `/Users/${account.User.Id}/Images/Primary/?tag=${account.User.PrimaryImageTag}&quality=90`
               : gravatarUrl(body.email || account.User.Name, {
                   default: 'mm',
                   size: 200,
@@ -355,7 +348,7 @@ authRoutes.post('/jellyfin', async (req, res, next) => {
             jellyfinAuthToken: account.AccessToken,
             permissions: Permission.ADMIN,
             avatar: account.User.PrimaryImageTag
-              ? `${jellyfinHost}/Users/${account.User.Id}/Images/Primary/?tag=${account.User.PrimaryImageTag}&quality=90`
+              ? `/Users/${account.User.Id}/Images/Primary/?tag=${account.User.PrimaryImageTag}&quality=90`
               : gravatarUrl(body.email || account.User.Name, {
                   default: 'mm',
                   size: 200,
@@ -410,7 +403,7 @@ authRoutes.post('/jellyfin', async (req, res, next) => {
       );
       // Update the users avatar with their jellyfin profile pic (incase it changed)
       if (account.User.PrimaryImageTag) {
-        const avatar = `${jellyfinHost}/Users/${account.User.Id}/Images/Primary/?tag=${account.User.PrimaryImageTag}&quality=90`;
+        const avatar = `/Users/${account.User.Id}/Images/Primary/?tag=${account.User.PrimaryImageTag}&quality=90`;
         if (avatar !== user.avatar) {
           const avatarProxy = new ImageProxy('avatar', '');
           avatarProxy.clearCachedImage(user.avatar);
@@ -467,7 +460,7 @@ authRoutes.post('/jellyfin', async (req, res, next) => {
         jellyfinDeviceId: deviceId,
         permissions: settings.main.defaultPermissions,
         avatar: account.User.PrimaryImageTag
-          ? `${jellyfinHost}/Users/${account.User.Id}/Images/Primary/?tag=${account.User.PrimaryImageTag}&quality=90`
+          ? `/Users/${account.User.Id}/Images/Primary/?tag=${account.User.PrimaryImageTag}&quality=90`
           : gravatarUrl(body.email || account.User.Name, {
               default: 'mm',
               size: 200,
diff --git a/server/routes/avatarproxy.ts b/server/routes/avatarproxy.ts
index 65638df2b..e6f6f3b54 100644
--- a/server/routes/avatarproxy.ts
+++ b/server/routes/avatarproxy.ts
@@ -1,5 +1,8 @@
+import { MediaServerType } from '@server/constants/server';
 import ImageProxy from '@server/lib/imageproxy';
+import { getSettings } from '@server/lib/settings';
 import logger from '@server/logger';
+import { getHostname } from '@server/utils/getHostname';
 import { Router } from 'express';
 
 const router = Router();
@@ -7,9 +10,25 @@ const router = Router();
 const avatarImageProxy = new ImageProxy('avatar', '');
 // Proxy avatar images
 router.get('/*', async (req, res) => {
-  const imagePath = req.url.startsWith('/') ? req.url.slice(1) : req.url;
-
+  let imagePath = '';
   try {
+    const jellyfinAvatar = req.url.match(
+      /(\/Users\/\w+\/Images\/Primary\/?\?tag=\w+&quality=90)$/
+    )?.[1];
+    if (!jellyfinAvatar) {
+      const mediaServerType = getSettings().main.mediaServerType;
+      throw new Error(
+        `Provided URL is not ${
+          mediaServerType === MediaServerType.JELLYFIN
+            ? 'a Jellyfin'
+            : 'an Emby'
+        } avatar.`
+      );
+    }
+
+    const imageUrl = new URL(jellyfinAvatar, getHostname());
+    imagePath = imageUrl.toString();
+
     const imageData = await avatarImageProxy.getImage(imagePath);
 
     res.writeHead(200, {
diff --git a/server/routes/settings/index.ts b/server/routes/settings/index.ts
index 30c854af9..3d6b6b0d3 100644
--- a/server/routes/settings/index.ts
+++ b/server/routes/settings/index.ts
@@ -377,11 +377,6 @@ settingsRoutes.get('/jellyfin/library', async (req, res, next) => {
 
 settingsRoutes.get('/jellyfin/users', async (req, res) => {
   const settings = getSettings();
-  const { externalHostname } = settings.jellyfin;
-  const jellyfinHost =
-    externalHostname && externalHostname.length > 0
-      ? externalHostname
-      : getHostname();
 
   const userRepository = getRepository(User);
   const admin = await userRepository.findOneOrFail({
@@ -401,7 +396,7 @@ settingsRoutes.get('/jellyfin/users', async (req, res) => {
     username: user.Name,
     id: user.Id,
     thumb: user.PrimaryImageTag
-      ? `${jellyfinHost}/Users/${user.Id}/Images/Primary/?tag=${user.PrimaryImageTag}&quality=90`
+      ? `/Users/${user.Id}/Images/Primary/?tag=${user.PrimaryImageTag}&quality=90`
       : gravatarUrl(user.Name, { default: 'mm', size: 200 }),
     email: user.Name,
   }));
diff --git a/server/routes/user/index.ts b/server/routes/user/index.ts
index f8a0d41a2..83ad0910b 100644
--- a/server/routes/user/index.ts
+++ b/server/routes/user/index.ts
@@ -516,12 +516,6 @@ router.post(
 
       //const jellyfinUsersResponse = await jellyfinClient.getUsers();
       const createdUsers: User[] = [];
-      const { externalHostname } = getSettings().jellyfin;
-
-      const jellyfinHost =
-        externalHostname && externalHostname.length > 0
-          ? externalHostname
-          : hostname;
 
       jellyfinClient.setUserId(admin.jellyfinUserId ?? '');
       const jellyfinUsers = await jellyfinClient.getUsers();
@@ -546,7 +540,7 @@ router.post(
             email: jellyfinUser?.Name,
             permissions: settings.main.defaultPermissions,
             avatar: jellyfinUser?.PrimaryImageTag
-              ? `${jellyfinHost}/Users/${jellyfinUser.Id}/Images/Primary/?tag=${jellyfinUser.PrimaryImageTag}&quality=90`
+              ? `/Users/${jellyfinUser.Id}/Images/Primary/?tag=${jellyfinUser.PrimaryImageTag}&quality=90`
               : gravatarUrl(jellyfinUser?.Name ?? '', {
                   default: 'mm',
                   size: 200,
diff --git a/src/components/Blacklist/index.tsx b/src/components/Blacklist/index.tsx
index 217f4cefd..a752e95f8 100644
--- a/src/components/Blacklist/index.tsx
+++ b/src/components/Blacklist/index.tsx
@@ -268,6 +268,7 @@ const BlacklistedItem = ({ item, revalidateList }: BlacklistedItemProps) => {
       {title && title.backdropPath && (
         <div className="absolute inset-0 z-0 w-full bg-cover bg-center xl:w-2/3">
           <CachedImage
+            type="tmdb"
             src={`https://image.tmdb.org/t/p/w1920_and_h800_multi_faces/${title.backdropPath}`}
             alt=""
             style={{ width: '100%', height: '100%', objectFit: 'cover' }}
@@ -293,6 +294,7 @@ const BlacklistedItem = ({ item, revalidateList }: BlacklistedItemProps) => {
             className="relative h-auto w-12 flex-shrink-0 scale-100 transform-gpu overflow-hidden rounded-md transition duration-300 hover:scale-105"
           >
             <CachedImage
+              type="tmdb"
               src={
                 title?.posterPath
                   ? `https://image.tmdb.org/t/p/w600_and_h900_bestv2${title.posterPath}`
@@ -355,6 +357,7 @@ const BlacklistedItem = ({ item, revalidateList }: BlacklistedItemProps) => {
                     <Link href={`/users/${item.user.id}`}>
                       <span className="group flex items-center truncate">
                         <CachedImage
+                          type="avatar"
                           src={item.user.avatar}
                           alt=""
                           className="avatar-sm ml-1.5"
diff --git a/src/components/CollectionDetails/index.tsx b/src/components/CollectionDetails/index.tsx
index 9e8ab32ad..d9c9a813c 100644
--- a/src/components/CollectionDetails/index.tsx
+++ b/src/components/CollectionDetails/index.tsx
@@ -198,6 +198,7 @@ const CollectionDetails = ({ collection }: CollectionDetailsProps) => {
       {data.backdropPath && (
         <div className="media-page-bg-image">
           <CachedImage
+            type="tmdb"
             alt=""
             src={`https://image.tmdb.org/t/p/w1920_and_h800_multi_faces/${data.backdropPath}`}
             style={{ width: '100%', height: '100%', objectFit: 'cover' }}
@@ -228,6 +229,7 @@ const CollectionDetails = ({ collection }: CollectionDetailsProps) => {
       <div className="media-header">
         <div className="media-poster">
           <CachedImage
+            type="tmdb"
             src={
               data.posterPath
                 ? `https://image.tmdb.org/t/p/w600_and_h900_bestv2${data.posterPath}`
diff --git a/src/components/Common/CachedImage/index.tsx b/src/components/Common/CachedImage/index.tsx
index 7c0d52c20..b01a47bb4 100644
--- a/src/components/Common/CachedImage/index.tsx
+++ b/src/components/Common/CachedImage/index.tsx
@@ -4,24 +4,34 @@ import Image from 'next/image';
 
 const imageLoader: ImageLoader = ({ src }) => src;
 
+export type CachedImageProps = ImageProps & {
+  src: string;
+  type: 'tmdb' | 'avatar';
+};
+
 /**
  * The CachedImage component should be used wherever
  * we want to offer the option to locally cache images.
  **/
-const CachedImage = ({ src, ...props }: ImageProps) => {
+const CachedImage = ({ src, type, ...props }: CachedImageProps) => {
   const { currentSettings } = useSettings();
 
-  let imageUrl = src;
-
-  if (typeof imageUrl === 'string' && imageUrl.startsWith('http')) {
-    const parsedUrl = new URL(imageUrl);
+  let imageUrl: string;
 
-    if (parsedUrl.host === 'image.tmdb.org') {
-      if (currentSettings.cacheImages)
-        imageUrl = imageUrl.replace('https://image.tmdb.org', '/imageproxy');
-    } else if (parsedUrl.host !== 'gravatar.com') {
-      imageUrl = '/avatarproxy/' + imageUrl;
-    }
+  if (type === 'tmdb') {
+    // tmdb stuff
+    imageUrl =
+      currentSettings.cacheImages && !src.startsWith('/')
+        ? src.replace(/^https:\/\/image\.tmdb\.org\//, '/imageproxy/')
+        : src;
+  } else if (type === 'avatar') {
+    // jellyfin avatar (in any)
+    const jellyfinAvatar = src.match(
+      /(\/Users\/\w+\/Images\/Primary\/?\?tag=\w+&quality=90)$/
+    )?.[1];
+    imageUrl = jellyfinAvatar ? `/avatarproxy` + jellyfinAvatar : src;
+  } else {
+    return null;
   }
 
   return <Image unoptimized loader={imageLoader} src={imageUrl} {...props} />;
diff --git a/src/components/Common/ImageFader/index.tsx b/src/components/Common/ImageFader/index.tsx
index 20ccb6985..930471e94 100644
--- a/src/components/Common/ImageFader/index.tsx
+++ b/src/components/Common/ImageFader/index.tsx
@@ -61,6 +61,7 @@ const ImageFader: ForwardRefRenderFunction<HTMLDivElement, ImageFaderProps> = (
           {...props}
         >
           <CachedImage
+            type="tmdb"
             className="absolute inset-0 h-full w-full"
             alt=""
             src={imageUrl}
diff --git a/src/components/Common/Modal/index.tsx b/src/components/Common/Modal/index.tsx
index 9fbc0bdf8..4930bd85d 100644
--- a/src/components/Common/Modal/index.tsx
+++ b/src/components/Common/Modal/index.tsx
@@ -123,6 +123,7 @@ const Modal = React.forwardRef<HTMLDivElement, ModalProps>(
           {backdrop && (
             <div className="absolute top-0 left-0 right-0 z-0 h-64 max-h-full w-full">
               <CachedImage
+                type="tmdb"
                 alt=""
                 src={backdrop}
                 style={{ width: '100%', height: '100%', objectFit: 'cover' }}
diff --git a/src/components/CompanyCard/index.tsx b/src/components/CompanyCard/index.tsx
index 762333805..84c11bf42 100644
--- a/src/components/CompanyCard/index.tsx
+++ b/src/components/CompanyCard/index.tsx
@@ -33,6 +33,7 @@ const CompanyCard = ({ image, url, name }: CompanyCardProps) => {
     >
       <div className="relative h-full w-full">
         <CachedImage
+          type="tmdb"
           src={image}
           alt={name}
           className="relative z-40 h-full w-full"
diff --git a/src/components/GenreCard/index.tsx b/src/components/GenreCard/index.tsx
index 76467fdca..eb821eebb 100644
--- a/src/components/GenreCard/index.tsx
+++ b/src/components/GenreCard/index.tsx
@@ -36,6 +36,7 @@ const GenreCard = ({ image, url, name, canExpand = false }: GenreCardProps) => {
       tabIndex={0}
     >
       <CachedImage
+        type="tmdb"
         src={image}
         alt=""
         style={{ width: '100%', height: '100%', objectFit: 'cover' }}
diff --git a/src/components/IssueDetails/IssueComment/index.tsx b/src/components/IssueDetails/IssueComment/index.tsx
index ab3f59ad8..5b9dd8739 100644
--- a/src/components/IssueDetails/IssueComment/index.tsx
+++ b/src/components/IssueDetails/IssueComment/index.tsx
@@ -89,7 +89,8 @@ const IssueComment = ({
       </Transition>
       <Link href={isActiveUser ? '/profile' : `/users/${comment.user.id}`}>
         <CachedImage
-          src={`${comment.user.avatar}`}
+          type="avatar"
+          src={comment.user.avatar}
           alt=""
           className="h-10 w-10 scale-100 transform-gpu rounded-full object-cover ring-1 ring-gray-500 transition duration-300 hover:scale-105"
           width={40}
diff --git a/src/components/IssueDetails/index.tsx b/src/components/IssueDetails/index.tsx
index a790fe9d1..5ceb5796c 100644
--- a/src/components/IssueDetails/index.tsx
+++ b/src/components/IssueDetails/index.tsx
@@ -217,6 +217,7 @@ const IssueDetails = () => {
       {data.backdropPath && (
         <div className="media-page-bg-image">
           <CachedImage
+            type="tmdb"
             alt=""
             src={`https://image.tmdb.org/t/p/w1920_and_h800_multi_faces/${data.backdropPath}`}
             style={{ width: '100%', height: '100%', objectFit: 'cover' }}
@@ -235,6 +236,7 @@ const IssueDetails = () => {
       <div className="media-header">
         <div className="media-poster">
           <CachedImage
+            type="tmdb"
             src={
               data.posterPath
                 ? `https://image.tmdb.org/t/p/w600_and_h900_bestv2${data.posterPath}`
@@ -287,7 +289,8 @@ const IssueDetails = () => {
                   className="group ml-1 inline-flex h-full items-center xl:ml-1.5"
                 >
                   <CachedImage
-                    src={`${issueData.createdBy.avatar}`}
+                    type="avatar"
+                    src={issueData.createdBy.avatar}
                     alt=""
                     className="mr-0.5 h-5 w-5 scale-100 transform-gpu rounded-full object-cover transition duration-300 group-hover:scale-105 xl:mr-1 xl:h-6 xl:w-6"
                     width={20}
diff --git a/src/components/IssueList/IssueItem/index.tsx b/src/components/IssueList/IssueItem/index.tsx
index c49a57d4b..7fd58b5e6 100644
--- a/src/components/IssueList/IssueItem/index.tsx
+++ b/src/components/IssueList/IssueItem/index.tsx
@@ -112,6 +112,7 @@ const IssueItem = ({ issue }: IssueItemProps) => {
       {title.backdropPath && (
         <div className="absolute inset-0 z-0 w-full bg-cover bg-center xl:w-2/3">
           <CachedImage
+            type="tmdb"
             src={`https://image.tmdb.org/t/p/w1920_and_h800_multi_faces/${title.backdropPath}`}
             alt=""
             style={{ width: '100%', height: '100%', objectFit: 'cover' }}
@@ -137,6 +138,7 @@ const IssueItem = ({ issue }: IssueItemProps) => {
             className="relative h-auto w-12 flex-shrink-0 scale-100 transform-gpu overflow-hidden rounded-md transition duration-300 hover:scale-105"
           >
             <CachedImage
+              type="tmdb"
               src={
                 title.posterPath
                   ? `https://image.tmdb.org/t/p/w600_and_h900_bestv2${title.posterPath}`
@@ -226,7 +228,8 @@ const IssueItem = ({ issue }: IssueItemProps) => {
                         className="group flex items-center truncate"
                       >
                         <CachedImage
-                          src={'/avatarproxy/' + issue.createdBy.avatar}
+                          type="avatar"
+                          src={issue.createdBy.avatar}
                           alt=""
                           className="avatar-sm ml-1.5 object-cover"
                           width={20}
diff --git a/src/components/Layout/UserDropdown/index.tsx b/src/components/Layout/UserDropdown/index.tsx
index 58f97b445..ee3975250 100644
--- a/src/components/Layout/UserDropdown/index.tsx
+++ b/src/components/Layout/UserDropdown/index.tsx
@@ -57,6 +57,7 @@ const UserDropdown = () => {
           data-testid="user-menu"
         >
           <CachedImage
+            type="avatar"
             className="h-8 w-8 rounded-full object-cover sm:h-10 sm:w-10"
             src={user ? user.avatar : ''}
             alt=""
@@ -80,6 +81,7 @@ const UserDropdown = () => {
             <div className="flex flex-col space-y-4 px-4 py-4">
               <div className="flex items-center space-x-2">
                 <CachedImage
+                  type="avatar"
                   className="h-8 w-8 rounded-full object-cover sm:h-10 sm:w-10"
                   src={user ? user.avatar : ''}
                   alt=""
diff --git a/src/components/ManageSlideOver/index.tsx b/src/components/ManageSlideOver/index.tsx
index 805113c4c..8ce01dc71 100644
--- a/src/components/ManageSlideOver/index.tsx
+++ b/src/components/ManageSlideOver/index.tsx
@@ -369,6 +369,7 @@ const ManageSlideOver = ({
                                     content={user.displayName}
                                   >
                                     <CachedImage
+                                      type="avatar"
                                       src={user.avatar}
                                       alt={user.displayName}
                                       className="h-8 w-8 scale-100 transform-gpu rounded-full object-cover ring-1 ring-gray-500 transition duration-300 hover:scale-105"
@@ -530,6 +531,7 @@ const ManageSlideOver = ({
                                     content={user.displayName}
                                   >
                                     <CachedImage
+                                      type="avatar"
                                       src={user.avatar}
                                       alt={user.displayName}
                                       className="h-8 w-8 scale-100 transform-gpu rounded-full object-cover ring-1 ring-gray-500 transition duration-300 hover:scale-105"
diff --git a/src/components/MovieDetails/index.tsx b/src/components/MovieDetails/index.tsx
index c6583e3df..9a4b50531 100644
--- a/src/components/MovieDetails/index.tsx
+++ b/src/components/MovieDetails/index.tsx
@@ -448,6 +448,7 @@ const MovieDetails = ({ movie }: MovieDetailsProps) => {
       {data.backdropPath && (
         <div className="media-page-bg-image">
           <CachedImage
+            type="tmdb"
             alt=""
             src={`https://image.tmdb.org/t/p/w1920_and_h800_multi_faces/${data.backdropPath}`}
             style={{ width: '100%', height: '100%', objectFit: 'cover' }}
@@ -494,6 +495,7 @@ const MovieDetails = ({ movie }: MovieDetailsProps) => {
       <div className="media-header">
         <div className="media-poster">
           <CachedImage
+            type="tmdb"
             src={
               data.posterPath
                 ? `https://image.tmdb.org/t/p/w600_and_h900_bestv2${data.posterPath}`
@@ -741,6 +743,7 @@ const MovieDetails = ({ movie }: MovieDetailsProps) => {
                 <div className="group relative z-0 scale-100 transform-gpu cursor-pointer overflow-hidden rounded-lg bg-gray-800 bg-cover bg-center shadow-md ring-1 ring-gray-700 transition duration-300 hover:scale-105 hover:ring-gray-500">
                   <div className="absolute inset-0 z-0">
                     <CachedImage
+                      type="tmdb"
                       src={`https://image.tmdb.org/t/p/w1440_and_h320_multi_faces/${data.collection.backdropPath}`}
                       alt=""
                       style={{
diff --git a/src/components/PersonCard/index.tsx b/src/components/PersonCard/index.tsx
index 5263a3722..4d79a469f 100644
--- a/src/components/PersonCard/index.tsx
+++ b/src/components/PersonCard/index.tsx
@@ -51,6 +51,7 @@ const PersonCard = ({
               {profilePath ? (
                 <div className="relative h-full w-3/4 overflow-hidden rounded-full ring-1 ring-gray-700">
                   <CachedImage
+                    type="tmdb"
                     src={`https://image.tmdb.org/t/p/w600_and_h900_bestv2${profilePath}`}
                     alt=""
                     style={{
diff --git a/src/components/PersonDetails/index.tsx b/src/components/PersonDetails/index.tsx
index 5273d0a3d..bccd25bdf 100644
--- a/src/components/PersonDetails/index.tsx
+++ b/src/components/PersonDetails/index.tsx
@@ -227,6 +227,7 @@ const PersonDetails = () => {
         {data.profilePath && (
           <div className="relative mb-6 mr-0 h-36 w-36 flex-shrink-0 overflow-hidden rounded-full ring-1 ring-gray-700 lg:mb-0 lg:mr-6 lg:h-44 lg:w-44">
             <CachedImage
+              type="tmdb"
               src={`https://image.tmdb.org/t/p/w600_and_h900_bestv2${data.profilePath}`}
               alt=""
               style={{ width: '100%', height: '100%', objectFit: 'cover' }}
diff --git a/src/components/RequestCard/index.tsx b/src/components/RequestCard/index.tsx
index af49f75d8..1432148db 100644
--- a/src/components/RequestCard/index.tsx
+++ b/src/components/RequestCard/index.tsx
@@ -116,6 +116,7 @@ const RequestCardError = ({ requestData }: RequestCardErrorProps) => {
                     >
                       <span className="avatar-sm">
                         <CachedImage
+                          type="avatar"
                           src={requestData.requestedBy.avatar}
                           alt=""
                           className="avatar-sm object-cover"
@@ -345,6 +346,7 @@ const RequestCard = ({ request, onTitleData }: RequestCardProps) => {
         {title.backdropPath && (
           <div className="absolute inset-0 z-0">
             <CachedImage
+              type="tmdb"
               alt=""
               src={`https://image.tmdb.org/t/p/w1920_and_h800_multi_faces/${title.backdropPath}`}
               style={{ width: '100%', height: '100%', objectFit: 'cover' }}
@@ -390,6 +392,7 @@ const RequestCard = ({ request, onTitleData }: RequestCardProps) => {
               >
                 <span className="avatar-sm">
                   <CachedImage
+                    type="avatar"
                     src={requestData.requestedBy.avatar}
                     alt=""
                     className="avatar-sm object-cover"
@@ -602,6 +605,7 @@ const RequestCard = ({ request, onTitleData }: RequestCardProps) => {
           className="w-20 flex-shrink-0 scale-100 transform-gpu cursor-pointer overflow-hidden rounded-md shadow-sm transition duration-300 hover:scale-105 hover:shadow-md sm:w-28"
         >
           <CachedImage
+            type="tmdb"
             src={
               title.posterPath
                 ? `https://image.tmdb.org/t/p/w600_and_h900_bestv2${title.posterPath}`
diff --git a/src/components/RequestList/RequestItem/index.tsx b/src/components/RequestList/RequestItem/index.tsx
index e989f2f6f..b14547901 100644
--- a/src/components/RequestList/RequestItem/index.tsx
+++ b/src/components/RequestList/RequestItem/index.tsx
@@ -191,6 +191,7 @@ const RequestItemError = ({
                           >
                             <span className="avatar-sm ml-1.5">
                               <CachedImage
+                                type="avatar"
                                 src={requestData.requestedBy.avatar}
                                 alt=""
                                 className="avatar-sm object-cover"
@@ -250,6 +251,7 @@ const RequestItemError = ({
                         >
                           <span className="avatar-sm ml-1.5">
                             <CachedImage
+                              type="avatar"
                               src={requestData.modifiedBy.avatar}
                               alt=""
                               className="avatar-sm object-cover"
@@ -418,6 +420,7 @@ const RequestItem = ({ request, revalidateList }: RequestItemProps) => {
         {title.backdropPath && (
           <div className="absolute inset-0 z-0 w-full bg-cover bg-center xl:w-2/3">
             <CachedImage
+              type="tmdb"
               src={`https://image.tmdb.org/t/p/w1920_and_h800_multi_faces/${title.backdropPath}`}
               alt=""
               style={{ width: '100%', height: '100%', objectFit: 'cover' }}
@@ -443,6 +446,7 @@ const RequestItem = ({ request, revalidateList }: RequestItemProps) => {
               className="relative h-auto w-12 flex-shrink-0 scale-100 transform-gpu overflow-hidden rounded-md transition duration-300 hover:scale-105"
             >
               <CachedImage
+                type="tmdb"
                 src={
                   title.posterPath
                     ? `https://image.tmdb.org/t/p/w600_and_h900_bestv2${title.posterPath}`
@@ -570,6 +574,7 @@ const RequestItem = ({ request, revalidateList }: RequestItemProps) => {
                         >
                           <span className="avatar-sm ml-1.5">
                             <CachedImage
+                              type="avatar"
                               src={requestData.requestedBy.avatar}
                               alt=""
                               className="avatar-sm object-cover"
@@ -629,6 +634,7 @@ const RequestItem = ({ request, revalidateList }: RequestItemProps) => {
                       >
                         <span className="avatar-sm ml-1.5">
                           <CachedImage
+                            type="avatar"
                             src={requestData.requestedBy.avatar}
                             alt=""
                             className="avatar-sm object-cover"
diff --git a/src/components/RequestModal/AdvancedRequester/index.tsx b/src/components/RequestModal/AdvancedRequester/index.tsx
index 6662b7ace..ad11db82e 100644
--- a/src/components/RequestModal/AdvancedRequester/index.tsx
+++ b/src/components/RequestModal/AdvancedRequester/index.tsx
@@ -562,6 +562,7 @@ const AdvancedRequester = ({
                       <Listbox.Button className="focus:shadow-outline-blue relative w-full cursor-default rounded-md border border-gray-700 bg-gray-800 py-2 pl-3 pr-10 text-left text-white transition duration-150 ease-in-out focus:border-blue-300 focus:outline-none sm:text-sm sm:leading-5">
                         <span className="flex items-center">
                           <CachedImage
+                            type="avatar"
                             src={selectedUser.avatar}
                             alt=""
                             className="h-6 w-6 flex-shrink-0 rounded-full object-cover"
@@ -614,6 +615,7 @@ const AdvancedRequester = ({
                                   } flex items-center`}
                                 >
                                   <CachedImage
+                                    type="avatar"
                                     src={user.avatar}
                                     alt=""
                                     className="h-6 w-6 flex-shrink-0 rounded-full object-cover"
diff --git a/src/components/RequestModal/CollectionRequestModal.tsx b/src/components/RequestModal/CollectionRequestModal.tsx
index b646f7b1d..28aae73a2 100644
--- a/src/components/RequestModal/CollectionRequestModal.tsx
+++ b/src/components/RequestModal/CollectionRequestModal.tsx
@@ -437,6 +437,7 @@ const CollectionRequestModal = ({
                           >
                             <div className="relative h-auto w-10 flex-shrink-0 overflow-hidden rounded-md">
                               <CachedImage
+                                type="tmdb"
                                 src={
                                   part.posterPath
                                     ? `https://image.tmdb.org/t/p/w600_and_h900_bestv2${part.posterPath}`
diff --git a/src/components/Selector/index.tsx b/src/components/Selector/index.tsx
index a371b7f98..db959170b 100644
--- a/src/components/Selector/index.tsx
+++ b/src/components/Selector/index.tsx
@@ -452,6 +452,7 @@ export const WatchProviderSelector = ({
                     tabIndex={0}
                   >
                     <CachedImage
+                      type="tmdb"
                       src={`https://image.tmdb.org/t/p/original${provider.logoPath}`}
                       alt=""
                       style={{
@@ -497,6 +498,7 @@ export const WatchProviderSelector = ({
                       tabIndex={0}
                     >
                       <CachedImage
+                        type="tmdb"
                         src={`https://image.tmdb.org/t/p/original${provider.logoPath}`}
                         alt=""
                         style={{
diff --git a/src/components/TitleCard/index.tsx b/src/components/TitleCard/index.tsx
index 2d10fdf1c..9a0dafec2 100644
--- a/src/components/TitleCard/index.tsx
+++ b/src/components/TitleCard/index.tsx
@@ -346,6 +346,7 @@ const TitleCard = ({
       >
         <div className="absolute inset-0 h-full w-full overflow-hidden">
           <CachedImage
+            type="tmdb"
             className="absolute inset-0 h-full w-full"
             alt=""
             src={
diff --git a/src/components/TvDetails/index.tsx b/src/components/TvDetails/index.tsx
index cf788237b..f4d058a83 100644
--- a/src/components/TvDetails/index.tsx
+++ b/src/components/TvDetails/index.tsx
@@ -471,6 +471,7 @@ const TvDetails = ({ tv }: TvDetailsProps) => {
       {data.backdropPath && (
         <div className="media-page-bg-image">
           <CachedImage
+            type="tmdb"
             alt=""
             src={`https://image.tmdb.org/t/p/w1920_and_h800_multi_faces/${data.backdropPath}`}
             style={{ width: '100%', height: '100%', objectFit: 'cover' }}
@@ -527,6 +528,7 @@ const TvDetails = ({ tv }: TvDetailsProps) => {
       <div className="media-header">
         <div className="media-poster">
           <CachedImage
+            type="tmdb"
             src={
               data.posterPath
                 ? `https://image.tmdb.org/t/p/w600_and_h900_bestv2${data.posterPath}`
diff --git a/src/components/UserList/JellyfinImportModal.tsx b/src/components/UserList/JellyfinImportModal.tsx
index e95a0a7d3..7d9493817 100644
--- a/src/components/UserList/JellyfinImportModal.tsx
+++ b/src/components/UserList/JellyfinImportModal.tsx
@@ -250,6 +250,7 @@ const JellyfinImportModal: React.FC<JellyfinImportProps> = ({
                             <td className="whitespace-nowrap px-1 py-4 text-sm font-medium leading-5 text-gray-100 md:px-6">
                               <div className="flex items-center">
                                 <CachedImage
+                                  type="avatar"
                                   className="h-10 w-10 flex-shrink-0 rounded-full"
                                   src={user.thumb}
                                   alt=""
diff --git a/src/components/UserList/index.tsx b/src/components/UserList/index.tsx
index 27dbdd8e0..95a3c8a67 100644
--- a/src/components/UserList/index.tsx
+++ b/src/components/UserList/index.tsx
@@ -634,6 +634,7 @@ const UserList = () => {
                     className="h-10 w-10 flex-shrink-0"
                   >
                     <CachedImage
+                      type="avatar"
                       className="h-10 w-10 rounded-full object-cover"
                       src={user.avatar}
                       alt=""
diff --git a/src/components/UserProfile/ProfileHeader/index.tsx b/src/components/UserProfile/ProfileHeader/index.tsx
index 998504c69..0050da558 100644
--- a/src/components/UserProfile/ProfileHeader/index.tsx
+++ b/src/components/UserProfile/ProfileHeader/index.tsx
@@ -43,6 +43,7 @@ const ProfileHeader = ({ user, isSettingsPage }: ProfileHeaderProps) => {
         <div className="flex-shrink-0">
           <div className="relative">
             <CachedImage
+              type="avatar"
               className="h-24 w-24 rounded-full bg-gray-600 object-cover ring-1 ring-gray-700"
               src={user.avatar}
               alt=""