diff --git a/apiExamples/highlight.html b/apiExamples/highlight.html
new file mode 100644
index 0000000..44a5eb2
--- /dev/null
+++ b/apiExamples/highlight.html
@@ -0,0 +1,16 @@
+<auro-combobox>
+  <span slot="label">Name</span>
+  <auro-menu>
+    <auro-menuoption value="stops">Stops</auro-menuoption>
+    <auro-menuoption value="price">Price</auro-menuoption>
+    <auro-menuoption value="duration">Duration</auro-menuoption>
+    <auro-menuoption value="departure">Departure</auro-menuoption>
+    <auro-menu>
+      <auro-menuoption value="apples" selected>Apples</auro-menuoption>
+      <auro-menuoption value="oranges">Oranges</auro-menuoption>
+      <auro-menuoption value="peaches">Peaches</auro-menuoption>
+    </auro-menu>
+    <auro-menuoption value="arrival">Arrival</auro-menuoption>
+    <auro-menuoption static nomatch>No matching option</auro-menuoption>
+  </auro-menu>
+</auro-combobox>
diff --git a/docs/partials/index.md b/docs/partials/index.md
index 1420f58..08a0ee2 100644
--- a/docs/partials/index.md
+++ b/docs/partials/index.md
@@ -87,6 +87,22 @@ The `type` attribute may be used to apply the corresponding `type` attribute on
 
 </auro-accordion>
 
+## Highlight menu option
+
+The `auro-combobox` component supports the use of the highlight `auro-menu` when the value will be match with the list of menu. If you have another logic to highlight the menu ase on your needed u can set the `auro-menuoption` to have attribute `selected` to set the highlight.
+
+<div class="exampleWrapper">
+  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../apiExamples/highlight.html) -->
+  <!-- AURO-GENERATED-CONTENT:END -->
+</div>
+
+<auro-accordion alignRight>
+  <span slot="trigger">See code</span>
+
+  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../../apiExamples/highlight.html) -->
+  <!-- AURO-GENERATED-CONTENT:END -->
+</auro-accordion>
+
 ### Additional Use Case Examples
 
 #### Swapping Values Between Comboboxes