diff --git a/bun.lockb b/bun.lockb
index f610218..74ac657 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/package.json b/package.json
index e31f418..9436df7 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
   "dependencies": {
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-icons": "^4.7.1",
     "react-router-dom": "^6.4.2",
     "react-router-hash-link": "^2.4.3"
   },
diff --git a/src/components/Jumbotron.jsx b/src/components/Jumbotron.jsx
deleted file mode 100644
index 9b20695..0000000
--- a/src/components/Jumbotron.jsx
+++ /dev/null
@@ -1,5 +0,0 @@
-// const Jumbotron = ({ movie }) => (
-
-// )
-
-// export default Jumbotron
diff --git a/src/components/Rate.jsx b/src/components/Rate.jsx
index 6eed1bf..5445858 100644
--- a/src/components/Rate.jsx
+++ b/src/components/Rate.jsx
@@ -1,4 +1,5 @@
 import { useState } from "react"
+import { AiFillStar } from "react-icons/ai"
 import styles from "styles/Rate.module.css"
 
 const Rate = ({ rating, setRating }) => {
@@ -21,15 +22,7 @@ const Rate = ({ rating, setRating }) => {
                         onMouseEnter={() => setHover(index)}
                         onMouseLeave={() => setHover()}
                     >
-                        <svg
-                            xmlns="http://www.w3.org/2000/svg"
-                            width="30"
-                            height="30"
-                            fill="currentColor"
-                            viewBox="0 0 16 16"
-                        >
-                            <path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z" />
-                        </svg>
+                        <AiFillStar size={30} />
                     </button>
                 )
             })}
diff --git a/src/pages/Movie.jsx b/src/pages/Movie.jsx
index af3ec96..3688981 100644
--- a/src/pages/Movie.jsx
+++ b/src/pages/Movie.jsx
@@ -5,6 +5,7 @@ import useLocalStorage from "hooks/useLocalStorage"
 import Rate from "components/Rate"
 import TopBar from "components/TopBar"
 import { HashLink } from "react-router-hash-link"
+import { AiOutlineArrowDown, AiFillStar } from "react-icons/ai"
 
 const Movie = () => {
     const { movieId } = useParams()
@@ -80,18 +81,7 @@ const Movie = () => {
                         )}
                         <HashLink to="#bottom" className={styles.More}>
                             <p>More info</p>
-                            <svg
-                                xmlns="http://www.w3.org/2000/svg"
-                                width="30"
-                                height="30"
-                                fill="currentColor"
-                                viewBox="0 0 16 16"
-                            >
-                                <path
-                                    fillRule="evenodd"
-                                    d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z"
-                                />
-                            </svg>
+                            <AiOutlineArrowDown />
                         </HashLink>
                     </div>
                 </div>
@@ -104,15 +94,7 @@ const Movie = () => {
                             <span>
                                 Average Rating: {movie?.averageVote.toFixed(1)}
                             </span>
-                            <svg
-                                xmlns="http://www.w3.org/2000/svg"
-                                width="16"
-                                height="16"
-                                fill="currentColor"
-                                viewBox="0 0 16 16"
-                            >
-                                <path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z" />
-                            </svg>
+                            <AiFillStar />
                         </p>
                     </div>
                     <div className={styles.Section}>
@@ -140,7 +122,7 @@ const Movie = () => {
                                         src={
                                             actor.profile_path
                                                 ? `https://image.tmdb.org/t/p/w200${actor.profile_path}`
-                                                : "../placeholder.svg" //`https://ui-avatars.com/api/?name=${encodeURIComponent(actor.name)}&size=300`
+                                                : "../placeholder.svg"
                                         }
                                         alt={actor.name}
                                     />