diff --git a/components/user-item.tsx b/components/user-item.tsx
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..b24bb87602410be9681ee3c2a3fda8bcd24b6b5d 100644
--- a/components/user-item.tsx
+++ b/components/user-item.tsx
@@ -0,0 +1,23 @@
+import { User } from "@/components/ui/user";
+import Image from "next/image";
+import Link from "next/link";
+
+// this is a single user helper-component, only for design purposes
+export default function User({ id, userName, image }: { id: number, userName: string, image: { url: string } }) {
+    return (
+        <User>
+            <Link href={`/user/${id}`}>
+                <div className="">
+                    <Image
+                        src={image.url}
+                        alt={userName}
+                        width={264}
+                        height={374}
+                        priority={true}
+                        style={{ width: '100%', height: '100%' }} />
+                </div>
+            </Link>
+            <p className="truncate">{userName}</p>
+        </User>
+    )
+}
\ No newline at end of file