diff --git a/stylesheets/_modules.scss b/stylesheets/_modules.scss
index e8de8da2f73..99ef36a9813 100644
--- a/stylesheets/_modules.scss
+++ b/stylesheets/_modules.scss
@@ -1290,6 +1290,8 @@
 // Module: Contact List Item
 
 .module-contact-list-item {
+  padding-top: 5px;
+  padding-bottom: 5px;
   display: flex;
   flex-direction: row;
   align-items: center;
diff --git a/ts/components/ContactListItem.md b/ts/components/ContactListItem.md
index 1e94d8ee4f1..254c2d66024 100644
--- a/ts/components/ContactListItem.md
+++ b/ts/components/ContactListItem.md
@@ -15,15 +15,27 @@
 
 #### With name and profile
 
+Note the proper spacing between these two.
+
 ```jsx
-<ContactListItem
-  i18n={util.i18n}
-  name="Someone 🔥 Somewhere"
-  phoneNumber="(202) 555-0011"
-  profileName="🔥Flames🔥"
-  avatarPath={util.gifObjectUrl}
-  onClick={() => console.log('onClick')}
-/>
+<div>
+  <ContactListItem
+    i18n={util.i18n}
+    name="Someone 🔥 Somewhere"
+    phoneNumber="(202) 555-0011"
+    profileName="🔥Flames🔥"
+    avatarPath={util.gifObjectUrl}
+    onClick={() => console.log('onClick')}
+  />
+  <ContactListItem
+    i18n={util.i18n}
+    name="Another ❄️ Yes"
+    phoneNumber="(202) 555-0011"
+    profileName="❄️Ice❄️"
+    avatarPath={util.gifObjectUrl}
+    onClick={() => console.log('onClick')}
+  />
+</div>
 ```
 
 #### With name and profile, verified