diff --git a/public/apple_emojis/bust-in-silhouette.png b/public/apple_emojis/bust-in-silhouette.png
new file mode 100644
index 0000000000..40607d093a
Binary files /dev/null and b/public/apple_emojis/bust-in-silhouette.png differ
diff --git a/public/apple_emojis/compass.png b/public/apple_emojis/compass.png
new file mode 100644
index 0000000000..e182becd9b
Binary files /dev/null and b/public/apple_emojis/compass.png differ
diff --git a/public/apple_emojis/people-with-bunny-ears.png b/public/apple_emojis/people-with-bunny-ears.png
new file mode 100644
index 0000000000..d1d62261ba
Binary files /dev/null and b/public/apple_emojis/people-with-bunny-ears.png differ
diff --git a/public/apple_emojis/sparkles.png b/public/apple_emojis/sparkles.png
new file mode 100644
index 0000000000..532afeea06
Binary files /dev/null and b/public/apple_emojis/sparkles.png differ
diff --git a/public/apple_emojis/speech-balloon.png b/public/apple_emojis/speech-balloon.png
new file mode 100644
index 0000000000..4fca65a66e
Binary files /dev/null and b/public/apple_emojis/speech-balloon.png differ
diff --git a/public/apple_emojis/star.png b/public/apple_emojis/star.png
new file mode 100644
index 0000000000..04196162d3
Binary files /dev/null and b/public/apple_emojis/star.png differ
diff --git a/public/apple_emojis/technologist.png b/public/apple_emojis/technologist.png
new file mode 100644
index 0000000000..fb9f2f4739
Binary files /dev/null and b/public/apple_emojis/technologist.png differ
diff --git a/public/apple_emojis/unlocked.png b/public/apple_emojis/unlocked.png
new file mode 100644
index 0000000000..3ef4ff6f32
Binary files /dev/null and b/public/apple_emojis/unlocked.png differ
diff --git a/src/app/(marketing)/create-profile/_components/Benefits.tsx b/src/app/(marketing)/create-profile/_components/Benefits.tsx
index e9c2fd4a92..923d5c957a 100644
--- a/src/app/(marketing)/create-profile/_components/Benefits.tsx
+++ b/src/app/(marketing)/create-profile/_components/Benefits.tsx
@@ -1,5 +1,6 @@
import { Card } from "@/components/ui/Card"
import { cn } from "@/lib/utils"
+import Image from "next/image"
import { BENEFITS } from "../constants"
export const Benefits = () => {
@@ -12,7 +13,7 @@ export const Benefits = () => {
All passes provide the same benefits
- {BENEFITS.map(({ title, description, isAvailable }) => (
+ {BENEFITS.map(({ title, description, isAvailable, image }) => (
{
{ "bg-muted": !isAvailable }
)}
>
- #
+
{title}
diff --git a/src/app/(marketing)/create-profile/constants.ts b/src/app/(marketing)/create-profile/constants.ts
index a2f9fe6a8d..97d0c0bda3 100644
--- a/src/app/(marketing)/create-profile/constants.ts
+++ b/src/app/(marketing)/create-profile/constants.ts
@@ -1,3 +1,13 @@
+import { StaticImageData } from "next/image"
+import bustInSilhouette from "/public/apple_emojis/bust-in-silhouette.png"
+import compass from "/public/apple_emojis/compass.png"
+import peopleWithBunnyEars from "/public/apple_emojis/people-with-bunny-ears.png"
+import sparkles from "/public/apple_emojis/sparkles.png"
+import speechBalloon from "/public/apple_emojis/speech-balloon.png"
+import star from "/public/apple_emojis/star.png"
+import technologist from "/public/apple_emojis/technologist.png"
+import unlocked from "/public/apple_emojis/unlocked.png"
+
export const SUBSCRIPTIONS = [
{
title: "Single Pass",
@@ -30,49 +40,58 @@ export const BENEFITS = [
title: "Launch your Guild Profile",
description: "Your onchain profile with achievements and XP level ",
isAvailable: true,
+ image: star,
},
{
title: "Unlock exclusive rewards",
description: "Pass holders can access unique and one-off rewards from guilds",
isAvailable: true,
+ image: bustInSilhouette,
},
{
title: "Get early access to Guild features",
description: "Be the first to unlock and experience our newest features",
isAvailable: true,
+ image: unlocked,
},
{
title: "Priority support",
description:
"Get help within hours — even our CEO is answering priority tickets",
isAvailable: true,
+ image: speechBalloon,
},
{
title: "Manage your personal Guild",
description:
"Special access to gamified features to help creators engage their audience",
isAvailable: false,
+ image: technologist,
},
{
title: "Alpha Explorer",
description:
"Unlock secret guilds and earn exclusive rewards before they become popular",
isAvailable: false,
+ image: compass,
},
{
title: "Be part of Gold community",
description:
"Shape Guild's future — your ideas drive what we build and when we build it",
isAvailable: false,
+ image: peopleWithBunnyEars,
},
{
title: "Very top secret stuff",
description:
"There are things we can't tell you just yet — you'll have to see them for yourself",
isAvailable: false,
+ image: sparkles,
},
] as const satisfies {
title: string
description: string
isAvailable: boolean
+ image: StaticImageData
}[]