diff --git a/src/components/Item.js b/src/components/Item.js
index eba2304..a1bf874 100644
--- a/src/components/Item.js
+++ b/src/components/Item.js
@@ -22,13 +22,13 @@ export default Blits.Component('Item', {
     <Element
       w="$width"
       h="$height"
-      :color="$hasFocus ? '#fff' : '#888'"
+      :color="$isFocused ? '#fff' : '#888'"
       :effects="[{type: 'radius', props: {radius: $radius}}]"
     >
       <Text content="$item.label" color="#121212" size="$height/2" mount="0.5" x="$width/2" y="$height/2" />
     </Element>
   `,
-  props: ['item', 'width', 'height'],
+  props: ['item', 'width', 'height', 'isFocused'],
   state() {
     return {
       radius: 6,
diff --git a/src/components/List.js b/src/components/List.js
index 44bb7ec..eb5eb3c 100644
--- a/src/components/List.js
+++ b/src/components/List.js
@@ -32,6 +32,7 @@ export default Blits.Component('List', {
         :key="$item.id"
         width="$itemWidth"
         height="$itemHeight"
+        :isFocused="$focused === $index"
       />
     </Element>
   `,