diff --git a/src/lib/cards/BlueskyProfileCard/BlueskyProfileCard.svelte b/src/lib/cards/BlueskyProfileCard/BlueskyProfileCard.svelte
new file mode 100644
index 0000000..df0fdb7
--- /dev/null
+++ b/src/lib/cards/BlueskyProfileCard/BlueskyProfileCard.svelte
@@ -0,0 +1,20 @@
+<script lang="ts">
+	import type { Item } from '$lib/types';
+
+	let { item }: { item: Item } = $props();
+</script>
+
+<a
+	target="_blank"
+	href="/{item.cardData.handle}"
+	class="flex h-full w-full flex-col items-center justify-center gap-2 rounded-xl p-2 transition-colors duration-150"
+>
+	<img
+		src={item.cardData.avatar}
+		class="aspect-square size-24 rounded-full transition-all duration-100 group-hover:scale-105"
+		alt=""
+	/>
+	<div class="text-md line-clamp-1 text-center font-bold">
+		{item.cardData.displayName || item.cardData.handle}
+	</div>
+</a>
diff --git a/src/lib/cards/BlueskyProfileCard/index.ts b/src/lib/cards/BlueskyProfileCard/index.ts
new file mode 100644
index 0000000..0e001dc
--- /dev/null
+++ b/src/lib/cards/BlueskyProfileCard/index.ts
@@ -0,0 +1,13 @@
+import type { CardDefinition } from '../types';
+import BlueskyProfileCard from './BlueskyProfileCard.svelte';
+
+export const BlueskyProfileCardDefinition = {
+	type: 'blueskyProfile',
+	contentComponent: BlueskyProfileCard,
+	createNew: (card) => {
+		// card.w = 4;
+		// card.mobileW = 8;
+		// card.h = 4;
+		// card.mobileH = 8;
+	}
+} as CardDefinition & { type: 'blueskyProfile' };
diff --git a/src/lib/cards/index.ts b/src/lib/cards/index.ts
index e892695..c46d424 100644
--- a/src/lib/cards/index.ts
+++ b/src/lib/cards/index.ts
@@ -14,6 +14,7 @@ import { UpdatedBlentosCardDefitition } from './SpecialCards/UpdatedBlentos';
 import { TextCardDefinition } from './TextCard';
 import type { CardDefinition } from './types';
 import { YoutubeCardDefinition } from './YoutubeVideo';
+import { BlueskyProfileCardDefinition } from './BlueskyProfileCard';
 
 export const AllCardDefinitions = [
 	ImageCardDefinition,
@@ -30,7 +31,8 @@ export const AllCardDefinitions = [
 	ATProtoCollectionsCardDefinition,
 	SectionCardDefinition,
 	BlueskyMediaCardDefinition,
-	DinoGameCardDefinition
+	DinoGameCardDefinition,
+	BlueskyProfileCardDefinition
 ] as const;
 
 export const CardDefinitionsByType = AllCardDefinitions.reduce(
diff --git a/src/routes/all/+page.server.ts b/src/routes/all/+page.server.ts
new file mode 100644
index 0000000..bb56926
--- /dev/null
+++ b/src/routes/all/+page.server.ts
@@ -0,0 +1,34 @@
+import { env } from '$env/dynamic/public';
+import type { UserCache, WebsiteData } from '$lib/types.js';
+import { loadData } from '$lib/website/load';
+import type { ProfileViewDetailed } from '@atproto/api/dist/client/types/app/bsky/actor/defs.js';
+
+export async function load({ platform }) {
+	const cache = platform?.env?.USER_DATA_CACHE;
+
+	const list = await cache?.list();
+
+	const profiles: ProfileViewDetailed[] = [];
+	for (const value of list?.keys ?? []) {
+		// check if at least one card
+		const result = await cache?.get(value.name);
+		if (!result) continue;
+		const parsed = JSON.parse(result) as WebsiteData;
+
+		if (parsed.version !== 1 || !parsed.cards?.length) continue;
+
+		profiles.push(parsed.profile);
+	}
+
+	profiles.sort((a, b) => a.handle.localeCompare(b.handle));
+
+	const handle = env.PUBLIC_HANDLE;
+
+	const data = await loadData(handle, cache as unknown as UserCache);
+
+	data.publication ??= {};
+	data.publication.preferences ??= {};
+	data.publication.preferences.hideProfile = true;
+
+	return { ...data, profiles };
+}
diff --git a/src/routes/all/+page.svelte b/src/routes/all/+page.svelte
new file mode 100644
index 0000000..4fabebf
--- /dev/null
+++ b/src/routes/all/+page.svelte
@@ -0,0 +1,32 @@
+<script lang="ts">
+	import { createEmptyCard, refreshData } from '$lib/helper.js';
+	import Website from '$lib/website/Website.svelte';
+	import { onMount } from 'svelte';
+
+	let { data } = $props();
+
+	$inspect(data.profiles);
+</script>
+
+<Website
+	data={{
+		...data,
+		cards: data.profiles.map((v, i) => {
+			const card = createEmptyCard('');
+			card.cardType = 'blueskyProfile';
+			card.cardData = {
+				avatar: v.avatar,
+				handle: v.handle,
+				displayName: v.displayName
+			};
+
+			card.x = (i % 4) * 2;
+			card.y = Math.floor(i / 4) * 2;
+
+			card.mobileX = (i % 2) * 4;
+			card.mobileY = Math.floor(i / 2) * 4;
+
+			return card;
+		})
+	}}
+/>