diff --git a/index.html b/index.html
index 1bea6b8..92836ca 100644
--- a/index.html
+++ b/index.html
@@ -8,10 +8,16 @@
 <link rel="stylesheet" href="styles.css">
 <body>
     <nav id="navbar" class="horizontal">
-        <div class="logo">t</div>
+        <a class="logo" href="https://www.apple.com/" aria-label="Apple">
+            <img src="https://www.apple.com/ac/globalnav/7/en_US/images/svg/apple.svg" alt="Apple">
+        </a>
         <div>Store</div><div>Mac</div><div>iPad</div><div>iPhone</div><div>Watch</div><div>Vision</div><div>AirPods</div><div>TV & Home</div><div>Entertainment</div><div>Accessories</div><div>Support</div>
-        <span>s</span>
-        <span>A</span>
+        <a class="nav-icon" href="https://www.apple.com/us/search" aria-label="Search">
+            <img src="https://www.apple.com/ac/globalnav/7/en_US/images/svg/search.svg" alt="">
+        </a>
+        <a class="nav-icon" href="https://www.apple.com/us/shop/goto/bag" aria-label="Shopping bag">
+            <img src="https://www.apple.com/ac/globalnav/7/en_US/images/svg/bag.svg" alt="">
+        </a>
     </nav>
 
     <main class="menu horizontal">
diff --git a/styles.css b/styles.css
index 5ddda8f..ae90f9a 100644
--- a/styles.css
+++ b/styles.css
@@ -39,6 +39,28 @@ body {
 .logo {
     color: black;
     font-size: 18px;
+    display: inline-flex;
+    align-items: center;
+}
+
+#navbar img {
+    width: 16px;
+    height: 16px;
+    display: block;
+}
+
+#navbar .logo img {
+    width: 18px;
+    height: 18px;
+}
+
+.nav-icon {
+    display: inline-flex;
+    align-items: center;
+}
+
+#navbar a:hover {
+    opacity: .65;
 }
 
 #navbar span {
