diff --git a/src/docs/src/routes/components/toggle.svelte.md b/src/docs/src/routes/components/toggle.svelte.md
index 952fc3bcf1f..df6ba2eb9ce 100644
--- a/src/docs/src/routes/components/toggle.svelte.md
+++ b/src/docs/src/routes/components/toggle.svelte.md
@@ -9,6 +9,7 @@ published: true
   import ClassTable from "@components/ClassTable.svelte"
   import { prefix } from '$lib/stores';
   import { replace } from '$lib/actions';
+  let indeterminate = true;
 </script>
 
 <ClassTable
@@ -128,3 +129,14 @@ data="{[
 `<input type="checkbox" class="$$toggle" disabled checked>`
 }</pre>
 </Component>
+
+<Component title="Indeterminate">
+<input type="checkbox" class="toggle" bind:indeterminate on:click|preventDefault={()=>{}}>
+<pre slot="html" use:replace={{ to: $prefix }}>{
+`<!-- You can make a toggle indeterminate using JS -->
+<script>
+  document.getElementById("my-toggle").indeterminate = true
+</script>
+<input type="checkbox" class="$$toggle" id="my-toggle">`
+}</pre>
+</Component>
\ No newline at end of file