diff --git a/components/icons/avatar-icon.tsx b/components/icons/avatar-icon.tsx
new file mode 100644
index 00000000..69e76e2a
--- /dev/null
+++ b/components/icons/avatar-icon.tsx
@@ -0,0 +1,32 @@
+import { Circle, Path, Svg } from "react-native-svg";
+
+type Props = {
+ size?: number;
+ /** 배경 원 색상 */
+ backgroundColor?: string;
+ /** 사람 실루엣 색상 */
+ color?: string;
+};
+
+export function AvatarIcon({
+ size = 60,
+ backgroundColor = "#E5E7EB",
+ color = "#A4ABC0",
+}: Props) {
+ return (
+
+ );
+}
diff --git a/features/mypage/components/profile-avatar.tsx b/features/mypage/components/profile-avatar.tsx
index e643ba19..4c8734cb 100644
--- a/features/mypage/components/profile-avatar.tsx
+++ b/features/mypage/components/profile-avatar.tsx
@@ -1,5 +1,5 @@
-import { Image, View } from 'react-native';
-import { Circle, Path, Svg } from 'react-native-svg';
+import { AvatarIcon } from "@/components/icons/avatar-icon";
+import { Image } from "react-native";
type Props = {
url?: string | null;
@@ -7,7 +7,7 @@ type Props = {
};
export function ProfileAvatar({ url, size = 100 }: Props) {
- if (url?.startsWith('http')) {
+ if (url?.startsWith("http")) {
return (
- {/* 원형 배경 */}
-
- {/* 사람 아이콘 */}
-
-
- );
+ // 프로필 이미지 미설정(온보딩 건너뛰기 포함) 시 기본 아바타 표시
+ return ;
}