diff --git a/source/integrations/index.html b/source/integrations/index.html
index f4269102722..b97aeec5a86 100644
--- a/source/integrations/index.html
+++ b/source/integrations/index.html
@@ -22,7 +22,7 @@ regenerate: false
 
 {%- assign components = site.integrations | sort: 'title' -%}
 {%- assign components_by_version = site.integrations | group_components_by_release -%}
-{%- assign categories = components | map: 'ha_category' | join: ',' | join: ',' | split: ',' | uniq | sort -%}
+{%- assign categories = components | map: 'ha_category' | join: ',' | downcase | split: ',' | uniq | sort -%}
 
 <p class='note'>
   Support for these integrations is provided by the Home Assistant community.
@@ -45,10 +45,28 @@ regenerate: false
           {%- endfor -%}
         </select></div>
       {%- for category in categories -%}
-      {%- assign components_count = components | where: 'ha_category', category | size -%}
-      {%- if category and category != 'Other' and components_count != 0 -%}
-      <a href='#{{ category | slugify }}' class="btn" onclick="document.querySelector('.page-content').scrollTop = 0">{{ category }} ({{ components_count }})</a>
-      {%- endif -%}
+        {%- assign category_name = "" -%}
+        {%- assign components_count = 0 -%}
+        {%- for comp in components -%}
+          {%- assign comp_categories = comp.ha_category | join: ',' | downcase -%}
+          {%- if comp_categories contains category -%}
+            {%- if category_name == "" -%}
+              {%- for cat in comp.ha_category -%}
+                {%- assign lower_cat = cat | downcase -%}
+                {%- if lower_cat == category -%}
+                  {%- assign category_name = cat -%}
+                {%- endif -%}
+              {%- endfor -%}
+            {%- endif -%} 
+            {%- assign components_count = components_count | plus: 1 -%}
+          {%- endif -%}
+        {%- endfor -%}
+        {%- if category != 'other' and components_count != 0 -%}
+          {%- if category_name == "" -%}
+            {%- assign category_name = category | capitalize -%}
+          {%- endif -%}
+          <a href='#{{ category_name | slugify }}' class="btn" onclick="document.querySelector('.page-content').scrollTop = 0">{{ category_name }} ({{ components_count }})</a>
+        {%- endif -%}
       {%- endfor -%}
 
       <a href='#other' class="btn" onclick="document.querySelector('.page-content').scrollTop = 0">Other ({{ components | where: 'ha_category', 'Other' | size }})</a>