diff --git a/src/components/UpdateProfile/SkillProfileAlert.tsx b/src/components/UpdateProfile/SkillProfileAlert.tsx
new file mode 100644
index 000000000..978553b52
--- /dev/null
+++ b/src/components/UpdateProfile/SkillProfileAlert.tsx
@@ -0,0 +1,48 @@
+import { CheckCircle, FileBadge } from 'lucide-react';
+
+const ideas = [
+ 'Add a link to your profile in your social media bio',
+ 'Include your profile link in your resume to showcase your skills',
+ 'Add a link to your profile in your email signature',
+ 'Showcase your skills in your GitHub profile',
+ 'Share your profile with potential employers',
+];
+
+export function SkillProfileAlert() {
+ return (
+
+
+
+
+ Announcing Skill Profiles!{' '}
+
+
+ Create your skill profile to showcase your skills or learning progress.
+ Here are some of the ways you can use your skill profile:
+
+
+
+ {ideas.map((idea) => (
+
+
+ {idea}
+
+ ))}
+
+
+
+ Make sure to mark your expertise{' '}
+
+ in the roadmaps.
+
+
+
+ );
+}
diff --git a/src/components/UpdateProfile/UpdatePublicProfileForm.tsx b/src/components/UpdateProfile/UpdatePublicProfileForm.tsx
index b92467e39..084c98f76 100644
--- a/src/components/UpdateProfile/UpdatePublicProfileForm.tsx
+++ b/src/components/UpdateProfile/UpdatePublicProfileForm.tsx
@@ -8,12 +8,20 @@ import type {
UserDocument,
} from '../../api/user';
import { SelectionButton } from '../RoadCard/SelectionButton';
-import { ArrowUpRight, Eye, EyeOff } from 'lucide-react';
+import {
+ ArrowUpRight,
+ CheckCircle,
+ Eye,
+ EyeOff,
+ FileBadge,
+ Trophy,
+} from 'lucide-react';
import { useToast } from '../../hooks/use-toast';
import { CreateRoadmapModal } from '../CustomRoadmap/CreateRoadmap/CreateRoadmapModal.tsx';
import { VisibilityDropdown } from './VisibilityDropdown.tsx';
import { ProfileUsername } from './ProfileUsername.tsx';
import UploadProfilePicture from './UploadProfilePicture.tsx';
+import { SkillProfileAlert } from './SkillProfileAlert.tsx';
type RoadmapType = {
id: string;
@@ -202,11 +210,11 @@ export function UpdatePublicProfileForm() {
setIsCreatingRoadmap(false)} />
)}
+
+
-
- Personal Profile
-
+
Skill Profile
{publicProfileUrl && (
- Set up your profile to showcase your skills.
+ Create your skill profile to showcase your skills.