diff --git a/packages/ui/src/assets/icons/Logo-Black.svg b/packages/ui/src/assets/icons/Logo-Black.svg
new file mode 100644
index 0000000..1a12485
--- /dev/null
+++ b/packages/ui/src/assets/icons/Logo-Black.svg
@@ -0,0 +1,26 @@
+
diff --git a/packages/ui/src/assets/icons/Logo-Grey.svg b/packages/ui/src/assets/icons/Logo-Grey.svg
new file mode 100644
index 0000000..bff13f2
--- /dev/null
+++ b/packages/ui/src/assets/icons/Logo-Grey.svg
@@ -0,0 +1,33 @@
+
diff --git a/packages/ui/src/assets/icons/Logo-White.svg b/packages/ui/src/assets/icons/Logo-White.svg
new file mode 100644
index 0000000..a1b716c
--- /dev/null
+++ b/packages/ui/src/assets/icons/Logo-White.svg
@@ -0,0 +1,31 @@
+
diff --git a/packages/ui/src/assets/icons/Symbol.svg b/packages/ui/src/assets/icons/Symbol.svg
new file mode 100644
index 0000000..1da77fe
--- /dev/null
+++ b/packages/ui/src/assets/icons/Symbol.svg
@@ -0,0 +1,8 @@
+
diff --git a/packages/ui/src/components/Icon.tsx b/packages/ui/src/components/Icon.tsx
index 7afde30..b45050c 100644
--- a/packages/ui/src/components/Icon.tsx
+++ b/packages/ui/src/components/Icon.tsx
@@ -34,6 +34,9 @@ import { ReactComponent as Go } from '../assets/icons/Go.svg';
import { ReactComponent as Home } from '../assets/icons/Home.svg';
import { ReactComponent as House } from '../assets/icons/House.svg';
import { ReactComponent as kakao } from '../assets/icons/kakao.svg';
+import { ReactComponent as LogoBlack } from '../assets/icons/Logo-Black.svg';
+import { ReactComponent as LogoGrey } from '../assets/icons/Logo-Grey.svg';
+import { ReactComponent as LogoWhite } from '../assets/icons/Logo-White.svg';
import { ReactComponent as Nail } from '../assets/icons/Nail.svg';
import { ReactComponent as NailColor } from '../assets/icons/NailColor.svg';
import { ReactComponent as NailDot } from '../assets/icons/NailDot.svg';
@@ -57,6 +60,7 @@ import { ReactComponent as SwallowColor } from '../assets/icons/SwallowColor.svg
import { ReactComponent as SwallowDot } from '../assets/icons/SwallowDot.svg';
import { ReactComponent as SwallowDotGrey } from '../assets/icons/SwallowDotGrey.svg';
import { ReactComponent as SwallowNormal } from '../assets/icons/SwallowNormal.svg';
+import { ReactComponent as Symbol } from '../assets/icons/Symbol.svg';
import { ReactComponent as Top } from '../assets/icons/Top.svg';
import { ReactComponent as Touch } from '../assets/icons/Touch.svg';
import { ReactComponent as Trash } from '../assets/icons/Trash.svg';
@@ -135,6 +139,10 @@ const ICONS = {
touch: Touch,
trash: Trash,
welcome: Welcome,
+ logoWhite: LogoWhite,
+ logoBlack: LogoBlack,
+ logoGrey: LogoGrey,
+ symbol: Symbol,
...CARD_ICONS,
};