diff --git a/src/components/Menubar.jsx b/src/components/Menubar.jsx
index 119c5ab..100a65a 100644
--- a/src/components/Menubar.jsx
+++ b/src/components/Menubar.jsx
@@ -6,22 +6,37 @@ const Menubar = (props) => {
     <>
       <br></br>
       <br></br>
-      <div className="btm-nav">
-        <button className={props.active === "quiz" ? "active" : ""} onClick={() => { window.location.href = config.base + "/#/quiz" }}>
-          <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>
-          <span className="btm-nav-label">Quiz</span>
+      <div className='btm-nav'>
+        <button
+          className={props.active === 'quiz' ? 'active' : ''}
+          onClick={() => {
+            window.location.href = config.base + '/#/quiz';
+          }}
+        >
+          <span className='text-2xl'>🤔</span>
+          <span className='btm-nav-label'>Quiz</span>
         </button>
-        <button className={props.active === "home" ? "active" : ""} onClick={() => { window.location.href = config.base + "/#/" }}>
-          <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" /></svg>
-          <span className="btm-nav-label">Home</span>
+        <button
+          className={props.active === 'home' ? 'active' : ''}
+          onClick={() => {
+            window.location.href = config.base + '/#/';
+          }}
+        >
+          <span className='text-2xl'>🏡</span>
+          <span className='btm-nav-label'>Home</span>
         </button>
-        <button className={props.active === "garden" ? "active" : ""} onClick={() => { window.location.href = config.base + "/#/garden" }}>
-          <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" /></svg>
-          <span className="btm-nav-label">Garden</span>
+        <button
+          className={props.active === 'garden' ? 'active' : ''}
+          onClick={() => {
+            window.location.href = config.base + '/#/garden';
+          }}
+        >
+          <span className='text-2xl'>🌻</span>
+          <span className='btm-nav-label'>Garden</span>
         </button>
       </div>
     </>
   );
 };
 
-export default Menubar;
\ No newline at end of file
+export default Menubar;