diff --git a/packages/berlin/src/components/skeleton/Skeleton.tsx b/packages/berlin/src/components/skeleton/Skeleton.tsx
new file mode 100644
index 00000000..619fc126
--- /dev/null
+++ b/packages/berlin/src/components/skeleton/Skeleton.tsx
@@ -0,0 +1,8 @@
+import { useAppStore } from '@/store';
+
+export default function Skeleton({ className }: React.HTMLAttributes<HTMLDivElement>) {
+  const theme = useAppStore((state) => state.theme);
+  return (
+    <div className={`${className} animate-pulse ${theme === 'dark' ? 'bg-[#333]' : 'bg-[#eee]'}`} />
+  );
+}
diff --git a/packages/berlin/src/components/skeleton/index.ts b/packages/berlin/src/components/skeleton/index.ts
new file mode 100644
index 00000000..415f4d2c
--- /dev/null
+++ b/packages/berlin/src/components/skeleton/index.ts
@@ -0,0 +1 @@
+export { default } from './Skeleton';
diff --git a/packages/berlin/src/pages/Event.tsx b/packages/berlin/src/pages/Event.tsx
index c8e079a3..22b8093a 100644
--- a/packages/berlin/src/pages/Event.tsx
+++ b/packages/berlin/src/pages/Event.tsx
@@ -17,10 +17,11 @@ import Cycles from '../components/cycles';
 import Link from '../components/link';
 import Markdown from 'react-markdown';
 import Onboarding from '@/components/onboarding';
+import Skeleton from '@/components/skeleton';
 
 function Event() {
   const { eventId } = useParams();
-  const { data: event } = useQuery({
+  const { data: event, isLoading } = useQuery({
     queryKey: ['event', eventId],
     queryFn: () =>
       fetchEvent({ eventId: eventId || '', serverUrl: import.meta.env.VITE_SERVER_URL }),
@@ -49,6 +50,19 @@ function Event() {
     [openCycles],
   );
 
+  if (isLoading) {
+    return (
+      <div className="grid w-full grid-cols-3 gap-4">
+        <div className="col-span-3 flex flex-col gap-4 md:col-span-2">
+          <Skeleton className="h-[100px] md:h-[212px]" />
+          <Skeleton className="h-[50px] md:h-[122px]" />
+        </div>
+        <Skeleton className="col-span-3 h-[250px] md:col-span-1 md:h-[350px]" />
+        <Skeleton className="col-span-3 h-[200px]" />
+      </div>
+    );
+  }
+
   return (
     <>
       <Onboarding steps={eventSteps} type="event" />