diff --git a/source/_includes/asides/component_navigation.html b/source/_includes/asides/component_navigation.html
index dbadf4b007f..2722cf5a13b 100644
--- a/source/_includes/asides/component_navigation.html
+++ b/source/_includes/asides/component_navigation.html
@@ -37,6 +37,16 @@
{%- endif -%}.
+ {% if page.works_with %}
+ {%- for type in page.works_with -%}
+
+ {%- endfor -%}
+ {%- endif -%}
+
{% if page.ha_domain %}
View source on GitHub
diff --git a/source/_integrations/esphome.markdown b/source/_integrations/esphome.markdown
index 3256ba64a52..2668228b743 100644
--- a/source/_integrations/esphome.markdown
+++ b/source/_integrations/esphome.markdown
@@ -29,6 +29,8 @@ ha_platforms:
- switch
ha_integration_type: integration
ha_dhcp: true
+works_with:
+ - local
---
This integration allows [ESPHome](https://esphome.io) devices to connect directly to Home Assistant with the [native ESPHome API](https://esphome.io/components/api.html).
diff --git a/source/images/works_with/works-with-bluetooth.png b/source/images/works_with/works-with-bluetooth.png
new file mode 100644
index 00000000000..c270dd7a6dd
Binary files /dev/null and b/source/images/works_with/works-with-bluetooth.png differ
diff --git a/source/images/works_with/works-with-cloud.png b/source/images/works_with/works-with-cloud.png
new file mode 100644
index 00000000000..398dbed82b8
Binary files /dev/null and b/source/images/works_with/works-with-cloud.png differ
diff --git a/source/images/works_with/works-with-local.png b/source/images/works_with/works-with-local.png
new file mode 100644
index 00000000000..f198ca1cfa3
Binary files /dev/null and b/source/images/works_with/works-with-local.png differ
diff --git a/source/images/works_with/works-with-matter.png b/source/images/works_with/works-with-matter.png
new file mode 100644
index 00000000000..21bd1606b62
Binary files /dev/null and b/source/images/works_with/works-with-matter.png differ
diff --git a/source/images/works_with/works-with-zigbee.png b/source/images/works_with/works-with-zigbee.png
new file mode 100644
index 00000000000..f92977777b0
Binary files /dev/null and b/source/images/works_with/works-with-zigbee.png differ
diff --git a/source/images/works_with/works-with-zwave.png b/source/images/works_with/works-with-zwave.png
new file mode 100644
index 00000000000..4572cd8f113
Binary files /dev/null and b/source/images/works_with/works-with-zwave.png differ