diff --git a/components/cards/UserCard.tsx b/components/cards/UserCard.tsx
index 0208d72..699fb0a 100644
--- a/components/cards/UserCard.tsx
+++ b/components/cards/UserCard.tsx
@@ -7,13 +7,20 @@ import Link from "next/link";
 import { ExternalLinkIcon } from "lucide-react";
 
 export function UserCard({ user, subtitle, withLink }: { user: User; subtitle: string, withLink?: boolean }) {
+  const gradientColour = user.flags == 1
+    ? 'rgba(251, 146, 60, 0.6)'
+    : user.flags == 4
+    ? 'rgba(239, 68, 68, 0.6)'
+    : 'transparent';
+  const gradient =  `linear-gradient(to right, white, rgba(255,0,0,0)), repeating-linear-gradient(225deg, transparent, transparent 32px, ${gradientColour} 32px, ${gradientColour} 64px)`;
+
   return (
     <Card
       className="bg-no-repeat bg-right text-left"
       style={{
         backgroundImage: user.profile?.background
-          ? `linear-gradient(to right, white, rgba(255,0,0,0)), url('${AUTUMN_URL}/backgrounds/${user.profile.background._id}')`
-          : "",
+          ? `${gradient}, url('${AUTUMN_URL}/backgrounds/${user.profile.background._id}')`
+          : gradient,
         backgroundSize: "75%",
       }}
     >
@@ -30,6 +37,8 @@ export function UserCard({ user, subtitle, withLink }: { user: User; subtitle: s
             </AvatarFallback>
           </Avatar>
           {user.bot && <Badge className="align-middle">Bot</Badge>}{" "}
+          {user.flags == 1 && <Badge className="align-middle bg-orange-400">Suspended</Badge>}{" "}
+          {user.flags == 4 && <Badge className="align-middle bg-red-700">Banned</Badge>}{" "}
           <div className="flex gap-2">
             {user.username}#{user.discriminator} {user.display_name}
             {