diff --git a/docs/_includes/sidebar.njk b/docs/_includes/sidebar.njk
index 496824ab2..9d4f75f36 100644
--- a/docs/_includes/sidebar.njk
+++ b/docs/_includes/sidebar.njk
@@ -22,6 +22,9 @@
 {# Components #}
 <h2>Components</h2>
 <ul>
+  <li>
+    <a href="/docs/components/">Components Overview</a>
+  </li>
   <li>
     <a href="/docs/components/animated-image">Animated Image</a>
   </li>
diff --git a/docs/_includes/svgs/animated-image.njk b/docs/_includes/svgs/animated-image.njk
new file mode 100644
index 000000000..cc18b947f
--- /dev/null
+++ b/docs/_includes/svgs/animated-image.njk
@@ -0,0 +1,4 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 1H52C58.0751 1 63 5.92487 63 12V52C63 58.0751 58.0751 63 52 63H12C5.92487 63 1 58.0751 1 52V12C1 5.92487 5.92487 1 12 1Z" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M20 32C20 27.7344 22.25 23.7969 26 21.6406C29.7031 19.4844 34.25 19.4844 38 21.6406C41.7031 23.7969 44 27.7344 44 32C44 36.3125 41.7031 40.25 38 42.4062C34.25 44.5625 29.7031 44.5625 26 42.4062C22.25 40.25 20 36.3125 20 32ZM28.8125 26.9375C28.4375 27.125 28.25 27.5 28.25 27.875V36.125C28.25 36.5469 28.4375 36.9219 28.8125 37.1094C29.1406 37.3438 29.6094 37.2969 29.9375 37.1094L36.6875 32.9844C37.0156 32.75 37.25 32.4219 37.25 32C37.25 31.625 37.0156 31.25 36.6875 31.0625L29.9375 26.9375C29.6094 26.7031 29.1406 26.7031 28.8125 26.8906V26.9375Z" fill="var(--wa-color-brand-fill-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/animation.njk b/docs/_includes/svgs/animation.njk
new file mode 100644
index 000000000..6b0f7770a
--- /dev/null
+++ b/docs/_includes/svgs/animation.njk
@@ -0,0 +1,3 @@
+<svg width="74" height="26" viewBox="0 0 74 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1 13C5 9 15.4 1 25 1C37 1 45.25 10.75 45.25 16C45.25 21.25 43 25 37 25C31 25 28.75 21.25 28.75 16C28.75 10.75 37 1 49 1C58.6 1 69 9 73 13M73 13V7M73 13H67" stroke="var(--wa-color-neutral-border-loud)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/docs/_includes/svgs/avatar.njk b/docs/_includes/svgs/avatar.njk
new file mode 100644
index 000000000..01f5d33ca
--- /dev/null
+++ b/docs/_includes/svgs/avatar.njk
@@ -0,0 +1,4 @@
+<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="24" cy="24" r="23" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M24 23.75C22.0234 23.75 20.2188 22.7188 19.2305 21C18.2422 19.3242 18.2422 17.2188 19.2305 15.5C20.2188 13.8242 22.0234 12.75 24 12.75C25.9336 12.75 27.7383 13.8242 28.7266 15.5C29.7148 17.2188 29.7148 19.3242 28.7266 21C27.7383 22.7188 25.9336 23.75 24 23.75ZM22.0234 25.8125H25.9336C30.1875 25.8125 33.625 29.25 33.625 33.5039C33.625 34.1914 33.0234 34.75 32.3359 34.75H15.6211C14.9336 34.75 14.375 34.1914 14.375 33.5039C14.375 29.25 17.7695 25.8125 22.0234 25.8125Z" fill="var(--wa-color-neutral-on-quiet)"/>
+</svg>
diff --git a/docs/_includes/svgs/badge.njk b/docs/_includes/svgs/badge.njk
new file mode 100644
index 000000000..86b932134
--- /dev/null
+++ b/docs/_includes/svgs/badge.njk
@@ -0,0 +1,6 @@
+<svg width="66" height="66" viewBox="0 0 66 66" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 11H44C50.0751 11 55 15.9249 55 22V54C55 60.0751 50.0751 65 44 65H12C5.92487 65 1 60.0751 1 54V22C1 15.9249 5.92487 11 12 11Z" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M61 1H31C28.7909 1 27 2.79086 27 5V15C27 17.2091 28.7909 19 31 19H61C63.2091 19 65 17.2091 65 15V5C65 2.79086 63.2091 1 61 1Z" fill="var(--wa-color-brand-fill-loud)"/>
+<path d="M61 1H31C28.7909 1 27 2.79086 27 5V15C27 17.2091 28.7909 19 31 19H61C63.2091 19 65 17.2091 65 15V5C65 2.79086 63.2091 1 61 1Z" stroke="var(--wa-color-surface-default)" stroke-width="2"/>
+<path d="M34.7281 6.53125C34.9156 6.46875 35.15 6.53125 35.275 6.6875L39.4 11.625V7C39.4 6.73438 39.6187 6.5 39.9 6.5C40.1656 6.5 40.4 6.73438 40.4 7V13C40.4 13.2188 40.2594 13.4062 40.0562 13.4844C39.8687 13.5469 39.65 13.4844 39.5094 13.3281L35.4 8.39062V13C35.4 13.2812 35.1656 13.5 34.9 13.5C34.6187 13.5 34.4 13.2812 34.4 13V7C34.4 6.79688 34.525 6.60938 34.7281 6.53125ZM43 6.5H46.5C46.7656 6.5 47 6.73438 47 7C47 7.28125 46.7656 7.5 46.5 7.5H43V9.5H45.5C45.7656 9.5 46 9.73438 46 10C46 10.2812 45.7656 10.5 45.5 10.5H43V12.5H46.5C46.7656 12.5 47 12.7344 47 13C47 13.2812 46.7656 13.5 46.5 13.5H43C42.4375 13.5 42 13.0625 42 12.5V10V7.5C42 6.95312 42.4375 6.5 43 6.5ZM48.9125 6.53125C49.1781 6.4375 49.4594 6.57812 49.5687 6.82812L51.2875 11.4219L52.6156 6.85938C52.6781 6.65625 52.8656 6.5 53.1 6.5C53.3187 6.5 53.5062 6.65625 53.5687 6.85938L54.8969 11.4219L56.6312 6.82812C56.725 6.57812 57.0062 6.4375 57.2719 6.54688C57.5219 6.64062 57.6625 6.92188 57.5531 7.1875L55.3031 13.1875C55.2406 13.3906 55.0375 13.5156 54.8187 13.5C54.6 13.5 54.4281 13.3594 54.3656 13.1406L53.1 8.79688L51.8187 13.1406C51.7562 13.3594 51.5687 13.5 51.3656 13.5C51.1469 13.5156 50.9437 13.3906 50.8812 13.1875L48.6312 7.1875C48.5219 6.92188 48.6625 6.64062 48.9125 6.53125Z" fill="var(--wa-color-brand-on-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/breadcrumb.njk b/docs/_includes/svgs/breadcrumb.njk
new file mode 100644
index 000000000..021dca380
--- /dev/null
+++ b/docs/_includes/svgs/breadcrumb.njk
@@ -0,0 +1,7 @@
+<svg width="112" height="13" viewBox="0 0 112 13" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.7266 6.5C13.7266 6.92188 13.375 7.25 12.9766 7.25H12.2266L12.25 11C12.25 11.0703 12.25 11.1406 12.25 11.1875V11.5625C12.25 12.1016 11.8281 12.5 11.3125 12.5H10.9375C10.8906 12.5 10.8672 12.5 10.8438 12.5C10.8203 12.5 10.7734 12.5 10.75 12.5H10H9.4375C8.89844 12.5 8.5 12.1016 8.5 11.5625V11V9.5C8.5 9.10156 8.14844 8.75 7.75 8.75H6.25C5.82812 8.75 5.5 9.10156 5.5 9.5V11V11.5625C5.5 12.1016 5.07812 12.5 4.5625 12.5H4H3.25C3.20312 12.5 3.17969 12.5 3.13281 12.5C3.10938 12.5 3.08594 12.5 3.0625 12.5H2.6875C2.14844 12.5 1.75 12.1016 1.75 11.5625V8.9375C1.75 8.9375 1.75 8.91406 1.75 8.89062V7.25H1C0.578125 7.25 0.25 6.92188 0.25 6.5C0.25 6.28906 0.320312 6.10156 0.484375 5.9375L6.48438 0.6875C6.64844 0.523438 6.83594 0.5 7 0.5C7.16406 0.5 7.35156 0.546875 7.49219 0.664062L13.4688 5.9375C13.6562 6.10156 13.75 6.28906 13.7266 6.5Z" fill="var(--wa-color-brand-fill-loud)"/>
+<path d="M29.5156 5.98438C29.8203 6.26562 29.8203 6.75781 29.5156 7.03906L25.0156 11.5391C24.7344 11.8438 24.2422 11.8438 23.9609 11.5391C23.6562 11.2578 23.6562 10.7656 23.9609 10.4844L27.9219 6.5L23.9609 2.53906C23.6562 2.25781 23.6562 1.76562 23.9609 1.48438C24.2422 1.17969 24.7344 1.17969 25.0156 1.48438L29.5156 5.98438Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<rect x="38" y="4" width="25" height="4" rx="2" fill="var(--wa-color-brand-fill-loud)"/>
+<path d="M78.5156 5.98438C78.8203 6.26562 78.8203 6.75781 78.5156 7.03906L74.0156 11.5391C73.7344 11.8438 73.2422 11.8438 72.9609 11.5391C72.6562 11.2578 72.6562 10.7656 72.9609 10.4844L76.9219 6.5L72.9609 2.53906C72.6562 2.25781 72.6562 1.76562 72.9609 1.48438C73.2422 1.17969 73.7344 1.17969 74.0156 1.48438L78.5156 5.98438Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<rect x="87" y="4" width="25" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/button-group.njk b/docs/_includes/svgs/button-group.njk
new file mode 100644
index 000000000..70cee5d70
--- /dev/null
+++ b/docs/_includes/svgs/button-group.njk
@@ -0,0 +1,7 @@
+<svg width="64" height="32" viewBox="0 0 64 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 6C0 2.68629 2.68629 0 6 0H32V32H6C2.68629 32 0 29.3137 0 26V6Z" fill="var(--wa-color-brand-fill-loud)"/>
+<path d="M16.75 12.375V15.75H20.125C20.5234 15.75 20.875 16.1016 20.875 16.5C20.875 16.9219 20.5234 17.25 20.125 17.25H16.75V20.625C16.75 21.0469 16.3984 21.375 16 21.375C15.5781 21.375 15.25 21.0469 15.25 20.625V17.25H11.875C11.4531 17.25 11.125 16.9219 11.125 16.5C11.125 16.1016 11.4531 15.75 11.875 15.75H15.25V12.375C15.25 11.9766 15.5781 11.625 16 11.625C16.3984 11.625 16.75 11.9766 16.75 12.375Z" fill="var(--wa-color-brand-on-loud)"/>
+<path d="M32 0H58C61.3137 0 64 2.68629 64 6V26C64 29.3137 61.3137 32 58 32H32V0Z" fill="var(--wa-color-brand-fill-loud)"/>
+<path d="M52.875 16.5C52.875 16.9219 52.5234 17.25 52.125 17.25H43.875C43.4531 17.25 43.125 16.9219 43.125 16.5C43.125 16.1016 43.4531 15.75 43.875 15.75H52.125C52.5234 15.75 52.875 16.1016 52.875 16.5Z" fill="var(--wa-color-brand-on-loud)"/>
+<line x1="32.5" x2="32.5" y2="32" stroke="var(--wa-color-brand-on-quiet)"/>
+</svg>
diff --git a/docs/_includes/svgs/button.njk b/docs/_includes/svgs/button.njk
new file mode 100644
index 000000000..4556a9f11
--- /dev/null
+++ b/docs/_includes/svgs/button.njk
@@ -0,0 +1,4 @@
+<svg width="64" height="32" viewBox="0 0 64 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 6C0 2.68629 2.68629 0 6 0H58C61.3137 0 64 2.68629 64 6V26C64 29.3137 61.3137 32 58 32H6C2.68629 32 0 29.3137 0 26V6Z" fill="var(--wa-color-brand-fill-loud)"/>
+<path d="M12.375 13.125C12.375 12.4414 12.9219 11.875 13.625 11.875H15.5C17.2188 11.875 18.625 13.2812 18.625 15C18.625 16.7383 17.2188 18.125 15.5 18.125H13.625V20C13.625 20.3516 13.332 20.625 13 20.625C12.6484 20.625 12.375 20.3516 12.375 20V17.5V13.125ZM13.625 16.875H15.5C16.5352 16.875 17.375 16.0352 17.375 15C17.375 13.9648 16.5352 13.125 15.5 13.125H13.625V16.875ZM21.875 11.875H24.0625C25.6055 11.875 26.875 13.1445 26.875 14.6875C26.875 15.8789 26.1328 16.8945 25.1172 17.3047L26.7578 19.6484C26.9531 19.9414 26.875 20.332 26.6016 20.5273C26.3086 20.7227 25.918 20.6445 25.7227 20.3711L23.7305 17.5H21.875V20C21.875 20.3516 21.582 20.625 21.25 20.625C20.8984 20.625 20.625 20.3516 20.625 20V16.875V13.125C20.625 12.4414 21.1719 11.875 21.875 11.875ZM24.0625 16.25C24.9219 16.25 25.625 15.5664 25.625 14.6875C25.625 13.8281 24.9219 13.125 24.0625 13.125H21.875V16.25H24.0625ZM30.125 11.875H34.5C34.832 11.875 35.125 12.168 35.125 12.5C35.125 12.8516 34.832 13.125 34.5 13.125H30.125V15.625H33.25C33.582 15.625 33.875 15.918 33.875 16.25C33.875 16.6016 33.582 16.875 33.25 16.875H30.125V19.375H34.5C34.832 19.375 35.125 19.668 35.125 20C35.125 20.3516 34.832 20.625 34.5 20.625H30.125C29.4219 20.625 28.875 20.0781 28.875 19.375V16.25V13.125C28.875 12.4414 29.4219 11.875 30.125 11.875ZM39.0586 13.3203C38.668 13.4766 38.4531 13.75 38.3945 14.082C38.3359 14.3555 38.375 14.5312 38.4336 14.668C38.4922 14.7852 38.5898 14.9023 38.7461 15.0195C39.1367 15.293 39.7031 15.4492 40.4062 15.6641C40.4258 15.6641 40.4453 15.6641 40.4648 15.6836C41.1094 15.8594 41.8711 16.0742 42.4375 16.4648C42.75 16.6797 43.0234 16.9727 43.1992 17.3438C43.375 17.7344 43.4141 18.1641 43.3164 18.6523C43.1797 19.4727 42.6328 20.0391 41.9297 20.3516C41.2266 20.6445 40.3672 20.7031 39.5078 20.5664C39.0391 20.4883 38.2773 20.2344 37.7891 20.0586C37.6914 20.0391 37.6133 20 37.5352 19.9805C37.2227 19.8633 37.0469 19.5117 37.1445 19.1797C37.2617 18.8672 37.6133 18.6914 37.9453 18.7891C38.043 18.8281 38.1406 18.8477 38.2578 18.8867C38.7461 19.0625 39.3516 19.2773 39.7031 19.3359C40.4258 19.4336 41.0117 19.375 41.4219 19.1992C41.832 19.0234 42.0273 18.7695 42.0859 18.4375C42.1445 18.1641 42.1055 17.9688 42.0469 17.8516C42.0078 17.7344 41.8906 17.6172 41.7344 17.5C41.3438 17.2266 40.7773 17.0703 40.0742 16.8555C40.0547 16.8555 40.0352 16.8555 40.0156 16.8359C39.3711 16.6602 38.6094 16.4453 38.043 16.0547C37.7305 15.8398 37.457 15.5469 37.2812 15.1758C37.125 14.7852 37.0859 14.3555 37.1641 13.8672L37.7695 13.9844L37.1641 13.8672C37.3008 13.0469 37.8477 12.4805 38.5508 12.168C39.2539 11.875 40.1133 11.8164 40.9727 11.9531C41.2266 11.9922 42.0078 12.1484 42.2812 12.2266C42.6133 12.3047 42.8086 12.6562 42.7109 12.9883C42.6328 13.3203 42.2812 13.5156 41.9492 13.418C41.7344 13.3594 41.0117 13.2227 40.7773 13.1836L40.875 12.5781L40.7773 13.1836C40.0547 13.0859 39.4688 13.1445 39.0586 13.3203ZM47.3086 13.3203C46.918 13.4766 46.7031 13.75 46.6445 14.082C46.5859 14.3555 46.625 14.5312 46.6836 14.668C46.7422 14.7852 46.8398 14.9023 46.9961 15.0195C47.3867 15.293 47.9531 15.4492 48.6562 15.6641C48.6758 15.6641 48.6953 15.6641 48.7148 15.6836C49.3594 15.8594 50.1211 16.0742 50.6875 16.4648C51 16.6797 51.2734 16.9727 51.4492 17.3438C51.625 17.7344 51.6641 18.1641 51.5664 18.6523C51.4297 19.4727 50.8828 20.0391 50.1797 20.3516C49.4766 20.6445 48.6172 20.7031 47.7578 20.5664C47.2891 20.4883 46.5273 20.2344 46.0391 20.0586C45.9414 20.0391 45.8633 20 45.7852 19.9805C45.4727 19.8633 45.2969 19.5117 45.3945 19.1797C45.5117 18.8672 45.8633 18.6914 46.1953 18.7891C46.293 18.8281 46.3906 18.8477 46.5078 18.8867C46.9961 19.0625 47.6016 19.2773 47.9531 19.3359C48.6758 19.4336 49.2617 19.375 49.6719 19.1992C50.082 19.0234 50.2773 18.7695 50.3359 18.4375C50.3945 18.1641 50.3555 17.9688 50.2969 17.8516C50.2578 17.7344 50.1406 17.6172 49.9844 17.5C49.5938 17.2266 49.0273 17.0703 48.3242 16.8555C48.3047 16.8555 48.2852 16.8555 48.2656 16.8359C47.6211 16.6602 46.8594 16.4453 46.293 16.0547C45.9805 15.8398 45.707 15.5469 45.5312 15.1758C45.375 14.7852 45.3359 14.3555 45.4141 13.8672L46.0195 13.9844L45.4141 13.8672C45.5508 13.0469 46.0977 12.4805 46.8008 12.168C47.5039 11.875 48.3633 11.8164 49.2227 11.9531C49.4766 11.9922 50.2578 12.1484 50.5312 12.2266C50.8633 12.3047 51.0586 12.6562 50.9609 12.9883C50.8828 13.3203 50.5312 13.5156 50.1992 13.418C49.9844 13.3594 49.2617 13.2227 49.0273 13.1836L49.125 12.5781L49.0273 13.1836C48.3047 13.0859 47.7188 13.1445 47.3086 13.3203Z" fill="var(--wa-color-brand-on-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/callout.njk b/docs/_includes/svgs/callout.njk
new file mode 100644
index 000000000..f9b6a96ef
--- /dev/null
+++ b/docs/_includes/svgs/callout.njk
@@ -0,0 +1,6 @@
+<svg width="112" height="40" viewBox="0 0 112 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 1H100C106.075 1 111 5.92487 111 12V28C111 34.0751 106.075 39 100 39H12C5.92487 39 1 34.0751 1 28V12C1 5.92487 5.92487 1 12 1Z" fill="var(--wa-color-warning-fill-quiet)"/>
+<path d="M12 1H100C106.075 1 111 5.92487 111 12V28C111 34.0751 106.075 39 100 39H12C5.92487 39 1 34.0751 1 28V12C1 5.92487 5.92487 1 12 1Z" stroke="var(--wa-color-warning-border-quiet)" stroke-width="2"/>
+<path d="M20 13C20.4375 13 20.8438 13.25 21.0625 13.625L27.8125 25.125C28.0312 25.5312 28.0312 26 27.8125 26.375C27.5938 26.7812 27.1875 27 26.75 27H13.25C12.7812 27 12.375 26.7812 12.1562 26.375C11.9375 26 11.9375 25.5312 12.1562 25.125L18.9062 13.625C19.125 13.25 19.5312 13 20 13ZM20 17C19.5625 17 19.25 17.3438 19.25 17.75V21.25C19.25 21.6875 19.5625 22 20 22C20.4062 22 20.75 21.6875 20.75 21.25V17.75C20.75 17.3438 20.4062 17 20 17ZM21 24C21 23.4688 20.5312 23 20 23C19.4375 23 19 23.4688 19 24C19 24.5625 19.4375 25 20 25C20.5312 25 21 24.5625 21 24Z" fill="var(--wa-color-warning-on-quiet)"/>
+<rect x="36" y="18" width="64" height="4" rx="2" fill="var(--wa-color-warning-on-quiet)"/>
+</svg>
diff --git a/docs/_includes/svgs/card.njk b/docs/_includes/svgs/card.njk
new file mode 100644
index 000000000..12f81ee78
--- /dev/null
+++ b/docs/_includes/svgs/card.njk
@@ -0,0 +1,10 @@
+<svg width="64" height="72" viewBox="0 0 64 72" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 1H52C58.0751 1 63 5.92487 63 12V60C63 66.0751 58.0751 71 52 71H12C5.92487 71 1 66.0751 1 60V12C1 5.92487 5.92487 1 12 1Z" fill="var(--wa-color-surface-default)"/>
+<path d="M12 1H52C58.0751 1 63 5.92487 63 12V60C63 66.0751 58.0751 71 52 71H12C5.92487 71 1 66.0751 1 60V12C1 5.92487 5.92487 1 12 1Z" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M52 1H12C5.92487 1 1 5.92487 1 12V35H63V12C63 5.92487 58.0751 1 52 1Z" fill="var(--wa-color-neutral-fill-quiet)"/>
+<path d="M52 1H12C5.92487 1 1 5.92487 1 12V35H63V12C63 5.92487 58.0751 1 52 1Z" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M16 25.3222L21.3333 19.9889L26.6667 25.3222L37.3333 13.5222L48 25.3222" stroke="var(--wa-color-neutral-on-quiet)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M23.8889 14.2333C23.8889 15.6447 22.7448 16.7889 21.3334 16.7889C19.922 16.7889 18.7778 15.6447 18.7778 14.2333C18.7778 12.8219 19.922 11.6778 21.3334 11.6778C22.7448 11.6778 23.8889 12.8219 23.8889 14.2333Z" stroke="var(--wa-color-neutral-on-quiet)" stroke-width="2"/>
+<rect x="12" y="44" width="40" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<rect x="12" y="56" width="40" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/carousel.njk b/docs/_includes/svgs/carousel.njk
new file mode 100644
index 000000000..f9e83e1c8
--- /dev/null
+++ b/docs/_includes/svgs/carousel.njk
@@ -0,0 +1,7 @@
+<svg width="130" height="48" viewBox="0 0 130 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1.21094 23.9844L5.71094 19.4844C5.99219 19.1797 6.48438 19.1797 6.76562 19.4844C7.07031 19.7656 7.07031 20.2578 6.76562 20.5391L2.80469 24.5L6.76562 28.4844C7.07031 28.7656 7.07031 29.2578 6.76562 29.5391C6.48438 29.8438 5.99219 29.8438 5.71094 29.5391L1.21094 25.0391C0.90625 24.7578 0.90625 24.2656 1.21094 23.9844Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<path d="M25 1H33C39.0751 1 44 5.92487 44 12V36C44 42.0751 39.0751 47 33 47H25C18.9249 47 14 42.0751 14 36V12C14 5.92487 18.9249 1 25 1Z" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M61 1H69C75.0751 1 80 5.92487 80 12V36C80 42.0751 75.0751 47 69 47H61C54.9249 47 50 42.0751 50 36V12C50 5.92487 54.9249 1 61 1Z" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M97 1H105C111.075 1 116 5.92487 116 12V36C116 42.0751 111.075 47 105 47H97C90.9249 47 86 42.0751 86 36V12C86 5.92487 90.9249 1 97 1Z" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M128.766 23.9844C129.07 24.2656 129.07 24.7578 128.766 25.0391L124.266 29.5391C123.984 29.8438 123.492 29.8438 123.211 29.5391C122.906 29.2578 122.906 28.7656 123.211 28.4844L127.172 24.5L123.211 20.5391C122.906 20.2578 122.906 19.7656 123.211 19.4844C123.492 19.1797 123.984 19.1797 124.266 19.4844L128.766 23.9844Z" fill="var(--wa-color-neutral-on-quiet)"/>
+</svg>
diff --git a/docs/_includes/svgs/checkbox.njk b/docs/_includes/svgs/checkbox.njk
new file mode 100644
index 000000000..7c4e530c2
--- /dev/null
+++ b/docs/_includes/svgs/checkbox.njk
@@ -0,0 +1,7 @@
+<svg width="56" height="36" viewBox="0 0 56 36" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 23C0 21.3431 1.34315 20 3 20H13C14.6569 20 16 21.3431 16 23V33C16 34.6569 14.6569 36 13 36H3C1.34315 36 0 34.6569 0 33V23Z" fill="var(--wa-color-brand-fill-loud)"/>
+<path d="M3 1H13C14.1046 1 15 1.89543 15 3V13C15 14.1046 14.1046 15 13 15H3C1.89543 15 1 14.1046 1 13V3C1 1.89543 1.89543 1 3 1Z" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M12.5977 24.6523C12.877 24.9102 12.877 25.3613 12.5977 25.6191L7.09766 31.1191C6.83984 31.3984 6.38867 31.3984 6.13086 31.1191L3.38086 28.3691C3.10156 28.1113 3.10156 27.6602 3.38086 27.4023C3.63867 27.123 4.08984 27.123 4.34766 27.4023L6.625 29.6582L11.6309 24.6523C11.8887 24.373 12.3398 24.373 12.5977 24.6523Z" fill="var(--wa-color-brand-on-loud)"/>
+<rect x="24" y="6" width="32" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<rect x="24" y="26" width="32" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/color-picker.njk b/docs/_includes/svgs/color-picker.njk
new file mode 100644
index 000000000..720a9a64a
--- /dev/null
+++ b/docs/_includes/svgs/color-picker.njk
@@ -0,0 +1,15 @@
+<svg width="96" height="16" viewBox="0 0 96 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect y="2" width="96" height="12" rx="6" fill="url(#paint0_linear_34_137)"/>
+<rect x="61" y="1" width="14" height="14" rx="7" fill="#4895FD" stroke="var(--wa-color-surface-default)" stroke-width="2"/>
+<defs>
+<linearGradient id="paint0_linear_34_137" x1="0" y1="8" x2="96" y2="8" gradientUnits="userSpaceOnUse">
+<stop offset="0.04" stop-color="#F2676C"/>
+<stop offset="0.1667" stop-color="#F39B00"/>
+<stop offset="0.3334" stop-color="#FCC041"/>
+<stop offset="0.5" stop-color="#5DC36F"/>
+<stop offset="0.67" stop-color="#4895FD"/>
+<stop offset="0.84" stop-color="#8A8BEB"/>
+<stop offset="1" stop-color="#C674E1"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/docs/_includes/svgs/copy-button.njk b/docs/_includes/svgs/copy-button.njk
new file mode 100644
index 000000000..3acfd8d72
--- /dev/null
+++ b/docs/_includes/svgs/copy-button.njk
@@ -0,0 +1,4 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 6C0 2.68629 2.68629 0 6 0H26C29.3137 0 32 2.68629 32 6V26C32 29.3137 29.3137 32 26 32H6C2.68629 32 0 29.3137 0 26V6Z" fill="var(--wa-color-neutral-fill-normal)"/>
+<path d="M15.5 8H19.375C19.75 8 20.1562 8.1875 20.4375 8.46875L22.5312 10.5625C22.8125 10.8438 23 11.25 23 11.625V18.5C23 19.3438 22.3125 20 21.5 20H15.5C14.6562 20 14 19.3438 14 18.5V9.5C14 8.6875 14.6562 8 15.5 8ZM10.5 12H13V14H11V22H17V21H19V22.5C19 23.3438 18.3125 24 17.5 24H10.5C9.65625 24 9 23.3438 9 22.5V13.5C9 12.6875 9.65625 12 10.5 12Z" fill="var(--wa-color-neutral-on-normal)"/>
+</svg>
diff --git a/docs/_includes/svgs/details.njk b/docs/_includes/svgs/details.njk
new file mode 100644
index 000000000..95894642f
--- /dev/null
+++ b/docs/_includes/svgs/details.njk
@@ -0,0 +1,7 @@
+<svg width="112" height="48" viewBox="0 0 112 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 1H100C106.075 1 111 5.92487 111 12V36C111 42.0751 106.075 47 100 47H12C5.92487 47 1 42.0751 1 36V12C1 5.92487 5.92487 1 12 1Z" fill="var(--wa-color-surface-default)"/>
+<path d="M12 1H100C106.075 1 111 5.92487 111 12V36C111 42.0751 106.075 47 100 47H12C5.92487 47 1 42.0751 1 36V12C1 5.92487 5.92487 1 12 1Z" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<rect x="12" y="16" width="64" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M93.4609 22.0391L88.9609 17.5391C88.6562 17.2578 88.6562 16.7656 88.9609 16.4844C89.2422 16.1797 89.7344 16.1797 90.0156 16.4844L94 20.4453L97.9609 16.4844C98.2422 16.1797 98.7344 16.1797 99.0156 16.4844C99.3203 16.7656 99.3203 17.2578 99.0156 17.5391L94.5156 22.0391C94.2344 22.3438 93.7422 22.3438 93.4609 22.0391Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<rect x="12" y="32" width="88" height="4" rx="2" fill="var(--wa-color-neutral-border-quiet)"/>
+</svg>
diff --git a/docs/_includes/svgs/dialog.njk b/docs/_includes/svgs/dialog.njk
new file mode 100644
index 000000000..a61d7e8cc
--- /dev/null
+++ b/docs/_includes/svgs/dialog.njk
@@ -0,0 +1,8 @@
+<svg width="80" height="64" viewBox="0 0 80 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 1H68C74.0751 1 79 5.92487 79 12V52C79 58.0751 74.0751 63 68 63H12C5.92487 63 1 58.0751 1 52V12C1 5.92487 5.92487 1 12 1Z" fill="var(--wa-color-surface-default)"/>
+<path d="M12 1H68C74.0751 1 79 5.92487 79 12V52C79 58.0751 74.0751 63 68 63H12C5.92487 63 1 58.0751 1 52V12C1 5.92487 5.92487 1 12 1Z" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<rect x="12" y="14" width="36" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M67.7566 13.3666L65.1357 15.9875L67.7566 18.6334C68.0811 18.9329 68.0811 19.4571 67.7566 19.7566C67.4571 20.0811 66.9329 20.0811 66.6334 19.7566L64.0125 17.1357L61.3666 19.7566C61.0671 20.0811 60.5429 20.0811 60.2434 19.7566C59.9189 19.4571 59.9189 18.9329 60.2434 18.6334L62.8643 15.9875L60.2434 13.3666C59.9189 13.0671 59.9189 12.5429 60.2434 12.2434C60.5429 11.9189 61.0671 11.9189 61.3666 12.2434L64.0125 14.8643L66.6334 12.2434C66.9329 11.9189 67.4571 11.9189 67.7566 12.2434C68.0811 12.5429 68.0811 13.0671 67.7566 13.3666Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<rect x="12" y="28" width="56" height="4" rx="2" fill="var(--wa-color-neutral-border-quiet)"/>
+<path d="M44 43C44 41.3431 45.3431 40 47 40H65C66.6569 40 68 41.3431 68 43V49C68 50.6569 66.6569 52 65 52H47C45.3431 52 44 50.6569 44 49V43Z" fill="var(--wa-color-brand-fill-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/divider.njk b/docs/_includes/svgs/divider.njk
new file mode 100644
index 000000000..4d4d2904a
--- /dev/null
+++ b/docs/_includes/svgs/divider.njk
@@ -0,0 +1,5 @@
+<svg width="98" height="32" viewBox="0 0 98 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="17" width="64" height="8" rx="4" fill="var(--wa-color-neutral-border-quiet)"/>
+<path d="M1 16H97" stroke="var(--wa-color-neutral-border-loud)" stroke-width="2" stroke-linecap="round"/>
+<rect x="17" y="24" width="64" height="8" rx="4" fill="var(--wa-color-neutral-border-quiet)"/>
+</svg>
diff --git a/docs/_includes/svgs/drawer.njk b/docs/_includes/svgs/drawer.njk
new file mode 100644
index 000000000..42fef3c08
--- /dev/null
+++ b/docs/_includes/svgs/drawer.njk
@@ -0,0 +1,16 @@
+<svg width="82" height="112" viewBox="0 0 82 112" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="path-1-outside-1_41_158" maskUnits="userSpaceOnUse" x="0" y="0" width="82" height="112" fill="black">
+<rect fill="var(--wa-color-surface-default)" width="82" height="112"/>
+<path d="M2 0H82V112H2V0Z"/>
+</mask>
+<path d="M2 0H82V112H2V0Z" fill="var(--wa-color-surface-default)"/>
+<path d="M4 112V0H0V112H4Z" fill="var(--wa-color-surface-border)" mask="url(#path-1-outside-1_41_158)"/>
+<rect x="14" y="14" width="36" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M69.7566 13.3666L67.1357 15.9875L69.7566 18.6334C70.0811 18.9329 70.0811 19.4571 69.7566 19.7566C69.4571 20.0811 68.9329 20.0811 68.6334 19.7566L66.0125 17.1357L63.3666 19.7566C63.0671 20.0811 62.5429 20.0811 62.2434 19.7566C61.9189 19.4571 61.9189 18.9329 62.2434 18.6334L64.8643 15.9875L62.2434 13.3666C61.9189 13.0671 61.9189 12.5429 62.2434 12.2434C62.5429 11.9189 63.0671 11.9189 63.3666 12.2434L66.0125 14.8643L68.6334 12.2434C68.9329 11.9189 69.4571 11.9189 69.7566 12.2434C70.0811 12.5429 70.0811 13.0671 69.7566 13.3666Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<rect x="14" y="28" width="56" height="4" rx="2" fill="var(--wa-color-neutral-border-quiet)"/>
+<rect x="14" y="40" width="56" height="4" rx="2" fill="var(--wa-color-neutral-border-quiet)"/>
+<rect x="14" y="52" width="56" height="4" rx="2" fill="var(--wa-color-neutral-border-quiet)"/>
+<rect x="14" y="64" width="56" height="4" rx="2" fill="var(--wa-color-neutral-border-quiet)"/>
+<rect x="14" y="76" width="56" height="4" rx="2" fill="var(--wa-color-neutral-border-quiet)"/>
+<path d="M46 91C46 89.3431 47.3431 88 49 88H67C68.6569 88 70 89.3431 70 91V97C70 98.6569 68.6569 100 67 100H49C47.3431 100 46 98.6569 46 97V91Z" fill="var(--wa-color-brand-fill-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/dropdown.njk b/docs/_includes/svgs/dropdown.njk
new file mode 100644
index 000000000..15ec1a8b4
--- /dev/null
+++ b/docs/_includes/svgs/dropdown.njk
@@ -0,0 +1,8 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 6C0 2.68629 2.68629 0 6 0H18C21.3137 0 24 2.68629 24 6V18C24 21.3137 21.3137 24 18 24H6C2.68629 24 0 21.3137 0 18V6Z" fill="var(--wa-color-neutral-fill-normal)"/>
+<path d="M11.4609 16.0391L6.96094 11.5391C6.65625 11.2578 6.65625 10.7656 6.96094 10.4844C7.24219 10.1797 7.73438 10.1797 8.01562 10.4844L12 14.4453L15.9609 10.4844C16.2422 10.1797 16.7344 10.1797 17.0156 10.4844C17.3203 10.7656 17.3203 11.2578 17.0156 11.5391L12.5156 16.0391C12.2344 16.3438 11.7422 16.3438 11.4609 16.0391Z" fill="var(--wa-color-neutral-on-normal)"/>
+<path d="M6 25H58C60.7614 25 63 27.2386 63 30V58C63 60.7614 60.7614 63 58 63H6C3.23858 63 1 60.7614 1 58V30C1 27.2386 3.23858 25 6 25Z" fill="var(--wa-color-surface-default)"/>
+<path d="M6 25H58C60.7614 25 63 27.2386 63 30V58C63 60.7614 60.7614 63 58 63H6C3.23858 63 1 60.7614 1 58V30C1 27.2386 3.23858 25 6 25Z" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<rect x="12" y="36" width="40" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<rect x="12" y="48" width="40" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/format-bytes.njk b/docs/_includes/svgs/format-bytes.njk
new file mode 100644
index 000000000..2b23bd44f
--- /dev/null
+++ b/docs/_includes/svgs/format-bytes.njk
@@ -0,0 +1,4 @@
+<svg width="76" height="12" viewBox="0 0 76 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.75 2V10.25H6.25C6.64844 10.25 7 10.6016 7 11C7 11.4219 6.64844 11.75 6.25 11.75H4H1.75C1.32812 11.75 1 11.4219 1 11C1 10.6016 1.32812 10.25 1.75 10.25H3.25V3.40625L2.14844 4.13281C1.82031 4.36719 1.35156 4.27344 1.11719 3.92188C0.882812 3.57031 0.976562 3.125 1.32812 2.89062L3.57812 1.39062C3.8125 1.22656 4.09375 1.22656 4.35156 1.34375C4.58594 1.48438 4.75 1.74219 4.75 2ZM12.7281 2.75C12.2359 2.75 11.7437 2.96094 11.3922 3.3125L10.6656 4.03906C10.3844 4.34375 9.89219 4.34375 9.61094 4.03906C9.30625 3.75781 9.30625 3.26562 9.61094 2.98438L10.3375 2.25781C10.9703 1.625 11.8375 1.25 12.7281 1.25C14.6266 1.25 16.15 2.77344 16.15 4.67188C16.15 5.5625 15.775 6.42969 15.1422 7.0625L11.9547 10.25H16.15C16.5484 10.25 16.9 10.6016 16.9 11C16.9 11.4219 16.5484 11.75 16.15 11.75H10.15C9.84531 11.75 9.56406 11.5859 9.44687 11.3047C9.32969 11.0234 9.4 10.6953 9.61094 10.4844L14.0875 6.00781C14.4391 5.65625 14.65 5.16406 14.65 4.67188C14.65 3.61719 13.7828 2.75 12.7281 2.75Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M26.5 1.25H28.75C30.3906 1.25 31.75 2.60938 31.75 4.25C31.75 5 31.4688 5.65625 31.0469 6.19531C31.9141 6.71094 32.5 7.67188 32.5 8.75C32.5 10.4141 31.1406 11.75 29.5 11.75H26.5C25.6562 11.75 25 11.0938 25 10.25V6.5V2.75C25 1.92969 25.6562 1.25 26.5 1.25ZM28.75 5.75C29.5703 5.75 30.25 5.09375 30.25 4.25C30.25 3.42969 29.5703 2.75 28.75 2.75H26.5V5.75H28.75ZM26.5 7.25V10.25H29.5C30.3203 10.25 31 9.59375 31 8.75C31 7.92969 30.3203 7.25 29.5 7.25H28.75H26.5ZM36.2594 1.57812L39.4 5.96094L42.5406 1.57812C42.775 1.22656 43.2437 1.15625 43.5719 1.39062C43.9 1.64844 43.9937 2.11719 43.7594 2.44531L40.15 7.50781V11C40.15 11.4219 39.7984 11.75 39.4 11.75C38.9781 11.75 38.65 11.4219 38.65 11V7.50781L35.0406 2.44531C34.7828 2.11719 34.8766 1.64844 35.2047 1.39062C35.5328 1.15625 36.0016 1.22656 36.2594 1.57812ZM47.05 1.25H50.8H54.55C54.9484 1.25 55.3 1.60156 55.3 2C55.3 2.42188 54.9484 2.75 54.55 2.75H51.55V11C51.55 11.4219 51.1984 11.75 50.8 11.75C50.3781 11.75 50.05 11.4219 50.05 11V2.75H47.05C46.6281 2.75 46.3 2.42188 46.3 2C46.3 1.60156 46.6281 1.25 47.05 1.25ZM59.2 1.25H64.45C64.8484 1.25 65.2 1.60156 65.2 2C65.2 2.42188 64.8484 2.75 64.45 2.75H59.2V5.75H62.95C63.3484 5.75 63.7 6.10156 63.7 6.5C63.7 6.92188 63.3484 7.25 62.95 7.25H59.2V10.25H64.45C64.8484 10.25 65.2 10.6016 65.2 11C65.2 11.4219 64.8484 11.75 64.45 11.75H59.2C58.3563 11.75 57.7 11.0938 57.7 10.25V6.5V2.75C57.7 1.92969 58.3563 1.25 59.2 1.25ZM69.9203 2.98438C69.4516 3.17188 69.1937 3.5 69.1234 3.89844C69.0531 4.22656 69.1 4.4375 69.1703 4.60156C69.2406 4.74219 69.3578 4.88281 69.5453 5.02344C70.0141 5.35156 70.6937 5.53906 71.5375 5.79688C71.5609 5.79688 71.5844 5.79688 71.6078 5.82031C72.3812 6.03125 73.2953 6.28906 73.975 6.75781C74.35 7.01562 74.6781 7.36719 74.8891 7.8125C75.1 8.28125 75.1469 8.79688 75.0297 9.38281C74.8656 10.3672 74.2094 11.0469 73.3656 11.4219C72.5219 11.7734 71.4906 11.8438 70.4594 11.6797C69.8969 11.5859 68.9828 11.2812 68.3969 11.0703C68.2797 11.0469 68.1859 11 68.0922 10.9766C67.7172 10.8359 67.5062 10.4141 67.6234 10.0156C67.7641 9.64062 68.1859 9.42969 68.5844 9.54688C68.7016 9.59375 68.8187 9.61719 68.9594 9.66406C69.5453 9.875 70.2719 10.1328 70.6937 10.2031C71.5609 10.3203 72.2641 10.25 72.7562 10.0391C73.2484 9.82812 73.4828 9.52344 73.5531 9.125C73.6234 8.79688 73.5766 8.5625 73.5062 8.42188C73.4594 8.28125 73.3187 8.14062 73.1312 8C72.6625 7.67188 71.9828 7.48438 71.1391 7.22656C71.1156 7.22656 71.0922 7.22656 71.0687 7.20312C70.2953 6.99219 69.3812 6.73438 68.7016 6.26562C68.3266 6.00781 67.9984 5.65625 67.7875 5.21094C67.6 4.74219 67.5531 4.22656 67.6469 3.64062L68.3734 3.78125L67.6469 3.64062C67.8109 2.65625 68.4672 1.97656 69.3109 1.60156C70.1547 1.25 71.1859 1.17969 72.2172 1.34375C72.5219 1.39062 73.4594 1.57812 73.7875 1.67188C74.1859 1.76562 74.4203 2.1875 74.3031 2.58594C74.2094 2.98438 73.7875 3.21875 73.3891 3.10156C73.1312 3.03125 72.2641 2.86719 71.9828 2.82031L72.1 2.09375L71.9828 2.82031C71.1156 2.70312 70.4125 2.77344 69.9203 2.98438Z" fill="var(--wa-color-neutral-on-quiet)"/>
+</svg>
diff --git a/docs/_includes/svgs/format-date.njk b/docs/_includes/svgs/format-date.njk
new file mode 100644
index 000000000..2543e6b15
--- /dev/null
+++ b/docs/_includes/svgs/format-date.njk
@@ -0,0 +1,7 @@
+<svg width="89" height="16" viewBox="0 0 89 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1 2C1 1.60156 1.32812 1.25 1.75 1.25H7.375C7.67969 1.25 7.96094 1.46094 8.05469 1.74219C8.17188 2.02344 8.10156 2.35156 7.86719 2.5625L4.79688 5.375H5.3125C7.07031 5.375 8.5 6.80469 8.5 8.5625C8.5 10.3438 7.07031 11.75 5.3125 11.75H3.46094C2.47656 11.75 1.5625 11.1875 1.11719 10.3203L1.07031 10.2266C0.882812 9.85156 1.02344 9.40625 1.39844 9.21875C1.77344 9.03125 2.21875 9.17188 2.40625 9.54688L2.45312 9.64062C2.64062 10.0156 3.03906 10.25 3.46094 10.25H5.3125C6.22656 10.25 7 9.5 7 8.5625C7 7.64844 6.22656 6.875 5.3125 6.875H2.875C2.54688 6.875 2.28906 6.6875 2.17188 6.40625C2.05469 6.125 2.125 5.79688 2.35938 5.58594L5.42969 2.75H1.75C1.32812 2.75 1 2.42188 1 2Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M16.0859 13.0859C16.0443 13.1745 15.9688 13.2396 15.8594 13.2812C15.75 13.3229 15.6276 13.3438 15.4922 13.3438C15.3411 13.3438 15.1849 13.3203 15.0234 13.2734C14.862 13.2318 14.7188 13.1693 14.5938 13.0859C14.474 13.0078 14.3854 12.9115 14.3281 12.7969C14.2708 12.6875 14.2734 12.5651 14.3359 12.4297L19.5078 0.804688C19.5495 0.716146 19.625 0.651042 19.7344 0.609375C19.849 0.5625 19.9766 0.539062 20.1172 0.539062C20.2682 0.539062 20.4219 0.5625 20.5781 0.609375C20.7396 0.651042 20.8802 0.713542 21 0.796875C21.125 0.875 21.2135 0.971354 21.2656 1.08594C21.3229 1.19531 21.3203 1.32031 21.2578 1.46094L16.0859 13.0859Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<path d="M27 2C27 1.60156 27.3281 1.25 27.75 1.25H33.375C33.6797 1.25 33.9609 1.46094 34.0547 1.74219C34.1719 2.02344 34.1016 2.35156 33.8672 2.5625L30.7969 5.375H31.3125C33.0703 5.375 34.5 6.80469 34.5 8.5625C34.5 10.3438 33.0703 11.75 31.3125 11.75H29.4609C28.4766 11.75 27.5625 11.1875 27.1172 10.3203L27.0703 10.2266C26.8828 9.85156 27.0234 9.40625 27.3984 9.21875C27.7734 9.03125 28.2188 9.17188 28.4062 9.54688L28.4531 9.64062C28.6406 10.0156 29.0391 10.25 29.4609 10.25H31.3125C32.2266 10.25 33 9.5 33 8.5625C33 7.64844 32.2266 6.875 31.3125 6.875H28.875C28.5469 6.875 28.2891 6.6875 28.1719 6.40625C28.0547 6.125 28.125 5.79688 28.3594 5.58594L31.4297 2.75H27.75C27.3281 2.75 27 2.42188 27 2Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M42.0859 13.0859C42.0443 13.1745 41.9688 13.2396 41.8594 13.2812C41.75 13.3229 41.6276 13.3438 41.4922 13.3438C41.3411 13.3438 41.1849 13.3203 41.0234 13.2734C40.862 13.2318 40.7188 13.1693 40.5938 13.0859C40.474 13.0078 40.3854 12.9115 40.3281 12.7969C40.2708 12.6875 40.2734 12.5651 40.3359 12.4297L45.5078 0.804688C45.5495 0.716146 45.625 0.651042 45.7344 0.609375C45.849 0.5625 45.9766 0.539062 46.1172 0.539062C46.2682 0.539062 46.4219 0.5625 46.5781 0.609375C46.7396 0.651042 46.8802 0.713542 47 0.796875C47.125 0.875 47.2135 0.971354 47.2656 1.08594C47.3229 1.19531 47.3203 1.32031 47.2578 1.46094L42.0859 13.0859Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<path d="M56.3281 2.75C55.8359 2.75 55.3438 2.96094 54.9922 3.3125L54.2656 4.03906C53.9844 4.34375 53.4922 4.34375 53.2109 4.03906C52.9062 3.75781 52.9062 3.26562 53.2109 2.98438L53.9375 2.25781C54.5703 1.625 55.4375 1.25 56.3281 1.25C58.2266 1.25 59.75 2.77344 59.75 4.67188C59.75 5.5625 59.375 6.42969 58.7422 7.0625L55.5547 10.25H59.75C60.1484 10.25 60.5 10.6016 60.5 11C60.5 11.4219 60.1484 11.75 59.75 11.75H53.75C53.4453 11.75 53.1641 11.5859 53.0469 11.3047C52.9297 11.0234 53 10.6953 53.2109 10.4844L57.6875 6.00781C58.0391 5.65625 58.25 5.16406 58.25 4.67188C58.25 3.61719 57.3828 2.75 56.3281 2.75ZM62.9 5C62.9 2.9375 64.5641 1.25 66.65 1.25C68.7125 1.25 70.4 2.9375 70.4 5V8C70.4 10.0859 68.7125 11.75 66.65 11.75C64.5641 11.75 62.9 10.0859 62.9 8V5ZM66.65 2.75C65.4078 2.75 64.4 3.75781 64.4 5V8C64.4 9.24219 65.4078 10.25 66.65 10.25C67.8922 10.25 68.9 9.24219 68.9 8V5C68.9 3.75781 67.8922 2.75 66.65 2.75ZM76.55 2V10.25H78.05C78.4484 10.25 78.8 10.6016 78.8 11C78.8 11.4219 78.4484 11.75 78.05 11.75H75.8H73.55C73.1281 11.75 72.8 11.4219 72.8 11C72.8 10.6016 73.1281 10.25 73.55 10.25H75.05V3.40625L73.9484 4.13281C73.6203 4.36719 73.1516 4.27344 72.9172 3.92188C72.6828 3.57031 72.7766 3.125 73.1281 2.89062L75.3781 1.39062C75.6125 1.22656 75.8937 1.22656 76.1516 1.34375C76.3859 1.48438 76.55 1.74219 76.55 2ZM84.5281 2.75C84.0359 2.75 83.5438 2.96094 83.1922 3.3125L82.4656 4.03906C82.1844 4.34375 81.6922 4.34375 81.4109 4.03906C81.1063 3.75781 81.1063 3.26562 81.4109 2.98438L82.1375 2.25781C82.7703 1.625 83.6375 1.25 84.5281 1.25C86.4266 1.25 87.95 2.77344 87.95 4.67188C87.95 5.5625 87.575 6.42969 86.9422 7.0625L83.7547 10.25H87.95C88.3484 10.25 88.7 10.6016 88.7 11C88.7 11.4219 88.3484 11.75 87.95 11.75H81.95C81.6453 11.75 81.3641 11.5859 81.2469 11.3047C81.1297 11.0234 81.2 10.6953 81.4109 10.4844L85.8875 6.00781C86.2391 5.65625 86.45 5.16406 86.45 4.67188C86.45 3.61719 85.5828 2.75 84.5281 2.75Z" fill="var(--wa-color-neutral-border-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/format-number.njk b/docs/_includes/svgs/format-number.njk
new file mode 100644
index 000000000..de872f38b
--- /dev/null
+++ b/docs/_includes/svgs/format-number.njk
@@ -0,0 +1,8 @@
+<svg width="82" height="16" viewBox="0 0 82 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.75 0.5C4.14844 0.5 4.5 0.851562 4.5 1.25V2.09375C4.52344 2.09375 4.57031 2.11719 4.59375 2.11719C4.61719 2.11719 4.61719 2.11719 4.61719 2.11719L5.74219 2.32812C6.16406 2.39844 6.42188 2.79688 6.35156 3.19531C6.28125 3.59375 5.88281 3.875 5.48438 3.80469L4.35938 3.59375C3.63281 3.47656 2.97656 3.57031 2.53125 3.73438C2.08594 3.92188 1.89844 4.17969 1.85156 4.39062C1.80469 4.64844 1.85156 4.78906 1.875 4.88281C1.92188 4.97656 2.01562 5.07031 2.17969 5.1875C2.55469 5.44531 3.14062 5.60938 3.91406 5.79688L3.98438 5.82031C4.64062 6.00781 5.46094 6.21875 6.07031 6.61719C6.39844 6.82812 6.72656 7.13281 6.91406 7.53125C7.125 7.95312 7.14844 8.42188 7.07812 8.9375C6.91406 9.82812 6.28125 10.4141 5.53125 10.7188C5.20312 10.8594 4.85156 10.9297 4.5 10.9766V11.75C4.5 12.1719 4.14844 12.5 3.75 12.5C3.32812 12.5 3 12.1719 3 11.75V10.9531C2.97656 10.9297 2.97656 10.9297 2.95312 10.9297C2.39062 10.8594 1.45312 10.6016 0.820312 10.3203C0.421875 10.1562 0.257812 9.71094 0.421875 9.33594C0.609375 8.96094 1.03125 8.77344 1.42969 8.96094C1.89844 9.17188 2.71875 9.38281 3.1875 9.45312C3.9375 9.57031 4.54688 9.5 4.96875 9.33594C5.36719 9.17188 5.53125 8.9375 5.60156 8.65625C5.625 8.39844 5.60156 8.25781 5.55469 8.1875C5.50781 8.09375 5.4375 7.97656 5.25 7.85938C4.875 7.625 4.28906 7.46094 3.51562 7.25L3.44531 7.22656C2.78906 7.0625 1.96875 6.82812 1.35938 6.42969C1.03125 6.21875 0.703125 5.91406 0.515625 5.51562C0.328125 5.09375 0.28125 4.625 0.375 4.13281C0.539062 3.21875 1.21875 2.65625 1.96875 2.35156C2.29688 2.21094 2.625 2.14062 3 2.09375V1.25C3 0.851562 3.32812 0.5 3.75 0.5Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<path d="M13.75 2V10.25H15.25C15.6484 10.25 16 10.6016 16 11C16 11.4219 15.6484 11.75 15.25 11.75H13H10.75C10.3281 11.75 10 11.4219 10 11C10 10.6016 10.3281 10.25 10.75 10.25H12.25V3.40625L11.1484 4.13281C10.8203 4.36719 10.3516 4.27344 10.1172 3.92188C9.88281 3.57031 9.97656 3.125 10.3281 2.89062L12.5781 1.39062C12.8125 1.22656 13.0938 1.22656 13.3516 1.34375C13.5859 1.48438 13.75 1.74219 13.75 2Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M20.0625 12.9766C20.0052 13.0859 19.9245 13.1667 19.8203 13.2188C19.7161 13.2708 19.5729 13.2969 19.3906 13.2969C19.1719 13.2969 19.0052 13.2526 18.8906 13.1641C18.7812 13.0755 18.7396 12.9479 18.7656 12.7812L19.5 8.54688C19.5417 8.33854 19.6771 8.23438 19.9062 8.23438H21.9297C22.0599 8.23438 22.1458 8.28385 22.1875 8.38281C22.2292 8.47656 22.2161 8.59115 22.1484 8.72656L20.0625 12.9766Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<path d="M26 5C26 2.9375 27.6641 1.25 29.75 1.25C31.8125 1.25 33.5 2.9375 33.5 5V8C33.5 10.0859 31.8125 11.75 29.75 11.75C27.6641 11.75 26 10.0859 26 8V5ZM29.75 2.75C28.5078 2.75 27.5 3.75781 27.5 5V8C27.5 9.24219 28.5078 10.25 29.75 10.25C30.9922 10.25 32 9.24219 32 8V5C32 3.75781 30.9922 2.75 29.75 2.75ZM35.9 5C35.9 2.9375 37.5641 1.25 39.65 1.25C41.7125 1.25 43.4 2.9375 43.4 5V8C43.4 10.0859 41.7125 11.75 39.65 11.75C37.5641 11.75 35.9 10.0859 35.9 8V5ZM39.65 2.75C38.4078 2.75 37.4 3.75781 37.4 5V8C37.4 9.24219 38.4078 10.25 39.65 10.25C40.8922 10.25 41.9 9.24219 41.9 8V5C41.9 3.75781 40.8922 2.75 39.65 2.75ZM45.8 5C45.8 2.9375 47.4641 1.25 49.55 1.25C51.6125 1.25 53.3 2.9375 53.3 5V8C53.3 10.0859 51.6125 11.75 49.55 11.75C47.4641 11.75 45.8 10.0859 45.8 8V5ZM49.55 2.75C48.3078 2.75 47.3 3.75781 47.3 5V8C47.3 9.24219 48.3078 10.25 49.55 10.25C50.7922 10.25 51.8 9.24219 51.8 8V5C51.8 3.75781 50.7922 2.75 49.55 2.75Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M57.1719 9.54688C57.1719 9.32292 57.2135 9.11198 57.2969 8.91406C57.3854 8.71615 57.5026 8.54427 57.6484 8.39844C57.7943 8.2526 57.9661 8.13802 58.1641 8.05469C58.362 7.96615 58.5729 7.92188 58.7969 7.92188C59.0208 7.92188 59.2318 7.96615 59.4297 8.05469C59.6276 8.13802 59.7995 8.2526 59.9453 8.39844C60.0911 8.54427 60.2057 8.71615 60.2891 8.91406C60.3776 9.11198 60.4219 9.32292 60.4219 9.54688C60.4219 9.77083 60.3776 9.98177 60.2891 10.1797C60.2057 10.3776 60.0911 10.5495 59.9453 10.6953C59.7995 10.8411 59.6276 10.9557 59.4297 11.0391C59.2318 11.1276 59.0208 11.1719 58.7969 11.1719C58.5729 11.1719 58.362 11.1276 58.1641 11.0391C57.9661 10.9557 57.7943 10.8411 57.6484 10.6953C57.5026 10.5495 57.3854 10.3776 57.2969 10.1797C57.2135 9.98177 57.1719 9.77083 57.1719 9.54688Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<path d="M64 5C64 2.9375 65.6641 1.25 67.75 1.25C69.8125 1.25 71.5 2.9375 71.5 5V8C71.5 10.0859 69.8125 11.75 67.75 11.75C65.6641 11.75 64 10.0859 64 8V5ZM67.75 2.75C66.5078 2.75 65.5 3.75781 65.5 5V8C65.5 9.24219 66.5078 10.25 67.75 10.25C68.9922 10.25 70 9.24219 70 8V5C70 3.75781 68.9922 2.75 67.75 2.75ZM73.9 5C73.9 2.9375 75.5641 1.25 77.65 1.25C79.7125 1.25 81.4 2.9375 81.4 5V8C81.4 10.0859 79.7125 11.75 77.65 11.75C75.5641 11.75 73.9 10.0859 73.9 8V5ZM77.65 2.75C76.4078 2.75 75.4 3.75781 75.4 5V8C75.4 9.24219 76.4078 10.25 77.65 10.25C78.8922 10.25 79.9 9.24219 79.9 8V5C79.9 3.75781 78.8922 2.75 77.65 2.75Z" fill="var(--wa-color-neutral-border-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/icon-button.njk b/docs/_includes/svgs/icon-button.njk
new file mode 100644
index 000000000..ccb8fa3e1
--- /dev/null
+++ b/docs/_includes/svgs/icon-button.njk
@@ -0,0 +1,4 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 6C0 2.68629 2.68629 0 6 0H26C29.3137 0 32 2.68629 32 6V26C32 29.3137 29.3137 32 26 32H6C2.68629 32 0 29.3137 0 26V6Z" fill="var(--wa-color-neutral-fill-normal)"/>
+<path d="M23.4688 13.2188C23.5938 13.5 23.5 13.7812 23.2812 14L21.9375 15.2188C21.9688 15.4688 21.9688 15.75 21.9688 16C21.9688 16.2812 21.9688 16.5625 21.9375 16.8125L23.2812 18.0312C23.5 18.2188 23.5938 18.5312 23.4688 18.8125C23.3438 19.1875 23.1875 19.5312 23 19.875L22.8438 20.125C22.625 20.4688 22.4062 20.8125 22.1562 21.0938C21.9688 21.3438 21.6562 21.4062 21.375 21.3125L19.6562 20.7812C19.2188 21.0938 18.75 21.3438 18.2812 21.5625L17.875 23.3438C17.8125 23.625 17.5938 23.8438 17.3125 23.9062C16.875 23.9688 16.4375 24 15.9688 24C15.5312 24 15.0938 23.9688 14.6562 23.9062C14.375 23.8438 14.1562 23.625 14.0938 23.3438L13.6875 21.5625C13.1875 21.3438 12.75 21.0938 12.3125 20.7812L10.5938 21.3125C10.3125 21.4062 10 21.3438 9.8125 21.125C9.5625 20.8125 9.34375 20.4688 9.125 20.125L8.96875 19.875C8.78125 19.5312 8.625 19.1875 8.5 18.8125C8.375 18.5312 8.46875 18.25 8.6875 18.0312L10.0312 16.8125C10 16.5625 10 16.2812 10 16C10 15.75 10 15.4688 10.0312 15.2188L8.6875 14C8.46875 13.7812 8.375 13.5 8.5 13.2188C8.625 12.8438 8.78125 12.5 8.96875 12.1562L9.125 11.9062C9.34375 11.5625 9.5625 11.2188 9.8125 10.9062C10 10.6875 10.3125 10.625 10.5938 10.7188L12.3125 11.25C12.75 10.9375 13.2188 10.6562 13.6875 10.4688L14.0938 8.6875C14.1562 8.40625 14.375 8.1875 14.6562 8.125C15.0938 8.0625 15.5312 8 16 8C16.4375 8 16.875 8.0625 17.3125 8.125C17.5938 8.15625 17.8125 8.40625 17.875 8.6875L18.2812 10.4688C18.7812 10.6562 19.2188 10.9375 19.6562 11.25L21.375 10.7188C21.6562 10.625 21.9688 10.6875 22.1562 10.9062C22.4062 11.2188 22.625 11.5625 22.8438 11.9062L23 12.1562C23.1875 12.5 23.3438 12.8438 23.5 13.2188H23.4688ZM16 18.5C16.875 18.5 17.6875 18.0312 18.1562 17.25C18.5938 16.5 18.5938 15.5312 18.1562 14.75C17.6875 14 16.875 13.5 16 13.5C15.0938 13.5 14.2812 14 13.8125 14.75C13.375 15.5312 13.375 16.5 13.8125 17.25C14.2812 18.0312 15.0938 18.5 16 18.5Z" fill="var(--wa-color-neutral-on-normal)"/>
+</svg>
diff --git a/docs/_includes/svgs/icon.njk b/docs/_includes/svgs/icon.njk
new file mode 100644
index 000000000..d37d2399e
--- /dev/null
+++ b/docs/_includes/svgs/icon.njk
@@ -0,0 +1,10 @@
+<svg width="87" height="38" viewBox="0 0 87 38" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.5 5C9.5 4.125 9 3.3125 8.25 2.84375C7.46875 2.40625 6.5 2.40625 5.75 2.84375C4.96875 3.3125 4.5 4.125 4.5 5C4.5 5.90625 4.96875 6.71875 5.75 7.1875C6.5 7.625 7.46875 7.625 8.25 7.1875C9 6.71875 9.5 5.90625 9.5 5ZM3 5C3 3.59375 3.75 2.28125 5 1.5625C6.21875 0.84375 7.75 0.84375 9 1.5625C10.2188 2.28125 11 3.59375 11 5C11 6.4375 10.2188 7.75 9 8.46875C7.75 9.1875 6.21875 9.1875 5 8.46875C3.75 7.75 3 6.4375 3 5ZM1.53125 15.5H12.4375C12.1562 13.5312 10.4688 12 8.40625 12H5.5625C3.5 12 1.8125 13.5312 1.53125 15.5ZM0 16.0938C0 13 2.46875 10.5 5.5625 10.5H8.40625C11.5 10.5 14 13 14 16.0938C14 16.5938 13.5625 17 13.0625 17H0.90625C0.40625 17 0 16.5938 0 16.0938Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M35.7812 2.84375H35.75C35.4688 2.5625 35 2.5625 34.7188 2.84375L33.7812 3.75L35.25 5.21875L36.1562 4.28125C36.4375 4 36.4375 3.53125 36.1562 3.21875L35.7812 2.84375ZM28.5312 9.03125C28.4375 9.09375 28.375 9.21875 28.3438 9.34375L27.8125 11.1562L29.6562 10.6562C29.7812 10.625 29.875 10.5625 29.9688 10.4688L34.1875 6.25L32.75 4.8125L28.5312 9.03125ZM33.6562 1.78125C34.5312 0.90625 35.9375 0.90625 36.8125 1.78125L37.2188 2.1875C38.0938 3.0625 38.0938 4.46875 37.2188 5.34375L31.0312 11.5312C30.7812 11.7812 30.4375 11.9688 30.0625 12.0938L26.9375 12.9688C26.6875 13.0625 26.4062 13 26.2188 12.7812C26 12.5938 25.9375 12.3125 26 12.0625L26.9062 8.9375C27 8.5625 27.2188 8.21875 27.4688 7.96875L33.6562 1.78125ZM24.75 3H28.25C28.6562 3 29 3.34375 29 3.75C29 4.1875 28.6562 4.5 28.25 4.5H24.75C24.0312 4.5 23.5 5.0625 23.5 5.75V14.25C23.5 14.9688 24.0312 15.5 24.75 15.5H33.25C33.9375 15.5 34.5 14.9688 34.5 14.25V10.75C34.5 10.3438 34.8125 10 35.25 10C35.6562 10 36 10.3438 36 10.75V14.25C36 15.7812 34.75 17 33.25 17H24.75C23.2188 17 22 15.7812 22 14.25V5.75C22 4.25 23.2188 3 24.75 3Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M46.5 9.15625L60.5 1.15625C60.8125 0.96875 61.25 0.96875 61.5625 1.1875C61.875 1.40625 62.0312 1.78125 61.9688 2.15625L59.9688 15.1562C59.875 15.7812 59.1875 16.1875 58.5938 15.9375L54.7188 14.3125L52.7812 16.6562C52.5938 16.875 52.3125 17 52 17C51.4375 17 51 16.5625 51 16V12.75L46.5938 10.9375C45.8438 10.625 45.7812 9.5625 46.5 9.15625ZM48.125 9.9375L51.9688 11.5312L51.9375 11.5L58.7812 3.84375L48.125 9.9375ZM58.5938 14.3125L60.0625 4.65625L53.375 12.125L58.5938 14.3125Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M84.5 9C84.5 6.6875 83.25 4.5625 81.25 3.375C79.2188 2.21875 76.75 2.21875 74.75 3.375C72.7188 4.5625 71.5 6.6875 71.5 9C71.5 11.3438 72.7188 13.4688 74.75 14.6562C76.75 15.8125 79.2188 15.8125 81.25 14.6562C83.25 13.4688 84.5 11.3438 84.5 9ZM70 9C70 6.15625 71.5 3.53125 74 2.09375C76.4688 0.65625 79.5 0.65625 82 2.09375C84.4688 3.53125 86 6.15625 86 9C86 11.875 84.4688 14.5 82 15.9375C79.5 17.375 76.4688 17.375 74 15.9375C71.5 14.5 70 11.875 70 9ZM74.0625 10.8125C73.9375 10.4062 74.2812 10 74.75 10H81.375C81.8125 10 82.1875 10.4062 82.0312 10.8125C81.5312 12.5312 79.9375 13.75 78.0625 13.75C76.1875 13.75 74.5938 12.5312 74.0625 10.8125ZM74.5 7C74.5 6.46875 74.9375 6 75.5 6C76.0625 6 76.5 6.46875 76.5 7C76.5 7.5625 76.0625 8 75.5 8C74.9375 8 74.5 7.5625 74.5 7ZM79.6875 7.6875C79.4375 7.9375 79.0625 7.96875 78.7812 7.71875C78.5312 7.46875 78.5312 7.09375 78.7812 6.84375C79.2188 6.34375 79.875 6.125 80.4688 6.125C81.0938 6.125 81.7188 6.34375 82.1875 6.84375C82.4062 7.09375 82.4062 7.46875 82.1562 7.71875C81.9062 7.96875 81.5 7.9375 81.2812 7.6875C81.0938 7.5 80.8125 7.375 80.4688 7.375C80.1562 7.375 79.8438 7.5 79.6875 7.6875Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M7 29C5.5625 29 4.25 28.25 3.53125 27C2.8125 25.7812 2.8125 24.25 3.53125 23C4.25 21.7812 5.5625 21 7 21C8.40625 21 9.71875 21.7812 10.4375 23C11.1562 24.25 11.1562 25.7812 10.4375 27C9.71875 28.25 8.40625 29 7 29ZM5.5625 30.5H8.40625C11.5 30.5 14 33 14 36.0938C14 36.5938 13.5625 37 13.0625 37H0.90625C0.40625 37 0 36.5938 0 36.0938C0 33 2.46875 30.5 5.5625 30.5Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M36.7188 21.6875L37.3125 22.2812C38 22.9688 38 24.0625 37.3125 24.75L36.375 25.6875L33.3125 22.625L34.25 21.6875C34.9375 21 36.0312 21 36.7188 21.6875ZM27.375 28.5625L32.5938 23.3438L35.6562 26.4062L30.4375 31.625C30.25 31.8125 30 31.9688 29.75 32.0625L26.9688 32.9688C26.7188 33.0625 26.4062 33 26.2188 32.7812C26 32.5938 25.9375 32.2812 26.0312 32.0312L26.9375 29.25C27.0312 29 27.1875 28.75 27.375 28.5625ZM25 23H28C28.5312 23 29 23.4688 29 24C29 24.5625 28.5312 25 28 25H25C24.4375 25 24 25.4688 24 26V34C24 34.5625 24.4375 35 25 35H33C33.5312 35 34 34.5625 34 34V31C34 30.4688 34.4375 30 35 30C35.5312 30 36 30.4688 36 31V34C36 35.6562 34.6562 37 33 37H25C23.3438 37 22 35.6562 22 34V26C22 24.3438 23.3438 23 25 23Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M61.5625 21.1875C61.875 21.4062 62.0312 21.7812 61.9688 22.1562L59.9688 35.1562C59.9375 35.4688 59.75 35.7188 59.4688 35.875C59.2188 36.0312 58.875 36.0625 58.5938 35.9375L54.875 34.375L52.7188 36.6875C52.4375 37 52 37.0938 51.625 36.9375C51.25 36.8125 51 36.4375 51 36V33.4062C51 33.2812 51.0312 33.1562 51.125 33.0625L56.3438 27.3438C56.5312 27.1562 56.5312 26.8438 56.3438 26.6562C56.1562 26.4688 55.8438 26.4688 55.6562 26.6562L49.3125 32.2812L46.5312 30.9062C46.2188 30.75 46 30.4062 46 30.0312C45.9688 29.6875 46.1562 29.3438 46.5 29.1562L60.5 21.1562C60.8125 20.9688 61.25 20.9688 61.5625 21.1875Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M78 37C75.125 37 72.5 35.5 71.0625 33C69.625 30.5312 69.625 27.5 71.0625 25C72.5 22.5312 75.125 21 78 21C80.8438 21 83.4688 22.5312 84.9062 25C86.3438 27.5 86.3438 30.5312 84.9062 33C83.4688 35.5 80.8438 37 78 37ZM73 30.8438C73.5938 32.9375 75.5938 34.5 78 34.5C80.375 34.5 82.375 32.9375 82.9688 30.8438C83.0938 30.4062 82.7188 30 82.2812 30H73.6875C73.25 30 72.9062 30.4062 73 30.8438ZM74.5 27C74.5 27.5625 74.9375 28 75.5 28C76.0625 28 76.5 27.5625 76.5 27C76.5 26.4688 76.0625 26 75.5 26C74.9375 26 74.5 26.4688 74.5 27ZM79.375 27.8125C79.9375 27.0938 81.0312 27.0938 81.5938 27.8125C81.75 28.0312 82.0625 28.0938 82.2812 27.9062C82.5 27.75 82.5625 27.4375 82.375 27.2188C81.4375 25.9375 79.5312 25.9375 78.5938 27.2188C78.4062 27.4375 78.4688 27.75 78.6875 27.9062C78.9062 28.0938 79.2188 28.0312 79.375 27.8125Z" fill="var(--wa-color-neutral-border-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/image-comparer.njk b/docs/_includes/svgs/image-comparer.njk
new file mode 100644
index 000000000..14f28048f
--- /dev/null
+++ b/docs/_includes/svgs/image-comparer.njk
@@ -0,0 +1,9 @@
+<svg width="96" height="64" viewBox="0 0 96 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 1H84C90.0751 1 95 5.92487 95 12V52C95 58.0751 90.0751 63 84 63H12C5.92487 63 1 58.0751 1 52V12C1 5.92487 5.92487 1 12 1Z" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M12 52L24 39L36 52L48 37" stroke="var(--wa-color-brand-fill-loud)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M48 37L60 22L84 52" stroke="var(--wa-color-neutral-border-loud)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<circle cx="24" cy="20" r="7" stroke="var(--wa-color-brand-fill-loud)" stroke-width="2"/>
+<line x1="48" y1="-4.37114e-08" x2="48" y2="62" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<circle cx="48" cy="32" r="12" fill="var(--wa-color-neutral-fill-normal)"/>
+<path d="M45.1875 34.55H46.3125C46.8281 34.55 47.25 34.9719 47.25 35.4875V36.6125C47.25 37.1516 46.8281 37.55 46.3125 37.55H45.1875C44.6484 37.55 44.25 37.1516 44.25 36.6125V35.4875C44.25 34.9719 44.6484 34.55 45.1875 34.55ZM49.6875 34.55H50.8125C51.3281 34.55 51.75 34.9719 51.75 35.4875V36.6125C51.75 37.1516 51.3281 37.55 50.8125 37.55H49.6875C49.1484 37.55 48.75 37.1516 48.75 36.6125V35.4875C48.75 34.9719 49.1484 34.55 49.6875 34.55ZM45.1875 33.8C44.6484 33.8 44.25 33.4016 44.25 32.8625V31.7375C44.25 31.2219 44.6484 30.8 45.1875 30.8H46.3125C46.8281 30.8 47.25 31.2219 47.25 31.7375V32.8625C47.25 33.4016 46.8281 33.8 46.3125 33.8H45.1875ZM49.6875 30.8H50.8125C51.3281 30.8 51.75 31.2219 51.75 31.7375V32.8625C51.75 33.4016 51.3281 33.8 50.8125 33.8H49.6875C49.1484 33.8 48.75 33.4016 48.75 32.8625V31.7375C48.75 31.2219 49.1484 30.8 49.6875 30.8ZM45.1875 30.05C44.6484 30.05 44.25 29.6516 44.25 29.1125V27.9875C44.25 27.4719 44.6484 27.05 45.1875 27.05H46.3125C46.8281 27.05 47.25 27.4719 47.25 27.9875V29.1125C47.25 29.6516 46.8281 30.05 46.3125 30.05H45.1875ZM49.6875 27.05H50.8125C51.3281 27.05 51.75 27.4719 51.75 27.9875V29.1125C51.75 29.6516 51.3281 30.05 50.8125 30.05H49.6875C49.1484 30.05 48.75 29.6516 48.75 29.1125V27.9875C48.75 27.4719 49.1484 27.05 49.6875 27.05Z" fill="var(--wa-color-neutral-on-normal)"/>
+</svg>
diff --git a/docs/_includes/svgs/include.njk b/docs/_includes/svgs/include.njk
new file mode 100644
index 000000000..5674c0ecc
--- /dev/null
+++ b/docs/_includes/svgs/include.njk
@@ -0,0 +1,5 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.049 10.9993H3.29128C2.76334 11.0204 2.31986 10.5775 2.34098 10.0502C2.31986 9.52299 2.76334 9.0801 3.29128 9.10119L7.74713 9.0801L1.28509 2.62661C0.90497 2.24699 0.90497 1.65648 1.28509 1.27686C1.64409 0.918333 2.25651 0.897244 2.63663 1.27686L9.09867 7.73035V3.30149C9.07756 2.77424 9.52103 2.33135 10.049 2.35244C10.5769 2.33135 11.0204 2.77424 10.9993 3.30149V10.0502C11.0204 10.5775 10.5769 11.0204 10.049 10.9993Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M51 1H20.375V16.375C20.375 18.5841 18.5841 20.375 16.375 20.375H1V51C1 57.6274 6.37258 63 13 63H51C57.6274 63 63 57.6274 63 51V13C63 6.37258 57.6274 1 51 1Z" fill="none"/>
+<path d="M20.375 1V0C19.8227 0 19.375 0.447715 19.375 1L20.375 1ZM1 20.375V19.375C0.447715 19.375 0 19.8227 0 20.375H1ZM19.375 4.84375C19.375 5.39603 19.8227 5.84375 20.375 5.84375C20.9273 5.84375 21.375 5.39603 21.375 4.84375H19.375ZM21.375 12.5312C21.375 11.979 20.9273 11.5312 20.375 11.5312C19.8227 11.5312 19.375 11.979 19.375 12.5312H21.375ZM19.1478 17.5231C18.9362 18.0333 19.1783 18.6183 19.6884 18.8299C20.1986 19.0414 20.7836 18.7994 20.9952 18.2892L19.1478 17.5231ZM18.2892 20.9952C18.7994 20.7836 19.0414 20.1986 18.8299 19.6884C18.6183 19.1783 18.0333 18.9362 17.5231 19.1478L18.2892 20.9952ZM12.5312 19.375C11.979 19.375 11.5312 19.8227 11.5312 20.375C11.5312 20.9273 11.979 21.375 12.5312 21.375V19.375ZM4.84375 21.375C5.39603 21.375 5.84375 20.9273 5.84375 20.375C5.84375 19.8227 5.39603 19.375 4.84375 19.375V21.375ZM0 22.9271C0 23.4794 0.447715 23.9271 1 23.9271C1.55228 23.9271 2 23.4794 2 22.9271H0ZM2 28.0312C2 27.479 1.55228 27.0312 1 27.0312C0.447715 27.0312 0 27.479 0 28.0312H2ZM0 33.1354C0 33.6877 0.447715 34.1354 1 34.1354C1.55228 34.1354 2 33.6877 2 33.1354H0ZM2 38.2396C2 37.6873 1.55228 37.2396 1 37.2396C0.447715 37.2396 0 37.6873 0 38.2396H2ZM0 43.3437C0 43.896 0.447715 44.3437 1 44.3437C1.55228 44.3437 2 43.896 2 43.3437H0ZM2 48.4479C2 47.8956 1.55228 47.4479 1 47.4479C0.447715 47.4479 0 47.8956 0 48.4479H2ZM0.247421 53.536C0.354602 54.0778 0.880693 54.4301 1.42248 54.3229C1.96426 54.2158 2.31658 53.6897 2.2094 53.1479L0.247421 53.536ZM3.85218 57.1111C3.54494 56.6521 2.92383 56.5292 2.4649 56.8364C2.00596 57.1437 1.883 57.7648 2.19025 58.2237L3.85218 57.1111ZM5.77629 61.8098C6.23523 62.117 6.85634 61.994 7.16358 61.5351C7.47083 61.0762 7.34786 60.4551 6.88893 60.1478L5.77629 61.8098ZM10.8521 61.7906C10.3103 61.6834 9.78425 62.0357 9.67707 62.5775C9.56989 63.1193 9.9222 63.6454 10.464 63.7526L10.8521 61.7906ZM16.1667 64C16.719 64 17.1667 63.5523 17.1667 63C17.1667 62.4477 16.719 62 16.1667 62V64ZM22.5 62C21.9477 62 21.5 62.4477 21.5 63C21.5 63.5523 21.9477 64 22.5 64V62ZM28.8333 64C29.3856 64 29.8333 63.5523 29.8333 63C29.8333 62.4477 29.3856 62 28.8333 62V64ZM35.1667 62C34.6144 62 34.1667 62.4477 34.1667 63C34.1667 63.5523 34.6144 64 35.1667 64V62ZM41.5 64C42.0523 64 42.5 63.5523 42.5 63C42.5 62.4477 42.0523 62 41.5 62V64ZM47.8333 62C47.2811 62 46.8333 62.4477 46.8333 63C46.8333 63.5523 47.2811 64 47.8333 64V62ZM53.536 63.7526C54.0778 63.6454 54.4301 63.1193 54.3229 62.5775C54.2158 62.0357 53.6897 61.6834 53.1479 61.7906L53.536 63.7526ZM57.1111 60.1478C56.6521 60.4551 56.5292 61.0762 56.8364 61.5351C57.1437 61.994 57.7648 62.117 58.2237 61.8098L57.1111 60.1478ZM61.8098 58.2237C62.117 57.7648 61.994 57.1437 61.5351 56.8364C61.0762 56.5292 60.4551 56.6521 60.1478 57.1111L61.8098 58.2237ZM61.7906 53.1479C61.6834 53.6897 62.0357 54.2158 62.5775 54.3229C63.1193 54.4301 63.6454 54.0778 63.7526 53.536L61.7906 53.1479ZM64 47.8333C64 47.281 63.5523 46.8333 63 46.8333C62.4477 46.8333 62 47.281 62 47.8333H64ZM62 41.5C62 42.0523 62.4477 42.5 63 42.5C63.5523 42.5 64 42.0523 64 41.5H62ZM64 35.1667C64 34.6144 63.5523 34.1667 63 34.1667C62.4477 34.1667 62 34.6144 62 35.1667H64ZM62 28.8333C62 29.3856 62.4477 29.8333 63 29.8333C63.5523 29.8333 64 29.3856 64 28.8333H62ZM64 22.5C64 21.9477 63.5523 21.5 63 21.5C62.4477 21.5 62 21.9477 62 22.5H64ZM62 16.1667C62 16.7189 62.4477 17.1667 63 17.1667C63.5523 17.1667 64 16.7189 64 16.1667H62ZM63.7526 10.464C63.6454 9.9222 63.1193 9.56989 62.5775 9.67707C62.0357 9.78425 61.6834 10.3103 61.7906 10.8521L63.7526 10.464ZM60.1478 6.88893C60.4551 7.34786 61.0762 7.47083 61.5351 7.16358C61.994 6.85633 62.117 6.23522 61.8098 5.77629L60.1478 6.88893ZM58.2237 2.19025C57.7648 1.883 57.1437 2.00596 56.8364 2.4649C56.5292 2.92383 56.6521 3.54494 57.1111 3.85218L58.2237 2.19025ZM53.1479 2.2094C53.6897 2.31658 54.2158 1.96426 54.3229 1.42248C54.4301 0.880693 54.0778 0.354602 53.536 0.247421L53.1479 2.2094ZM48.4479 0C47.8956 0 47.4479 0.447715 47.4479 1C47.4479 1.55228 47.8956 2 48.4479 2V0ZM43.3438 2C43.896 2 44.3438 1.55228 44.3438 1C44.3438 0.447715 43.896 0 43.3438 0V2ZM38.2396 0C37.6873 0 37.2396 0.447715 37.2396 1C37.2396 1.55228 37.6873 2 38.2396 2V0ZM33.1354 2C33.6877 2 34.1354 1.55228 34.1354 1C34.1354 0.447715 33.6877 0 33.1354 0V2ZM28.0313 0C27.479 0 27.0313 0.447715 27.0313 1C27.0313 1.55228 27.479 2 28.0313 2V0ZM22.9271 2C23.4794 2 23.9271 1.55228 23.9271 1C23.9271 0.447715 23.4794 0 22.9271 0V2ZM19.375 1V4.84375H21.375V1H19.375ZM19.375 12.5312V16.375H21.375V12.5312H19.375ZM19.375 16.375C19.375 16.7836 19.2939 17.1708 19.1478 17.5231L20.9952 18.2892C21.2403 17.6983 21.375 17.0511 21.375 16.375H19.375ZM17.5231 19.1478C17.1708 19.2939 16.7836 19.375 16.375 19.375V21.375C17.0511 21.375 17.6983 21.2403 18.2892 20.9952L17.5231 19.1478ZM16.375 19.375H12.5312V21.375H16.375V19.375ZM4.84375 19.375H1V21.375H4.84375V19.375ZM0 20.375V22.9271H2V20.375H0ZM0 28.0312V33.1354H2V28.0312H0ZM0 38.2396V43.3437H2V38.2396H0ZM0 48.4479V51H2V48.4479H0ZM0 51C0 51.8669 0.0849992 52.715 0.247421 53.536L2.2094 53.1479C2.07213 52.454 2 51.7359 2 51H0ZM2.19025 58.2237C3.13906 59.6409 4.35906 60.8609 5.77629 61.8098L6.88893 60.1478C5.68894 59.3444 4.65556 58.3111 3.85218 57.1111L2.19025 58.2237ZM10.464 63.7526C11.285 63.915 12.1331 64 13 64V62C12.2641 62 11.546 61.9279 10.8521 61.7906L10.464 63.7526ZM13 64H16.1667V62H13V64ZM22.5 64H28.8333V62H22.5V64ZM35.1667 64H41.5V62H35.1667V64ZM47.8333 64H51V62H47.8333V64ZM51 64C51.8669 64 52.715 63.915 53.536 63.7526L53.1479 61.7906C52.454 61.9279 51.7359 62 51 62V64ZM58.2237 61.8098C59.6409 60.8609 60.8609 59.6409 61.8098 58.2237L60.1478 57.1111C59.3444 58.3111 58.3111 59.3444 57.1111 60.1478L58.2237 61.8098ZM63.7526 53.536C63.915 52.715 64 51.8669 64 51H62C62 51.7359 61.9279 52.454 61.7906 53.1479L63.7526 53.536ZM64 51V47.8333H62V51H64ZM64 41.5V35.1667H62V41.5H64ZM64 28.8333V22.5H62V28.8333H64ZM64 16.1667V13H62V16.1667H64ZM64 13C64 12.1331 63.915 11.285 63.7526 10.464L61.7906 10.8521C61.9279 11.546 62 12.2641 62 13H64ZM61.8098 5.77629C60.8609 4.35905 59.6409 3.13906 58.2237 2.19025L57.1111 3.85218C58.3111 4.65556 59.3444 5.68893 60.1478 6.88893L61.8098 5.77629ZM53.536 0.247421C52.715 0.0849992 51.8669 0 51 0V2C51.7359 2 52.454 2.07213 53.1479 2.2094L53.536 0.247421ZM51 0H48.4479V2H51V0ZM43.3438 0H38.2396V2H43.3438V0ZM33.1354 0H28.0313V2H33.1354V0ZM22.9271 0H20.375V2H22.9271V0Z" fill="var(--wa-color-surface-border)"/>
+</svg>
diff --git a/docs/_includes/svgs/input.njk b/docs/_includes/svgs/input.njk
new file mode 100644
index 000000000..3fe254a7c
--- /dev/null
+++ b/docs/_includes/svgs/input.njk
@@ -0,0 +1,4 @@
+<svg width="112" height="40" viewBox="0 0 112 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 9H106C108.761 9 111 11.2386 111 14V34C111 36.7614 108.761 39 106 39H6C3.23857 39 1 36.7614 1 34V14C1 11.2386 3.23858 9 6 9Z" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<rect width="48" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/menu.njk b/docs/_includes/svgs/menu.njk
new file mode 100644
index 000000000..c98e2a729
--- /dev/null
+++ b/docs/_includes/svgs/menu.njk
@@ -0,0 +1,11 @@
+<svg width="64" height="72" viewBox="0 0 64 72" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 1H58C60.7614 1 63 3.23858 63 6V66C63 68.7614 60.7614 71 58 71H6C3.23858 71 1 68.7614 1 66V6C1 3.23858 3.23858 1 6 1Z" fill="var(--wa-color-surface-default)"/>
+<path d="M6 1H58C60.7614 1 63 3.23858 63 6V66C63 68.7614 60.7614 71 58 71H6C3.23858 71 1 68.7614 1 66V6C1 3.23858 3.23858 1 6 1Z" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M17 16L19.7344 13.2656C20.3008 12.6992 21.1797 12.6992 21.7461 13.2656C21.8828 13.4023 21.8828 13.6172 21.7461 13.7539L16.2188 19.2812C16.3164 19.5352 16.375 19.7891 16.375 20.0625C16.375 21.2734 15.3789 22.25 14.1875 22.25C12.9766 22.25 12 21.2734 12 20.0625C12 18.8711 12.9766 17.875 14.1875 17.875C14.4609 17.875 14.7148 17.9336 14.9688 18.0312L15.75 17.25L14.9688 16.4883C14.7148 16.5859 14.4609 16.625 14.1875 16.625C12.9766 16.625 12 15.6484 12 14.4375C12 13.2461 12.9766 12.25 14.1875 12.25C15.3789 12.25 16.375 13.2461 16.375 14.4375C16.375 14.7305 16.3164 14.9844 16.2188 15.2383L17 16ZM17.4297 18.9492L18.6797 17.6992L21.7461 20.7656C21.8828 20.9023 21.8828 21.1172 21.7461 21.2539C21.1797 21.8203 20.3008 21.8203 19.7344 21.2539L17.4297 18.9492ZM13.25 14.4375C13.25 14.7891 13.4258 15.082 13.7188 15.2578C13.9922 15.4336 14.3633 15.4336 14.6562 15.2578C14.9297 15.082 15.125 14.7891 15.125 14.4375C15.125 14.1055 14.9297 13.8125 14.6562 13.6367C14.3633 13.4609 13.9922 13.4609 13.7188 13.6367C13.4258 13.8125 13.25 14.1055 13.25 14.4375ZM14.1875 19.125C13.8359 19.125 13.543 19.3203 13.3672 19.5938C13.1914 19.8867 13.1914 20.2578 13.3672 20.5312C13.543 20.8242 13.8359 21 14.1875 21C14.5195 21 14.8125 20.8242 14.9883 20.5312C15.1641 20.2578 15.1641 19.8867 14.9883 19.5938C14.8125 19.3203 14.5195 19.125 14.1875 19.125Z" fill="var(--wa-color-neutral-border-loud)"/>
+<rect x="28" y="15" width="24" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M17.625 34V32.75H18.875V34C18.875 34.7031 18.3086 35.25 17.625 35.25H13.25C12.5469 35.25 12 34.7031 12 34V29.625C12 28.9414 12.5469 28.375 13.25 28.375H14.5V29.625H13.25V34H17.625ZM16.375 32.125C15.6719 32.125 15.125 31.5781 15.125 30.875V26.5C15.125 25.8164 15.6719 25.25 16.375 25.25H20.75C21.4336 25.25 22 25.8164 22 26.5V30.875C22 31.5781 21.4336 32.125 20.75 32.125H16.375Z" fill="var(--wa-color-neutral-border-loud)"/>
+<rect x="28" y="28" width="24" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<line y1="42" x2="64" y2="42" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M14.6367 51.6016C14.7344 51.3867 14.9492 51.25 15.1836 51.25H17.5469C17.7812 51.25 17.9961 51.3867 18.0938 51.6016L18.25 51.875H20.125C20.457 51.875 20.75 52.168 20.75 52.5C20.75 52.8516 20.457 53.125 20.125 53.125H12.625C12.2734 53.125 12 52.8516 12 52.5C12 52.168 12.2734 51.875 12.625 51.875H14.5L14.6367 51.6016ZM20.125 53.75L19.6953 60.3711C19.6758 60.8789 19.2656 61.25 18.7578 61.25H13.9727C13.4648 61.25 13.0547 60.8789 13.0352 60.3711L12.625 53.75H20.125Z" fill="var(--wa-color-red-60)"/>
+<rect x="28" y="54" width="24" height="4" rx="2" fill="var(--wa-color-red-60)"/>
+</svg>
diff --git a/docs/_includes/svgs/mutation-observer.njk b/docs/_includes/svgs/mutation-observer.njk
new file mode 100644
index 000000000..6fb65809b
--- /dev/null
+++ b/docs/_includes/svgs/mutation-observer.njk
@@ -0,0 +1,5 @@
+<svg width="117" height="14" viewBox="0 0 117 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1.71362 3.57143C1.71362 2.15179 2.8654 1 4.28504 1H5.14219C5.61629 1 5.99933 1.38304 5.99933 1.85714C5.99933 2.33125 5.61629 2.71429 5.14219 2.71429H4.28504C3.81094 2.71429 3.4279 3.09732 3.4279 3.57143V4.57589C3.4279 5.25893 3.15737 5.9125 2.67522 6.39464L2.06987 7L2.67522 7.60536C3.15737 8.0875 3.4279 8.74107 3.4279 9.42411V10.4286C3.4279 10.9027 3.81094 11.2857 4.28504 11.2857H5.14219C5.61629 11.2857 5.99933 11.6688 5.99933 12.1429C5.99933 12.617 5.61629 13 5.14219 13H4.28504C2.8654 13 1.71362 11.8482 1.71362 10.4286V9.42411C1.71362 9.19643 1.62254 8.97946 1.46183 8.81875L0.251116 7.60536C-0.0837054 7.27054 -0.0837054 6.72679 0.251116 6.39196L1.46451 5.17857C1.62522 5.01786 1.71629 4.80089 1.71629 4.57321V3.57143H1.71362Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<path d="M11.8909 4.73633V5.10449C12.1025 4.89714 12.2929 4.75537 12.4622 4.6792C12.6357 4.5988 12.8346 4.55859 13.0589 4.55859C13.2493 4.55859 13.4376 4.60514 13.6238 4.69824C13.81 4.79134 13.992 4.93099 14.1697 5.11719C14.394 4.93099 14.6204 4.79346 14.8489 4.70459C15.0817 4.61149 15.3187 4.56494 15.5599 4.56494C16.0423 4.56494 16.4337 4.69401 16.7342 4.95215C17.132 5.29069 17.3309 5.73503 17.3309 6.28516V9.19873C17.6017 9.19873 17.8027 9.26009 17.9339 9.38281C18.0651 9.50553 18.1307 9.66211 18.1307 9.85254C18.1307 10.043 18.0651 10.1995 17.9339 10.3223C17.8027 10.4408 17.5805 10.5 17.2674 10.5H16.0296V6.39307C16.0296 6.19417 15.9936 6.05664 15.9217 5.98047C15.8498 5.9043 15.7397 5.86621 15.5916 5.86621C15.4477 5.86621 15.3144 5.9043 15.1917 5.98047C15.0351 6.08626 14.8447 6.28516 14.6204 6.57715V9.19873C14.8913 9.19873 15.0923 9.26009 15.2234 9.38281C15.3546 9.50553 15.4202 9.66211 15.4202 9.85254C15.4202 10.043 15.3546 10.1995 15.2234 10.3223C15.0923 10.4408 14.8701 10.5 14.5569 10.5H13.3192V6.39307C13.3192 6.1984 13.2811 6.06299 13.2049 5.98682C13.133 5.90641 13.0229 5.86621 12.8748 5.86621C12.7225 5.86621 12.5722 5.91488 12.4241 6.01221C12.276 6.10531 12.0983 6.29362 11.8909 6.57715V9.19873C12.1618 9.19873 12.3628 9.26009 12.494 9.38281C12.6294 9.50553 12.6971 9.66211 12.6971 9.85254C12.6971 10.043 12.6294 10.1995 12.494 10.3223C12.3628 10.4408 12.1406 10.5 11.8275 10.5H10.6531C10.34 10.5 10.1178 10.4408 9.98663 10.3223C9.85122 10.1995 9.78351 10.0409 9.78351 9.84619C9.78351 9.65576 9.8491 9.5013 9.98029 9.38281C10.1115 9.26009 10.3146 9.19873 10.5897 9.19873V6.0376C10.3146 6.0376 10.1115 5.97624 9.98029 5.85352C9.8491 5.73079 9.78351 5.57422 9.78351 5.38379C9.78351 5.19336 9.85122 5.0389 9.98663 4.92041C10.1178 4.79769 10.34 4.73633 10.6531 4.73633H11.8909ZM24.732 4.73633V9.19873C25.0071 9.19873 25.2102 9.26009 25.3414 9.38281C25.4725 9.50553 25.5381 9.66211 25.5381 9.85254C25.5381 10.043 25.4704 10.1995 25.335 10.3223C25.2038 10.4408 24.9817 10.5 24.6685 10.5H23.4307V10.2017C23.0583 10.3709 22.7029 10.4979 22.3643 10.5825C22.0258 10.6672 21.7042 10.7095 21.3995 10.7095C20.9721 10.7095 20.6018 10.6206 20.2886 10.4429C19.9755 10.2609 19.7279 10.0112 19.5459 9.69385C19.4148 9.46533 19.3492 9.17969 19.3492 8.83691V6.0376H19.127C18.8139 6.0376 18.5896 5.97835 18.4542 5.85986C18.323 5.73714 18.2574 5.57845 18.2574 5.38379C18.2574 5.19336 18.323 5.0389 18.4542 4.92041C18.5896 4.79769 18.8139 4.73633 19.127 4.73633H20.6504V8.6084C20.6504 8.88346 20.716 9.08659 20.8472 9.21777C20.9826 9.34473 21.1879 9.4082 21.4629 9.4082C21.7253 9.4082 22.0067 9.35742 22.3072 9.25586C22.6119 9.15007 22.9864 8.96175 23.4307 8.69092V6.0376H22.961C22.6478 6.0376 22.4236 5.97835 22.2881 5.85986C22.157 5.73714 22.0914 5.57845 22.0914 5.38379C22.0914 5.19336 22.157 5.0389 22.2881 4.92041C22.4236 4.79769 22.6478 4.73633 22.961 4.73633H24.732ZM29.7146 6.0376V8.64648C29.7146 8.92578 29.7718 9.10986 29.886 9.19873C30.0638 9.33838 30.3811 9.4082 30.8382 9.4082C31.5026 9.4082 32.1162 9.26644 32.679 8.98291C32.8948 8.87288 33.0641 8.81787 33.1868 8.81787C33.3561 8.81787 33.5021 8.88135 33.6248 9.0083C33.7518 9.13525 33.8152 9.28971 33.8152 9.47168C33.8152 9.64095 33.7475 9.78695 33.6121 9.90967C33.4047 10.1086 32.9943 10.2926 32.3807 10.4619C31.7713 10.627 31.2571 10.7095 30.8382 10.7095C30.0299 10.7095 29.4226 10.536 29.0164 10.189C28.6144 9.83773 28.4134 9.4082 28.4134 8.90039V6.0376H27.9436C27.6305 6.0376 27.4062 5.97835 27.2708 5.85986C27.1396 5.73714 27.074 5.57845 27.074 5.38379C27.074 5.19336 27.1396 5.0389 27.2708 4.92041C27.4062 4.79769 27.6305 4.73633 27.9436 4.73633H28.4134V3.56201C28.4134 3.24886 28.4726 3.02669 28.5911 2.89551C28.7138 2.76009 28.8725 2.69238 29.0672 2.69238C29.2576 2.69238 29.4121 2.76009 29.5306 2.89551C29.6533 3.02669 29.7146 3.24886 29.7146 3.56201V4.73633H32.1204C32.4336 4.73633 32.6557 4.79769 32.7869 4.92041C32.9223 5.0389 32.99 5.19548 32.99 5.39014C32.99 5.58057 32.9223 5.73714 32.7869 5.85986C32.6557 5.97835 32.4336 6.0376 32.1204 6.0376H29.7146ZM39.274 10.5V10.1953C38.9481 10.3688 38.5884 10.4979 38.1949 10.5825C37.8013 10.6714 37.4437 10.7158 37.1221 10.7158C36.4239 10.7158 35.8568 10.5317 35.4209 10.1636C34.9851 9.79118 34.7671 9.3807 34.7671 8.93213C34.7671 8.38623 35.0443 7.88053 35.5987 7.41504C36.1573 6.94531 36.9274 6.71045 37.9092 6.71045C38.3028 6.71045 38.7577 6.75277 39.274 6.8374V6.52637C39.274 6.33171 39.1893 6.17301 39.0201 6.05029C38.855 5.92757 38.5376 5.86621 38.0679 5.86621C37.6828 5.86621 37.1835 5.94238 36.5699 6.09473C36.3413 6.14974 36.1636 6.17725 36.0367 6.17725C35.8632 6.17725 35.715 6.11589 35.5923 5.99316C35.4738 5.86621 35.4146 5.7054 35.4146 5.51074C35.4146 5.40072 35.4357 5.3055 35.4781 5.2251C35.5204 5.14469 35.5796 5.08122 35.6558 5.03467C35.732 4.98389 35.8907 4.92464 36.1319 4.85693C36.4535 4.76807 36.7814 4.69824 37.1158 4.64746C37.4501 4.59245 37.7526 4.56494 38.0235 4.56494C38.8317 4.56494 39.458 4.74056 39.9024 5.0918C40.3509 5.4388 40.5752 5.91488 40.5752 6.52002V9.19873H40.7974C41.1105 9.19873 41.3327 9.26009 41.4639 9.38281C41.5993 9.5013 41.667 9.65788 41.667 9.85254C41.667 10.043 41.5993 10.1995 41.4639 10.3223C41.3327 10.4408 41.1105 10.5 40.7974 10.5H39.274ZM39.274 8.17041C38.7535 8.06885 38.2731 8.01807 37.833 8.01807C37.3041 8.01807 36.8492 8.14714 36.4683 8.40527C36.2313 8.57031 36.1128 8.73747 36.1128 8.90674C36.1128 9.02946 36.17 9.12891 36.2842 9.20508C36.4958 9.34473 36.7857 9.41455 37.1538 9.41455C37.467 9.41455 37.8203 9.35319 38.2139 9.23047C38.6117 9.10775 38.965 8.94059 39.274 8.729V8.17041ZM45.8499 6.0376V8.64648C45.8499 8.92578 45.907 9.10986 46.0213 9.19873C46.199 9.33838 46.5164 9.4082 46.9734 9.4082C47.6378 9.4082 48.2514 9.26644 48.8142 8.98291C49.0301 8.87288 49.1993 8.81787 49.322 8.81787C49.4913 8.81787 49.6373 8.88135 49.76 9.0083C49.887 9.13525 49.9505 9.28971 49.9505 9.47168C49.9505 9.64095 49.8828 9.78695 49.7473 9.90967C49.54 10.1086 49.1295 10.2926 48.5159 10.4619C47.9065 10.627 47.3924 10.7095 46.9734 10.7095C46.1651 10.7095 45.5579 10.536 45.1516 10.189C44.7496 9.83773 44.5486 9.4082 44.5486 8.90039V6.0376H44.0789C43.7657 6.0376 43.5414 5.97835 43.406 5.85986C43.2748 5.73714 43.2093 5.57845 43.2093 5.38379C43.2093 5.19336 43.2748 5.0389 43.406 4.92041C43.5414 4.79769 43.7657 4.73633 44.0789 4.73633H44.5486V3.56201C44.5486 3.24886 44.6079 3.02669 44.7263 2.89551C44.8491 2.76009 45.0078 2.69238 45.2024 2.69238C45.3928 2.69238 45.5473 2.76009 45.6658 2.89551C45.7885 3.02669 45.8499 3.24886 45.8499 3.56201V4.73633H48.2556C48.5688 4.73633 48.791 4.79769 48.9221 4.92041C49.0576 5.0389 49.1253 5.19548 49.1253 5.39014C49.1253 5.58057 49.0576 5.73714 48.9221 5.85986C48.791 5.97835 48.5688 6.0376 48.2556 6.0376H45.8499ZM54.7046 2.26709V3.64453H53.1558V2.26709H54.7046ZM54.8823 4.73633V9.19873H56.4439C56.757 9.19873 56.9792 9.26009 57.1104 9.38281C57.2458 9.5013 57.3135 9.65788 57.3135 9.85254C57.3135 10.043 57.2458 10.1995 57.1104 10.3223C56.9792 10.4408 56.757 10.5 56.4439 10.5H52.0195C51.7064 10.5 51.4821 10.4408 51.3467 10.3223C51.2155 10.1995 51.1499 10.0409 51.1499 9.84619C51.1499 9.65576 51.2155 9.5013 51.3467 9.38281C51.4821 9.26009 51.7064 9.19873 52.0195 9.19873H53.5811V6.0376H52.5337C52.2248 6.0376 52.0026 5.97835 51.8672 5.85986C51.7318 5.73714 51.6641 5.57845 51.6641 5.38379C51.6641 5.19336 51.7297 5.0389 51.8609 4.92041C51.9963 4.79769 52.2206 4.73633 52.5337 4.73633H54.8823ZM65.6858 7.72607C65.6858 8.22542 65.5461 8.70996 65.2668 9.17969C64.9918 9.64518 64.5792 10.0176 64.0291 10.2969C63.4832 10.5719 62.9119 10.7095 62.3152 10.7095C61.7227 10.7095 61.1557 10.5741 60.614 10.3032C60.0724 10.0282 59.6598 9.65576 59.3762 9.18604C59.0927 8.71631 58.9509 8.22542 58.9509 7.71338C58.9509 7.19287 59.0948 6.68294 59.3826 6.18359C59.6703 5.68001 60.0829 5.28434 60.6204 4.99658C61.162 4.70882 61.727 4.56494 62.3152 4.56494C62.9076 4.56494 63.4768 4.71305 64.0227 5.00928C64.5728 5.30127 64.9876 5.69694 65.2668 6.19629C65.5461 6.69141 65.6858 7.20133 65.6858 7.72607ZM64.3845 7.73242C64.3845 7.31348 64.2343 6.92839 63.9338 6.57715C63.5234 6.10319 62.9838 5.86621 62.3152 5.86621C61.727 5.86621 61.2361 6.05452 60.8425 6.43115C60.449 6.80778 60.2522 7.24365 60.2522 7.73877C60.2522 8.14502 60.4511 8.52588 60.8489 8.88135C61.2467 9.23258 61.7354 9.4082 62.3152 9.4082C62.8992 9.4082 63.3901 9.23258 63.7878 8.88135C64.1856 8.52588 64.3845 8.1429 64.3845 7.73242ZM69.0561 4.73633V5.17432C69.2931 4.97119 69.5534 4.81885 69.8369 4.71729C70.1247 4.61572 70.4357 4.56494 70.77 4.56494C71.5402 4.56494 72.1496 4.80404 72.5981 5.28223C72.9536 5.66309 73.1313 6.16243 73.1313 6.78027V9.19873C73.4064 9.19873 73.6095 9.26009 73.7407 9.38281C73.8719 9.5013 73.9375 9.65788 73.9375 9.85254C73.9375 10.043 73.8698 10.1995 73.7344 10.3223C73.6032 10.4408 73.381 10.5 73.0679 10.5H71.8935C71.5804 10.5 71.3561 10.4408 71.2207 10.3223C71.0895 10.1995 71.0239 10.0409 71.0239 9.84619C71.0239 9.65576 71.0895 9.5013 71.2207 9.38281C71.3519 9.26009 71.555 9.19873 71.8301 9.19873V6.74219C71.8301 6.45866 71.7539 6.2513 71.6016 6.12012C71.4027 5.95085 71.1043 5.86621 70.7065 5.86621C70.4061 5.86621 70.1416 5.92546 69.9131 6.04395C69.6888 6.1582 69.4031 6.40365 69.0561 6.78027V9.19873C69.3905 9.19873 69.6063 9.23047 69.7036 9.29395C69.911 9.4209 70.0146 9.6071 70.0146 9.85254C70.0146 10.043 69.9469 10.1995 69.8115 10.3223C69.6803 10.4408 69.4582 10.5 69.145 10.5H67.666C67.3529 10.5 67.1286 10.4408 66.9932 10.3223C66.862 10.1995 66.7964 10.0409 66.7964 9.84619C66.7964 9.60921 66.8979 9.42513 67.1011 9.29395C67.2026 9.23047 67.4206 9.19873 67.7549 9.19873V6.0376C67.4798 6.0376 67.2767 5.97624 67.1455 5.85352C67.0143 5.73079 66.9487 5.57422 66.9487 5.38379C66.9487 5.19336 67.0143 5.0389 67.1455 4.92041C67.2809 4.79769 67.5052 4.73633 67.8184 4.73633H69.0561ZM77.8982 4.10791V9.19873H80.7038V7.96729C80.7038 7.65413 80.7631 7.43197 80.8816 7.30078C81.0043 7.16536 81.163 7.09766 81.3577 7.09766C81.5481 7.09766 81.7025 7.16536 81.821 7.30078C81.9438 7.43197 82.0051 7.65413 82.0051 7.96729V10.5H75.8415C75.5284 10.5 75.3041 10.4408 75.1687 10.3223C75.0375 10.1995 74.9719 10.0409 74.9719 9.84619C74.9719 9.65576 75.0375 9.5013 75.1687 9.38281C75.3041 9.26009 75.5284 9.19873 75.8415 9.19873H76.5969V4.10791H75.8415C75.5284 4.10791 75.3041 4.04867 75.1687 3.93018C75.0375 3.80745 74.9719 3.64876 74.9719 3.4541C74.9719 3.25944 75.0375 3.10286 75.1687 2.98438C75.3041 2.86165 75.5284 2.80029 75.8415 2.80029L78.6599 2.80664C78.973 2.80664 79.1952 2.86589 79.3264 2.98438C79.4618 3.10286 79.5295 3.25944 79.5295 3.4541C79.5295 3.64876 79.4618 3.80745 79.3264 3.93018C79.1952 4.04867 78.973 4.10791 78.6599 4.10791H77.8982ZM86.9751 2.26709V3.64453H85.4262V2.26709H86.9751ZM87.1528 4.73633V9.19873H88.7143C89.0275 9.19873 89.2496 9.26009 89.3808 9.38281C89.5162 9.5013 89.584 9.65788 89.584 9.85254C89.584 10.043 89.5162 10.1995 89.3808 10.3223C89.2496 10.4408 89.0275 10.5 88.7143 10.5H84.29C83.9769 10.5 83.7526 10.4408 83.6172 10.3223C83.486 10.1995 83.4204 10.0409 83.4204 9.84619C83.4204 9.65576 83.486 9.5013 83.6172 9.38281C83.7526 9.26009 83.9769 9.19873 84.29 9.19873H85.8515V6.0376H84.8042C84.4952 6.0376 84.2731 5.97835 84.1377 5.85986C84.0022 5.73714 83.9345 5.57845 83.9345 5.38379C83.9345 5.19336 84.0001 5.0389 84.1313 4.92041C84.2667 4.79769 84.491 4.73633 84.8042 4.73633H87.1528ZM95.9821 6.25977C95.7706 6.12858 95.5484 6.03125 95.3156 5.96777C95.0829 5.90007 94.8396 5.86621 94.5857 5.86621C94.0821 5.86621 93.6822 5.94873 93.3859 6.11377C93.2548 6.18571 93.1892 6.264 93.1892 6.34863C93.1892 6.44596 93.278 6.54118 93.4558 6.63428C93.5912 6.70199 93.8938 6.76758 94.3635 6.83105C95.2268 6.94954 95.8277 7.06803 96.1662 7.18652C96.6106 7.3431 96.9533 7.57585 97.1945 7.88477C97.4358 8.19368 97.5564 8.51953 97.5564 8.8623C97.5564 9.3278 97.3511 9.71712 96.9406 10.0303C96.3524 10.4831 95.5886 10.7095 94.6491 10.7095C94.2725 10.7095 93.9234 10.6756 93.6018 10.6079C93.2844 10.5444 92.9924 10.4492 92.7258 10.3223C92.6623 10.3773 92.5946 10.4196 92.5227 10.4492C92.4507 10.4788 92.3767 10.4937 92.3005 10.4937C92.0974 10.4937 91.9345 10.4281 91.8117 10.2969C91.6932 10.1615 91.634 9.93717 91.634 9.62402V9.18604C91.634 8.87288 91.6932 8.65072 91.8117 8.51953C91.9345 8.38411 92.0931 8.31641 92.2878 8.31641C92.4444 8.31641 92.5756 8.36084 92.6814 8.44971C92.7872 8.53434 92.8697 8.68245 92.9289 8.89404C93.1278 9.06331 93.3669 9.19238 93.6462 9.28125C93.9255 9.36589 94.2471 9.4082 94.611 9.4082C95.2077 9.4082 95.6711 9.3151 96.0012 9.12891C96.1578 9.03581 96.236 8.93848 96.236 8.83691C96.236 8.66764 96.1239 8.52799 95.8996 8.41797C95.6753 8.30794 95.212 8.21484 94.5095 8.13867C93.4642 8.02865 92.766 7.81706 92.4148 7.50391C92.0635 7.19499 91.8879 6.81413 91.8879 6.36133C91.8879 5.89583 92.0847 5.50863 92.4782 5.19971C93.0114 4.77653 93.7097 4.56494 94.573 4.56494C94.8734 4.56494 95.1612 4.59456 95.4362 4.65381C95.7155 4.70882 95.9821 4.79557 96.236 4.91406C96.3164 4.85482 96.3905 4.81038 96.4582 4.78076C96.5302 4.75114 96.5957 4.73633 96.655 4.73633C96.8327 4.73633 96.9808 4.80404 97.0993 4.93945C97.2178 5.07064 97.2771 5.29281 97.2771 5.60596V5.92334C97.2771 6.20687 97.2432 6.39941 97.1755 6.50098C97.0401 6.69564 96.856 6.79297 96.6233 6.79297C96.4667 6.79297 96.3291 6.7443 96.2107 6.64697C96.0922 6.54964 96.016 6.42057 95.9821 6.25977ZM102.323 6.0376V8.64648C102.323 8.92578 102.38 9.10986 102.495 9.19873C102.672 9.33838 102.99 9.4082 103.447 9.4082C104.111 9.4082 104.725 9.26644 105.288 8.98291C105.503 8.87288 105.673 8.81787 105.795 8.81787C105.965 8.81787 106.111 8.88135 106.233 9.0083C106.36 9.13525 106.424 9.28971 106.424 9.47168C106.424 9.64095 106.356 9.78695 106.221 9.90967C106.013 10.1086 105.603 10.2926 104.989 10.4619C104.38 10.627 103.866 10.7095 103.447 10.7095C102.638 10.7095 102.031 10.536 101.625 10.189C101.223 9.83773 101.022 9.4082 101.022 8.90039V6.0376H100.552C100.239 6.0376 100.015 5.97835 99.8793 5.85986C99.7482 5.73714 99.6826 5.57845 99.6826 5.38379C99.6826 5.19336 99.7482 5.0389 99.8793 4.92041C100.015 4.79769 100.239 4.73633 100.552 4.73633H101.022V3.56201C101.022 3.24886 101.081 3.02669 101.2 2.89551C101.322 2.76009 101.481 2.69238 101.676 2.69238C101.866 2.69238 102.021 2.76009 102.139 2.89551C102.262 3.02669 102.323 3.24886 102.323 3.56201V4.73633H104.729C105.042 4.73633 105.264 4.79769 105.395 4.92041C105.531 5.0389 105.599 5.19548 105.599 5.39014C105.599 5.58057 105.531 5.73714 105.395 5.85986C105.264 5.97835 105.042 6.0376 104.729 6.0376H102.323Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M115.285 10.4286C115.285 11.8482 114.133 13 112.714 13L111.856 13C111.382 13 110.999 12.617 110.999 12.1429C110.999 11.6687 111.382 11.2857 111.856 11.2857L112.714 11.2857C113.188 11.2857 113.571 10.9027 113.571 10.4286L113.571 9.42411C113.571 8.74107 113.841 8.0875 114.323 7.60536L114.929 7L114.323 6.39464C113.841 5.9125 113.571 5.25893 113.571 4.57589L113.571 3.57143C113.571 3.09732 113.188 2.71429 112.714 2.71429L111.856 2.71429C111.382 2.71429 110.999 2.33125 110.999 1.85714C110.999 1.38304 111.382 0.999999 111.856 0.999999L112.714 1C114.133 1 115.285 2.15179 115.285 3.57143L115.285 4.57589C115.285 4.80357 115.376 5.02054 115.537 5.18125L116.748 6.39464C117.082 6.72946 117.082 7.27321 116.748 7.60804L115.534 8.82143C115.373 8.98214 115.282 9.19911 115.282 9.42679L115.282 10.4286L115.285 10.4286Z" fill="var(--wa-color-neutral-on-quiet)"/>
+</svg>
diff --git a/docs/_includes/svgs/popup.njk b/docs/_includes/svgs/popup.njk
new file mode 100644
index 000000000..cb9aafed0
--- /dev/null
+++ b/docs/_includes/svgs/popup.njk
@@ -0,0 +1,4 @@
+<svg width="66" height="65" viewBox="0 0 66 65" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1 40C1 36.6863 3.68629 34 7 34H59C62.3137 34 65 36.6863 65 40V58C65 61.3137 62.3137 64 59 64H7C3.68629 64 1 61.3137 1 58V40Z" fill="none" stroke="var(--wa-color-surface-border)" stroke-width="2" stroke-linecap="round" stroke-dasharray="6 6"/>
+<path d="M1 6C1 2.68629 3.68629 0 7 0H59C62.3137 0 65 2.68629 65 6V26C65 29.3137 62.3137 32 59 32H7C3.68629 32 1 29.3137 1 26V6Z" fill="var(--wa-color-neutral-border-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/progress-bar.njk b/docs/_includes/svgs/progress-bar.njk
new file mode 100644
index 000000000..748d31919
--- /dev/null
+++ b/docs/_includes/svgs/progress-bar.njk
@@ -0,0 +1,4 @@
+<svg width="96" height="12" viewBox="0 0 96 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="96" height="12" rx="6" fill="var(--wa-color-neutral-fill-normal)"/>
+<path d="M0 6C0 2.68629 2.68629 0 6 0H64V12H6C2.68629 12 0 9.31371 0 6V6Z" fill="var(--wa-color-brand-fill-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/progress-ring.njk b/docs/_includes/svgs/progress-ring.njk
new file mode 100644
index 000000000..8587b2680
--- /dev/null
+++ b/docs/_includes/svgs/progress-ring.njk
@@ -0,0 +1,4 @@
+<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="22" cy="22" r="22" transform="matrix(-1 0 0 1 46 2)" stroke="var(--wa-color-neutral-fill-normal)" stroke-width="4"/>
+<path d="M2.7549 18.3074C-0.389035 30.0407 6.57405 42.1012 18.3074 45.2451C30.0407 48.389 42.1012 41.4259 45.2451 29.6926C48.389 17.9593 41.4259 5.89884 29.6926 2.7549C27.7905 2.24524 25.8799 2.00119 24 2" stroke="var(--wa-color-brand-fill-loud)" stroke-width="4" stroke-linecap="round"/>
+</svg>
diff --git a/docs/_includes/svgs/qr-code.njk b/docs/_includes/svgs/qr-code.njk
new file mode 100644
index 000000000..788acb48b
--- /dev/null
+++ b/docs/_includes/svgs/qr-code.njk
@@ -0,0 +1,12 @@
+<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="27.5" y="1.5" width="19" height="19" rx="6" stroke="var(--wa-color-neutral-border-loud)" stroke-width="3"/>
+<rect x="1.5" y="1.5" width="19" height="19" rx="6" stroke="var(--wa-color-neutral-border-loud)" stroke-width="3"/>
+<rect x="1.5" y="27.5" width="19" height="19" rx="6" stroke="var(--wa-color-neutral-border-loud)" stroke-width="3"/>
+<rect x="33" y="7" width="8" height="8" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<rect x="7" y="7" width="8" height="8" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<rect x="7" y="33" width="8" height="8" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M26 28C26 26.8954 26.8954 26 28 26H34V34H26V28Z" fill="var(--wa-color-neutral-border-normal)"/>
+<path d="M34 26H40C41.1046 26 42 26.8954 42 28V32C42 33.1046 41.1046 34 40 34H34V26Z" fill="var(--wa-color-neutral-border-normal)"/>
+<path d="M26 34H34V40C34 41.1046 33.1046 42 32 42H28C26.8954 42 26 41.1046 26 40V34Z" fill="var(--wa-color-neutral-border-normal)"/>
+<rect x="38" y="38" width="8" height="8" rx="2" fill="var(--wa-color-neutral-border-normal)"/>
+</svg>
diff --git a/docs/_includes/svgs/radio-group.njk b/docs/_includes/svgs/radio-group.njk
new file mode 100644
index 000000000..f9a5861ff
--- /dev/null
+++ b/docs/_includes/svgs/radio-group.njk
@@ -0,0 +1,7 @@
+<svg width="56" height="36" viewBox="0 0 56 36" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="24" y="6" width="32" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<rect x="24" y="26" width="32" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<circle cx="8" cy="8" r="7" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<circle cx="8" cy="28" r="7" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-brand-fill-loud)" stroke-width="2"/>
+<circle cx="8" cy="28" r="4" fill="var(--wa-color-brand-fill-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/range.njk b/docs/_includes/svgs/range.njk
new file mode 100644
index 000000000..0b1536b16
--- /dev/null
+++ b/docs/_includes/svgs/range.njk
@@ -0,0 +1,4 @@
+<svg width="96" height="20" viewBox="0 0 96 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect y="6" width="96" height="8" rx="4" fill="var(--wa-color-neutral-fill-normal)"/>
+<rect x="61" y="1" width="18" height="18" rx="9" fill="var(--wa-color-brand-fill-loud)" stroke="var(--wa-color-surface-default)" stroke-width="2"/>
+</svg>
diff --git a/docs/_includes/svgs/rating.njk b/docs/_includes/svgs/rating.njk
new file mode 100644
index 000000000..c5fa7e7b5
--- /dev/null
+++ b/docs/_includes/svgs/rating.njk
@@ -0,0 +1,7 @@
+<svg width="99" height="16" viewBox="0 0 99 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.12156 0.562016L11.1511 4.71469L15.616 5.37038C15.9907 5.43283 16.3029 5.68261 16.4278 6.05729C16.5527 6.40074 16.459 6.80664 16.178 7.05643L12.9308 10.2724L13.7114 14.831C13.7738 15.2057 13.6177 15.5803 13.3055 15.7989C12.9932 16.0487 12.5873 16.0487 12.2439 15.8926L8.24731 13.7382L4.21953 15.8926C3.9073 16.0487 3.5014 16.0487 3.18917 15.7989C2.87694 15.5803 2.72082 15.2057 2.78327 14.831L3.53262 10.2724L0.285415 7.05643C0.0356298 6.80664 -0.0580396 6.40074 0.0356298 6.05729C0.160522 5.68261 0.472754 5.43283 0.847431 5.37038L5.34356 4.71469L7.34184 0.562016C7.49796 0.218562 7.84141 0 8.24731 0C8.62199 0 8.96545 0.218562 9.12156 0.562016Z" fill="var(--wa-color-yellow-70)"/>
+<path d="M29.6036 0.562016L31.6331 4.71469L36.098 5.37038C36.4727 5.43283 36.7849 5.68261 36.9098 6.05729C37.0347 6.40074 36.9411 6.80664 36.66 7.05643L33.4128 10.2724L34.1934 14.831C34.2559 15.2057 34.0998 15.5803 33.7875 15.7989C33.4753 16.0487 33.0694 16.0487 32.7259 15.8926L28.7294 13.7382L24.7016 15.8926C24.3894 16.0487 23.9835 16.0487 23.6712 15.7989C23.359 15.5803 23.2029 15.2057 23.2653 14.831L24.0147 10.2724L20.7675 7.05643C20.5177 6.80664 20.424 6.40074 20.5177 6.05729C20.6426 5.68261 20.9548 5.43283 21.3295 5.37038L25.8256 4.71469L27.8239 0.562016C27.98 0.218562 28.3235 0 28.7294 0C29.104 0 29.4475 0.218562 29.6036 0.562016Z" fill="var(--wa-color-yellow-70)"/>
+<path d="M50.0857 0.562016L52.1152 4.71469L56.5801 5.37038C56.9548 5.43283 57.267 5.68261 57.3919 6.05729C57.5168 6.40074 57.4231 6.80664 57.1421 7.05643L53.8949 10.2724L54.6755 14.831C54.7379 15.2057 54.5818 15.5803 54.2696 15.7989C53.9573 16.0487 53.5514 16.0487 53.208 15.8926L49.2114 13.7382L45.1836 15.8926C44.8714 16.0487 44.4655 16.0487 44.1533 15.7989C43.841 15.5803 43.6849 15.2057 43.7474 14.831L44.4967 10.2724L41.2495 7.05643C40.9997 6.80664 40.9061 6.40074 40.9997 6.05729C41.1246 5.68261 41.4369 5.43283 41.8115 5.37038L46.3077 4.71469L48.306 0.562016C48.4621 0.218562 48.8055 0 49.2114 0C49.5861 0 49.9296 0.218562 50.0857 0.562016Z" fill="var(--wa-color-yellow-70)"/>
+<path d="M70.5677 0.562016L72.5972 4.71469L77.0621 5.37038C77.4368 5.43283 77.749 5.68261 77.8739 6.05729C77.9988 6.40074 77.9052 6.80664 77.6242 7.05643L74.3769 10.2724L75.1575 14.831C75.22 15.2057 75.0639 15.5803 74.7516 15.7989C74.4394 16.0487 74.0335 16.0487 73.69 15.8926L69.6935 13.7382L65.6657 15.8926C65.3535 16.0487 64.9476 16.0487 64.6353 15.7989C64.3231 15.5803 64.167 15.2057 64.2294 14.831L64.9788 10.2724L61.7316 7.05643C61.4818 6.80664 61.3881 6.40074 61.4818 6.05729C61.6067 5.68261 61.9189 5.43283 62.2936 5.37038L66.7897 4.71469L68.788 0.562016C68.9441 0.218562 69.2876 0 69.6935 0C70.0682 0 70.4116 0.218562 70.5677 0.562016Z" fill="var(--wa-color-yellow-70)"/>
+<path d="M91.0498 0.562016L93.0793 4.71469L97.5442 5.37038C97.9189 5.43283 98.2311 5.68261 98.356 6.05729C98.4809 6.40074 98.3872 6.80664 98.1062 7.05643L94.859 10.2724L95.6396 14.831C95.702 15.2057 95.5459 15.5803 95.2337 15.7989C94.9214 16.0487 94.5155 16.0487 94.1721 15.8926L90.1755 13.7382L86.1477 15.8926C85.8355 16.0487 85.4296 16.0487 85.1174 15.7989C84.8052 15.5803 84.649 15.2057 84.7115 14.831L85.4608 10.2724L82.2136 7.05643C81.9638 6.80664 81.8702 6.40074 81.9638 6.05729C82.0887 5.68261 82.401 5.43283 82.7756 5.37038L87.2718 4.71469L89.2701 0.562016C89.4262 0.218562 89.7696 0 90.1755 0C90.5502 0 90.8937 0.218562 91.0498 0.562016Z" fill="var(--wa-color-neutral-fill-normal)"/>
+</svg>
diff --git a/docs/_includes/svgs/relative-time.njk b/docs/_includes/svgs/relative-time.njk
new file mode 100644
index 000000000..748ba0226
--- /dev/null
+++ b/docs/_includes/svgs/relative-time.njk
@@ -0,0 +1,4 @@
+<svg width="113" height="12" viewBox="0 0 113 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.7384 2.75C3.24622 2.75 2.75403 2.96094 2.40247 3.3125L1.6759 4.03906C1.39465 4.34375 0.902466 4.34375 0.621216 4.03906C0.316528 3.75781 0.316528 3.26562 0.621216 2.98438L1.34778 2.25781C1.98059 1.625 2.84778 1.25 3.7384 1.25C5.63684 1.25 7.16028 2.77344 7.16028 4.67188C7.16028 5.5625 6.78528 6.42969 6.15247 7.0625L2.96497 10.25H7.16028C7.55872 10.25 7.91028 10.6016 7.91028 11C7.91028 11.4219 7.55872 11.75 7.16028 11.75H1.16028C0.855591 11.75 0.574341 11.5859 0.457153 11.3047C0.339966 11.0234 0.410278 10.6953 0.621216 10.4844L5.09778 6.00781C5.44934 5.65625 5.66028 5.16406 5.66028 4.67188C5.66028 3.61719 4.79309 2.75 3.7384 2.75ZM17.679 1.29688C18.0775 1.15625 18.4993 1.36719 18.6634 1.74219L21.2415 8.63281L23.2337 1.78906C23.3275 1.48438 23.6087 1.25 23.9603 1.25C24.2884 1.25 24.5697 1.48438 24.6634 1.78906L26.6556 8.63281L29.2572 1.74219C29.3978 1.36719 29.8197 1.15625 30.2181 1.32031C30.5931 1.46094 30.804 1.88281 30.64 2.28125L27.265 11.2812C27.1712 11.5859 26.8665 11.7734 26.5384 11.75C26.2103 11.75 25.9525 11.5391 25.8587 11.2109L23.9603 4.69531L22.0384 11.2109C21.9447 11.5391 21.6634 11.75 21.3587 11.75C21.0306 11.7734 20.7259 11.5859 20.6322 11.2812L17.2572 2.28125C17.0931 1.88281 17.304 1.46094 17.679 1.29688ZM34.6103 1.25H39.8603C40.2587 1.25 40.6103 1.60156 40.6103 2C40.6103 2.42188 40.2587 2.75 39.8603 2.75H34.6103V5.75H38.3603C38.7587 5.75 39.1103 6.10156 39.1103 6.5C39.1103 6.92188 38.7587 7.25 38.3603 7.25H34.6103V10.25H39.8603C40.2587 10.25 40.6103 10.6016 40.6103 11C40.6103 11.4219 40.2587 11.75 39.8603 11.75H34.6103C33.7665 11.75 33.1103 11.0938 33.1103 10.25V6.5V2.75C33.1103 1.92969 33.7665 1.25 34.6103 1.25ZM44.5103 1.25H49.7603C50.1587 1.25 50.5103 1.60156 50.5103 2C50.5103 2.42188 50.1587 2.75 49.7603 2.75H44.5103V5.75H48.2603C48.6587 5.75 49.0103 6.10156 49.0103 6.5C49.0103 6.92188 48.6587 7.25 48.2603 7.25H44.5103V10.25H49.7603C50.1587 10.25 50.5103 10.6016 50.5103 11C50.5103 11.4219 50.1587 11.75 49.7603 11.75H44.5103C43.6665 11.75 43.0103 11.0938 43.0103 10.25V6.5V2.75C43.0103 1.92969 43.6665 1.25 44.5103 1.25ZM60.1993 2.53906L56.9884 5.84375L60.2697 10.5781C60.504 10.9297 60.4103 11.3984 60.0822 11.6328C59.7306 11.8672 59.2618 11.7734 59.0275 11.4453L55.9103 6.94531L54.4103 8.49219V11C54.4103 11.4219 54.0587 11.75 53.6603 11.75C53.2384 11.75 52.9103 11.4219 52.9103 11V8.1875V2C52.9103 1.60156 53.2384 1.25 53.6603 1.25C54.0587 1.25 54.4103 1.60156 54.4103 2V6.33594L55.465 5.23438L59.1212 1.48438C59.4025 1.20312 59.8712 1.17969 60.1759 1.48438C60.4806 1.76562 60.4806 2.23438 60.1993 2.53906ZM65.1306 2.98438C64.6618 3.17188 64.404 3.5 64.3337 3.89844C64.2634 4.22656 64.3103 4.4375 64.3806 4.60156C64.4509 4.74219 64.5681 4.88281 64.7556 5.02344C65.2243 5.35156 65.904 5.53906 66.7478 5.79688C66.7712 5.79688 66.7947 5.79688 66.8181 5.82031C67.5915 6.03125 68.5056 6.28906 69.1853 6.75781C69.5603 7.01562 69.8884 7.36719 70.0993 7.8125C70.3103 8.28125 70.3572 8.79688 70.24 9.38281C70.0759 10.3672 69.4197 11.0469 68.5759 11.4219C67.7322 11.7734 66.7009 11.8438 65.6697 11.6797C65.1072 11.5859 64.1931 11.2812 63.6072 11.0703C63.49 11.0469 63.3962 11 63.3025 10.9766C62.9275 10.8359 62.7165 10.4141 62.8337 10.0156C62.9743 9.64062 63.3962 9.42969 63.7947 9.54688C63.9118 9.59375 64.029 9.61719 64.1697 9.66406C64.7556 9.875 65.4822 10.1328 65.904 10.2031C66.7712 10.3203 67.4743 10.25 67.9665 10.0391C68.4587 9.82812 68.6931 9.52344 68.7634 9.125C68.8337 8.79688 68.7868 8.5625 68.7165 8.42188C68.6697 8.28125 68.529 8.14062 68.3415 8C67.8728 7.67188 67.1931 7.48438 66.3493 7.22656C66.3259 7.22656 66.3025 7.22656 66.279 7.20312C65.5056 6.99219 64.5915 6.73438 63.9118 6.26562C63.5368 6.00781 63.2087 5.65625 62.9978 5.21094C62.8103 4.74219 62.7634 4.22656 62.8572 3.64062L63.5837 3.78125L62.8572 3.64062C63.0212 2.65625 63.6775 1.97656 64.5212 1.60156C65.365 1.25 66.3962 1.17969 67.4275 1.34375C67.7322 1.39062 68.6697 1.57812 68.9978 1.67188C69.3962 1.76562 69.6306 2.1875 69.5134 2.58594C69.4197 2.98438 68.9978 3.21875 68.5993 3.10156C68.3415 3.03125 67.4743 2.86719 67.1931 2.82031L67.3103 2.09375L67.1931 2.82031C66.3259 2.70312 65.6228 2.77344 65.1306 2.98438Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M82.59 1.71875L85.4025 8.46875L86.34 10.7188C86.504 11.0938 86.3165 11.5391 85.9415 11.7031C85.5665 11.8672 85.1212 11.6797 84.9572 11.3047L84.2072 9.5H79.59L78.84 11.3047C78.6759 11.6797 78.254 11.8672 77.8556 11.7031C77.4806 11.5391 77.2931 11.0938 77.4572 10.7188L78.3947 8.46875L81.2072 1.71875C81.3243 1.4375 81.6056 1.25 81.9103 1.25C82.1915 1.25 82.4728 1.4375 82.59 1.71875ZM83.5978 8L81.9103 3.96875L80.2228 8H83.5978ZM94.0603 2.75C91.9743 2.75 90.3103 4.4375 90.3103 6.5C90.3103 8.58594 91.9743 10.25 94.0603 10.25C95.865 10.25 97.3884 8.96094 97.7165 7.25H94.8103C94.3884 7.25 94.0603 6.92188 94.0603 6.5C94.0603 6.10156 94.3884 5.75 94.8103 5.75H98.1853C98.7712 5.75 99.3337 6.26562 99.2868 6.94531C99.0525 9.64062 96.8025 11.75 94.0603 11.75C91.154 11.75 88.8103 9.40625 88.8103 6.5C88.8103 3.61719 91.154 1.25 94.0603 1.25C95.3962 1.25 96.615 1.76562 97.5525 2.58594C97.8572 2.86719 97.8806 3.33594 97.5993 3.66406C97.3415 3.96875 96.8493 3.99219 96.5447 3.71094C95.8884 3.125 95.0212 2.75 94.0603 2.75ZM106.96 2.75C105.601 2.75 104.382 3.47656 103.702 4.625C103.023 5.79688 103.023 7.22656 103.702 8.375C104.382 9.54688 105.601 10.25 106.96 10.25C108.296 10.25 109.515 9.54688 110.195 8.375C110.874 7.22656 110.874 5.79688 110.195 4.625C109.515 3.47656 108.296 2.75 106.96 2.75ZM112.21 6.5C112.21 8.39844 111.202 10.1094 109.585 11.0469C107.945 12.0078 105.952 12.0078 104.335 11.0469C102.695 10.1094 101.71 8.39844 101.71 6.5C101.71 4.625 102.695 2.91406 104.335 1.97656C105.952 1.01562 107.945 1.01562 109.585 1.97656C111.202 2.91406 112.21 4.625 112.21 6.5Z" fill="var(--wa-color-neutral-on-quiet)"/>
+</svg>
diff --git a/docs/_includes/svgs/resize-observer.njk b/docs/_includes/svgs/resize-observer.njk
new file mode 100644
index 000000000..e4a78876e
--- /dev/null
+++ b/docs/_includes/svgs/resize-observer.njk
@@ -0,0 +1,5 @@
+<svg width="78" height="14" viewBox="0 0 78 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.12389 3.57143C2.12389 2.15179 3.27568 1 4.69532 1H5.55247C6.02657 1 6.40961 1.38304 6.40961 1.85714C6.40961 2.33125 6.02657 2.71429 5.55247 2.71429H4.69532C4.22122 2.71429 3.83818 3.09732 3.83818 3.57143V4.57589C3.83818 5.25893 3.56764 5.9125 3.0855 6.39464L2.48014 7L3.0855 7.60536C3.56764 8.0875 3.83818 8.74107 3.83818 9.42411V10.4286C3.83818 10.9027 4.22122 11.2857 4.69532 11.2857H5.55247C6.02657 11.2857 6.40961 11.6688 6.40961 12.1429C6.40961 12.617 6.02657 13 5.55247 13H4.69532C3.27568 13 2.12389 11.8482 2.12389 10.4286V9.42411C2.12389 9.19643 2.03282 8.97946 1.87211 8.81875L0.661394 7.60536C0.326573 7.27054 0.326573 6.72679 0.661394 6.39196L1.87479 5.17857C2.0355 5.01786 2.12657 4.80089 2.12657 4.57321V3.57143H2.12389Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<path d="M17.5761 8.27832H12.2377C12.3731 8.61686 12.6122 8.88981 12.955 9.09717C13.302 9.30452 13.7696 9.4082 14.3578 9.4082C14.8403 9.4082 15.4814 9.30452 16.2812 9.09717C16.6113 9.01253 16.8398 8.97021 16.9667 8.97021C17.1402 8.97021 17.2862 9.03158 17.4047 9.1543C17.5232 9.27702 17.5825 9.43148 17.5825 9.61768C17.5825 9.78695 17.519 9.93083 17.392 10.0493C17.2228 10.2059 16.8102 10.3561 16.1542 10.5C15.4983 10.6396 14.8678 10.7095 14.2626 10.7095C13.2216 10.7095 12.388 10.4154 11.7617 9.82715C11.1396 9.23893 10.8286 8.5153 10.8286 7.65625C10.8286 6.74219 11.165 5.99951 11.8378 5.42822C12.5149 4.8527 13.2936 4.56494 14.1738 4.56494C14.7027 4.56494 15.1873 4.65804 15.6274 4.84424C16.0717 5.03044 16.4018 5.23145 16.6176 5.44727C16.9223 5.76042 17.1741 6.14762 17.373 6.60889C17.5084 6.9305 17.5761 7.3029 17.5761 7.72607V8.27832ZM16.1352 6.97705C15.9363 6.60465 15.676 6.32747 15.3544 6.14551C15.0328 5.95931 14.6498 5.86621 14.2055 5.86621C13.7654 5.86621 13.3845 5.95931 13.0629 6.14551C12.7413 6.32747 12.4789 6.60465 12.2758 6.97705H16.1352ZM21.0607 4.73633V5.17432C21.2977 4.97119 21.558 4.81885 21.8415 4.71729C22.1292 4.61572 22.4403 4.56494 22.7746 4.56494C23.5448 4.56494 24.1541 4.80404 24.6027 5.28223C24.9582 5.66309 25.1359 6.16243 25.1359 6.78027V9.19873C25.411 9.19873 25.6141 9.26009 25.7453 9.38281C25.8765 9.5013 25.9421 9.65788 25.9421 9.85254C25.9421 10.043 25.8744 10.1995 25.7389 10.3223C25.6078 10.4408 25.3856 10.5 25.0724 10.5H23.8981C23.585 10.5 23.3607 10.4408 23.2253 10.3223C23.0941 10.1995 23.0285 10.0409 23.0285 9.84619C23.0285 9.65576 23.0941 9.5013 23.2253 9.38281C23.3565 9.26009 23.5596 9.19873 23.8346 9.19873V6.74219C23.8346 6.45866 23.7585 6.2513 23.6061 6.12012C23.4072 5.95085 23.1089 5.86621 22.7111 5.86621C22.4107 5.86621 22.1462 5.92546 21.9177 6.04395C21.6934 6.1582 21.4077 6.40365 21.0607 6.78027V9.19873C21.395 9.19873 21.6109 9.23047 21.7082 9.29395C21.9155 9.4209 22.0192 9.6071 22.0192 9.85254C22.0192 10.043 21.9515 10.1995 21.8161 10.3223C21.6849 10.4408 21.4627 10.5 21.1496 10.5H19.6706C19.3574 10.5 19.1331 10.4408 18.9977 10.3223C18.8665 10.1995 18.801 10.0409 18.801 9.84619C18.801 9.60921 18.9025 9.42513 19.1056 9.29395C19.2072 9.23047 19.4251 9.19873 19.7595 9.19873V6.0376C19.4844 6.0376 19.2813 5.97624 19.1501 5.85352C19.0189 5.73079 18.9533 5.57422 18.9533 5.38379C18.9533 5.19336 19.0189 5.0389 19.1501 4.92041C19.2855 4.79769 19.5098 4.73633 19.8229 4.73633H21.0607ZM30.1249 6.0376V8.64648C30.1249 8.92578 30.182 9.10986 30.2963 9.19873C30.474 9.33838 30.7914 9.4082 31.2485 9.4082C31.9128 9.4082 32.5264 9.26644 33.0893 8.98291C33.3051 8.87288 33.4744 8.81787 33.5971 8.81787C33.7664 8.81787 33.9124 8.88135 34.0351 9.0083C34.162 9.13525 34.2255 9.28971 34.2255 9.47168C34.2255 9.64095 34.1578 9.78695 34.0224 9.90967C33.815 10.1086 33.4045 10.2926 32.7909 10.4619C32.1816 10.627 31.6674 10.7095 31.2485 10.7095C30.4402 10.7095 29.8329 10.536 29.4267 10.189C29.0247 9.83773 28.8237 9.4082 28.8237 8.90039V6.0376H28.3539C28.0408 6.0376 27.8165 5.97835 27.6811 5.85986C27.5499 5.73714 27.4843 5.57845 27.4843 5.38379C27.4843 5.19336 27.5499 5.0389 27.6811 4.92041C27.8165 4.79769 28.0408 4.73633 28.3539 4.73633H28.8237V3.56201C28.8237 3.24886 28.8829 3.02669 29.0014 2.89551C29.1241 2.76009 29.2828 2.69238 29.4775 2.69238C29.6679 2.69238 29.8223 2.76009 29.9408 2.89551C30.0636 3.02669 30.1249 3.24886 30.1249 3.56201V4.73633H32.5307C32.8438 4.73633 33.066 4.79769 33.1972 4.92041C33.3326 5.0389 33.4003 5.19548 33.4003 5.39014C33.4003 5.58057 33.3326 5.73714 33.1972 5.85986C33.066 5.97835 32.8438 6.0376 32.5307 6.0376H30.1249ZM38.2433 4.73633V5.54883C38.7892 5.15527 39.2187 4.8929 39.5319 4.76172C39.8493 4.63053 40.1455 4.56494 40.4206 4.56494C40.8437 4.56494 41.2542 4.72152 41.652 5.03467C41.9228 5.24626 42.0583 5.46208 42.0583 5.68213C42.0583 5.86833 41.9927 6.02702 41.8615 6.1582C41.7345 6.28516 41.5801 6.34863 41.3981 6.34863C41.2373 6.34863 41.068 6.26823 40.8903 6.10742C40.7126 5.94661 40.5539 5.86621 40.4142 5.86621C40.2323 5.86621 39.9593 5.98047 39.5954 6.20898C39.2357 6.4375 38.785 6.78027 38.2433 7.2373V9.19873H40.0968C40.41 9.19873 40.6322 9.26009 40.7633 9.38281C40.8988 9.5013 40.9665 9.65788 40.9665 9.85254C40.9665 10.043 40.8988 10.1995 40.7633 10.3223C40.6322 10.4408 40.41 10.5 40.0968 10.5H36.1676C35.8545 10.5 35.6302 10.4408 35.4948 10.3223C35.3636 10.1995 35.298 10.0409 35.298 9.84619C35.298 9.65576 35.3636 9.5013 35.4948 9.38281C35.6302 9.26009 35.8545 9.19873 36.1676 9.19873H36.942V6.0376H36.4723C36.1592 6.0376 35.9349 5.97835 35.7995 5.85986C35.6683 5.73714 35.6027 5.57845 35.6027 5.38379C35.6027 5.19336 35.6683 5.0389 35.7995 4.92041C35.9349 4.79769 36.1592 4.73633 36.4723 4.73633H38.2433ZM47.0473 2.26709V3.64453H45.4984V2.26709H47.0473ZM47.225 4.73633V9.19873H48.7865C49.0997 9.19873 49.3218 9.26009 49.453 9.38281C49.5884 9.5013 49.6562 9.65788 49.6562 9.85254C49.6562 10.043 49.5884 10.1995 49.453 10.3223C49.3218 10.4408 49.0997 10.5 48.7865 10.5H44.3622C44.0491 10.5 43.8248 10.4408 43.6894 10.3223C43.5582 10.1995 43.4926 10.0409 43.4926 9.84619C43.4926 9.65576 43.5582 9.5013 43.6894 9.38281C43.8248 9.26009 44.0491 9.19873 44.3622 9.19873H45.9237V6.0376H44.8764C44.5674 6.0376 44.3453 5.97835 44.2099 5.85986C44.0744 5.73714 44.0067 5.57845 44.0067 5.38379C44.0067 5.19336 44.0723 5.0389 44.2035 4.92041C44.3389 4.79769 44.5632 4.73633 44.8764 4.73633H47.225ZM57.9142 8.27832H52.5758C52.7112 8.61686 52.9503 8.88981 53.2931 9.09717C53.6401 9.30452 54.1077 9.4082 54.6959 9.4082C55.1784 9.4082 55.8195 9.30452 56.6193 9.09717C56.9494 9.01253 57.1779 8.97021 57.3048 8.97021C57.4783 8.97021 57.6243 9.03158 57.7428 9.1543C57.8613 9.27702 57.9205 9.43148 57.9205 9.61768C57.9205 9.78695 57.8571 9.93083 57.7301 10.0493C57.5608 10.2059 57.1482 10.3561 56.4923 10.5C55.8364 10.6396 55.2059 10.7095 54.6007 10.7095C53.5597 10.7095 52.726 10.4154 52.0997 9.82715C51.4777 9.23893 51.1666 8.5153 51.1666 7.65625C51.1666 6.74219 51.5031 5.99951 52.1759 5.42822C52.853 4.8527 53.6316 4.56494 54.5119 4.56494C55.0408 4.56494 55.5254 4.65804 55.9655 4.84424C56.4098 5.03044 56.7399 5.23145 56.9557 5.44727C57.2604 5.76042 57.5122 6.14762 57.7111 6.60889C57.8465 6.9305 57.9142 7.3029 57.9142 7.72607V8.27832ZM56.4733 6.97705C56.2744 6.60465 56.0141 6.32747 55.6925 6.14551C55.3709 5.95931 54.9879 5.86621 54.5436 5.86621C54.1035 5.86621 53.7226 5.95931 53.401 6.14551C53.0794 6.32747 52.817 6.60465 52.6139 6.97705H56.4733ZM64.122 6.25977C63.9104 6.12858 63.6882 6.03125 63.4554 5.96777C63.2227 5.90007 62.9794 5.86621 62.7255 5.86621C62.2219 5.86621 61.822 5.94873 61.5258 6.11377C61.3946 6.18571 61.329 6.264 61.329 6.34863C61.329 6.44596 61.4179 6.54118 61.5956 6.63428C61.731 6.70199 62.0336 6.76758 62.5033 6.83105C63.3666 6.94954 63.9675 7.06803 64.306 7.18652C64.7504 7.3431 65.0931 7.57585 65.3344 7.88477C65.5756 8.19368 65.6962 8.51953 65.6962 8.8623C65.6962 9.3278 65.4909 9.71712 65.0804 10.0303C64.4922 10.4831 63.7284 10.7095 62.7889 10.7095C62.4123 10.7095 62.0632 10.6756 61.7416 10.6079C61.4242 10.5444 61.1322 10.4492 60.8656 10.3223C60.8021 10.3773 60.7344 10.4196 60.6625 10.4492C60.5905 10.4788 60.5165 10.4937 60.4403 10.4937C60.2372 10.4937 60.0743 10.4281 59.9515 10.2969C59.8331 10.1615 59.7738 9.93717 59.7738 9.62402V9.18604C59.7738 8.87288 59.8331 8.65072 59.9515 8.51953C60.0743 8.38411 60.233 8.31641 60.4276 8.31641C60.5842 8.31641 60.7154 8.36084 60.8212 8.44971C60.927 8.53434 61.0095 8.68245 61.0687 8.89404C61.2676 9.06331 61.5067 9.19238 61.786 9.28125C62.0653 9.36589 62.3869 9.4082 62.7509 9.4082C63.3475 9.4082 63.8109 9.3151 64.141 9.12891C64.2976 9.03581 64.3759 8.93848 64.3759 8.83691C64.3759 8.66764 64.2637 8.52799 64.0394 8.41797C63.8151 8.30794 63.3518 8.21484 62.6493 8.13867C61.604 8.02865 60.9058 7.81706 60.5546 7.50391C60.2033 7.19499 60.0277 6.81413 60.0277 6.36133C60.0277 5.89583 60.2245 5.50863 60.618 5.19971C61.1512 4.77653 61.8495 4.56494 62.7128 4.56494C63.0132 4.56494 63.301 4.59456 63.5761 4.65381C63.8554 4.70882 64.122 4.79557 64.3759 4.91406C64.4563 4.85482 64.5303 4.81038 64.598 4.78076C64.67 4.75114 64.7356 4.73633 64.7948 4.73633C64.9725 4.73633 65.1206 4.80404 65.2391 4.93945C65.3576 5.07064 65.4169 5.29281 65.4169 5.60596V5.92334C65.4169 6.20687 65.383 6.39941 65.3153 6.50098C65.1799 6.69564 64.9958 6.79297 64.7631 6.79297C64.6065 6.79297 64.469 6.7443 64.3505 6.64697C64.232 6.54964 64.1558 6.42057 64.122 6.25977Z" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M75.6953 10.4286C75.6953 11.8482 74.5435 13 73.1239 13L72.2667 13C71.7926 13 71.4096 12.617 71.4096 12.1429C71.4096 11.6687 71.7926 11.2857 72.2667 11.2857L73.1239 11.2857C73.598 11.2857 73.981 10.9027 73.981 10.4286L73.981 9.42411C73.981 8.74107 74.2516 8.0875 74.7337 7.60536L75.3391 7L74.7337 6.39464C74.2516 5.9125 73.981 5.25893 73.981 4.57589L73.981 3.57143C73.981 3.09732 73.598 2.71429 73.1239 2.71429L72.2667 2.71429C71.7926 2.71429 71.4096 2.33125 71.4096 1.85714C71.4096 1.38304 71.7926 0.999999 72.2667 0.999999L73.1239 1C74.5435 1 75.6953 2.15179 75.6953 3.57143L75.6953 4.57589C75.6953 4.80357 75.7864 5.02054 75.9471 5.18125L77.1578 6.39464C77.4926 6.72946 77.4926 7.27321 77.1578 7.60804L75.9444 8.82143C75.7837 8.98214 75.6926 9.19911 75.6926 9.42679L75.6926 10.4286L75.6953 10.4286Z" fill="var(--wa-color-neutral-on-quiet)"/>
+</svg>
diff --git a/docs/_includes/svgs/select.njk b/docs/_includes/svgs/select.njk
new file mode 100644
index 000000000..0f9e13b59
--- /dev/null
+++ b/docs/_includes/svgs/select.njk
@@ -0,0 +1,6 @@
+<svg width="112" height="40" viewBox="0 0 112 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 9H106C108.761 9 111 11.2386 111 14V34C111 36.7614 108.761 39 106 39H6C3.23857 39 1 36.7614 1 34V14C1 11.2386 3.23858 9 6 9Z" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M93.4609 28.0391L88.9609 23.5391C88.6562 23.2578 88.6562 22.7656 88.9609 22.4844C89.2422 22.1797 89.7344 22.1797 90.0156 22.4844L94 26.4453L97.9609 22.4844C98.2422 22.1797 98.7344 22.1797 99.0156 22.4844C99.3203 22.7656 99.3203 23.2578 99.0156 23.5391L94.5156 28.0391C94.2344 28.3438 93.7422 28.3438 93.4609 28.0391Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<rect width="48" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<rect x="12" y="22" width="48" height="4" rx="2" fill="var(--wa-color-neutral-fill-normal)"/>
+</svg>
diff --git a/docs/_includes/svgs/skeleton.njk b/docs/_includes/svgs/skeleton.njk
new file mode 100644
index 000000000..09fc55081
--- /dev/null
+++ b/docs/_includes/svgs/skeleton.njk
@@ -0,0 +1,6 @@
+<svg width="96" height="40" viewBox="0 0 96 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="12" cy="12" r="12" fill="var(--wa-color-neutral-fill-normal)"/>
+<rect x="32" width="64" height="8" rx="4" fill="var(--wa-color-neutral-fill-normal)"/>
+<rect y="32" width="96" height="8" rx="4" fill="var(--wa-color-neutral-fill-normal)"/>
+<rect x="32" y="16" width="64" height="8" rx="4" fill="var(--wa-color-neutral-fill-normal)"/>
+</svg>
diff --git a/docs/_includes/svgs/spinner.njk b/docs/_includes/svgs/spinner.njk
new file mode 100644
index 000000000..fe9e8073a
--- /dev/null
+++ b/docs/_includes/svgs/spinner.njk
@@ -0,0 +1,4 @@
+<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="14" cy="14" r="12" stroke="var(--wa-color-surface-border)" stroke-width="4"/>
+<path d="M2.41177 17.1051C0.69689 10.7051 4.49494 4.12664 10.8949 2.41176C11.9324 2.13377 12.9746 2.00065 14 2" stroke="var(--wa-color-brand-fill-loud)" stroke-width="4" stroke-linecap="round"/>
+</svg>
diff --git a/docs/_includes/svgs/split-panel.njk b/docs/_includes/svgs/split-panel.njk
new file mode 100644
index 000000000..5db55cf7c
--- /dev/null
+++ b/docs/_includes/svgs/split-panel.njk
@@ -0,0 +1,5 @@
+<svg width="96" height="64" viewBox="0 0 96 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 1H84C90.0751 1 95 5.92487 95 12V52C95 58.0751 90.0751 63 84 63H12C5.92487 63 1 58.0751 1 52V12C1 5.92487 5.92487 1 12 1Z" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<line x1="49" y1="-4.37114e-08" x2="49" y2="64" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<line x1="96" y1="32" x2="48" y2="32" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+</svg>
diff --git a/docs/_includes/svgs/switch.njk b/docs/_includes/svgs/switch.njk
new file mode 100644
index 000000000..f1427c12c
--- /dev/null
+++ b/docs/_includes/svgs/switch.njk
@@ -0,0 +1,6 @@
+<svg width="28" height="36" viewBox="0 0 28 36" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="1" y="1" width="26" height="14" rx="7" stroke="var(--wa-color-neutral-border-loud)" stroke-width="2"/>
+<rect y="20" width="28" height="16" rx="8" fill="var(--wa-color-brand-fill-loud)"/>
+<circle cx="8" cy="8" r="4" fill="var(--wa-color-neutral-border-loud)"/>
+<circle cx="20" cy="28" r="4" fill="var(--wa-color-surface-default)"/>
+</svg>
diff --git a/docs/_includes/svgs/tab-group.njk b/docs/_includes/svgs/tab-group.njk
new file mode 100644
index 000000000..c21415959
--- /dev/null
+++ b/docs/_includes/svgs/tab-group.njk
@@ -0,0 +1,7 @@
+<svg width="114" height="17" viewBox="0 0 114 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="7" width="24" height="4" rx="2" fill="var(--wa-color-brand-fill-loud)"/>
+<rect x="45" width="24" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<rect x="81" width="24" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M113 16L1 16" stroke="var(--wa-color-surface-border)" stroke-width="2" stroke-linecap="round"/>
+<path d="M38 16L1 16" stroke="#0070EF" stroke-width="2" stroke-linecap="round"/>
+</svg>
diff --git a/docs/_includes/svgs/tag.njk b/docs/_includes/svgs/tag.njk
new file mode 100644
index 000000000..051d4d250
--- /dev/null
+++ b/docs/_includes/svgs/tag.njk
@@ -0,0 +1,6 @@
+<svg width="64" height="28" viewBox="0 0 64 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 1H58C60.7614 1 63 3.23858 63 6V22C63 24.7614 60.7614 27 58 27H6C3.23858 27 1 24.7614 1 22V6C1 3.23858 3.23858 1 6 1Z" fill="var(--wa-color-neutral-fill-quiet)"/>
+<path d="M6 1H58C60.7614 1 63 3.23858 63 6V22C63 24.7614 60.7614 27 58 27H6C3.23858 27 1 24.7614 1 22V6C1 3.23858 3.23858 1 6 1Z" stroke="var(--wa-color-neutral-border-quiet)" stroke-width="2"/>
+<path d="M12.25 10.375C12.25 9.76562 12.7422 9.25 13.375 9.27344H16.8672C17.2656 9.27344 17.6406 9.41406 17.9219 9.69531L22.0469 13.8203C22.6328 14.4062 22.6328 15.3672 22.0469 15.9531L18.9297 19.0703C18.3438 19.6562 17.3828 19.6562 16.7969 19.0703L12.6719 14.9453C12.3906 14.6641 12.25 14.2891 12.25 13.8906V10.375ZM14.875 11.125C14.4531 11.125 14.125 11.4766 14.125 11.875C14.125 12.2969 14.4531 12.625 14.875 12.625C15.2734 12.625 15.625 12.2969 15.625 11.875C15.625 11.4766 15.2734 11.125 14.875 11.125Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<rect x="31" y="12" width="21" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/textarea.njk b/docs/_includes/svgs/textarea.njk
new file mode 100644
index 000000000..02a2e3e11
--- /dev/null
+++ b/docs/_includes/svgs/textarea.njk
@@ -0,0 +1,6 @@
+<svg width="112" height="56" viewBox="0 0 112 56" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 9H106C108.761 9 111 11.2386 111 14V50C111 52.7614 108.761 55 106 55H6C3.23857 55 1 52.7614 1 50V14C1 11.2386 3.23858 9 6 9Z" fill="var(--wa-color-surface-default)" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M104.293 51.2929L107.293 48.2929" stroke="var(--wa-color-neutral-on-quiet)" stroke-width="2" stroke-linecap="round"/>
+<path d="M99 51L107 43" stroke="var(--wa-color-neutral-on-quiet)" stroke-width="2" stroke-linecap="round"/>
+<rect width="48" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/thumbnail-placeholder.njk b/docs/_includes/svgs/thumbnail-placeholder.njk
new file mode 100644
index 000000000..fde2acd83
--- /dev/null
+++ b/docs/_includes/svgs/thumbnail-placeholder.njk
@@ -0,0 +1,5 @@
+<svg width="50" height="50" viewBox="0 0 50 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1 7C1 3.68629 3.68629 1 7 1H43C46.3137 1 49 3.68629 49 7V43C49 46.3137 46.3137 49 43 49H7C3.68629 49 1 46.3137 1 43V7Z" stroke="var(--wa-color-surface-border)" stroke-width="2" stroke-linecap="round" stroke-dasharray="6 6"/>
+<path d="M14.1566 18.7199L21.5367 16.7424C22.6036 16.4565 23.7003 17.0896 23.9862 18.1566L26.8463 28.8306C27.1322 29.8975 26.499 30.9942 25.4321 31.2801L18.052 33.2576C16.985 33.5435 15.8884 32.9103 15.6025 31.8434L12.7424 21.1694C12.4565 20.1024 13.0897 19.0057 14.1566 18.7199Z" stroke="var(--wa-color-neutral-border-normal)" stroke-width="2"/>
+<path d="M33.8449 16.3273H26.2045C23.9953 16.3273 22.2045 18.1181 22.2045 20.3273V31.3778C22.2045 33.587 23.9953 35.3778 26.2045 35.3778H33.8449C36.0541 35.3778 37.8449 33.587 37.8449 31.3778V20.3273C37.8449 18.1181 36.0541 16.3273 33.8449 16.3273Z" fill="var(--wa-color-neutral-border-normal)" stroke="var(--wa-color-neutral-fill-quiet)" stroke-width="2"/>
+</svg>
diff --git a/docs/_includes/svgs/tooltip.njk b/docs/_includes/svgs/tooltip.njk
new file mode 100644
index 000000000..9d2e2c213
--- /dev/null
+++ b/docs/_includes/svgs/tooltip.njk
@@ -0,0 +1,6 @@
+<svg width="48" height="54" viewBox="0 0 48 54" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 6.80762C0 3.49391 2.68629 0.807617 6 0.807617H42C45.3137 0.807617 48 3.49391 48 6.80762V22.8076C48 26.1213 45.3137 28.8076 42 28.8076H6C2.68629 28.8076 0 26.1213 0 22.8076V6.80762Z" fill="var(--wa-tooltip-background-color)"/>
+<rect x="12" y="12.8076" width="24" height="4" rx="2" fill="var(--wa-tooltip-content-color)"/>
+<rect x="14.8076" y="26" width="13" height="13" rx="2" transform="rotate(-45 14.8076 26)" fill="var(--wa-tooltip-background-color)"/>
+<path d="M24.0156 53.1924C21.1406 53.1924 18.5156 51.6924 17.0781 49.1924C15.6406 46.7236 15.6406 43.6924 17.0781 41.1924C18.5156 38.7236 21.1406 37.1924 24.0156 37.1924C26.8594 37.1924 29.4844 38.7236 30.9219 41.1924C32.3594 43.6924 32.3594 46.7236 30.9219 49.1924C29.4844 51.6924 26.8594 53.1924 24.0156 53.1924ZM22.7656 47.6924C22.3281 47.6924 22.0156 48.0361 22.0156 48.4424C22.0156 48.8799 22.3281 49.1924 22.7656 49.1924H25.2656C25.6719 49.1924 26.0156 48.8799 26.0156 48.4424C26.0156 48.0361 25.6719 47.6924 25.2656 47.6924H25.0156V44.9424C25.0156 44.5361 24.6719 44.1924 24.2656 44.1924H22.7656C22.3281 44.1924 22.0156 44.5361 22.0156 44.9424C22.0156 45.3799 22.3281 45.6924 22.7656 45.6924H23.5156V47.6924H22.7656ZM24.0156 41.1924C23.4531 41.1924 23.0156 41.6611 23.0156 42.1924C23.0156 42.7549 23.4531 43.1924 24.0156 43.1924C24.5469 43.1924 25.0156 42.7549 25.0156 42.1924C25.0156 41.6611 24.5469 41.1924 24.0156 41.1924Z" fill="var(--wa-color-neutral-border-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/tree.njk b/docs/_includes/svgs/tree.njk
new file mode 100644
index 000000000..33f017437
--- /dev/null
+++ b/docs/_includes/svgs/tree.njk
@@ -0,0 +1,9 @@
+<svg width="72" height="48" viewBox="0 0 72 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.46094 10.0391L0.960938 5.53906C0.65625 5.25781 0.65625 4.76562 0.960938 4.48438C1.24219 4.17969 1.73438 4.17969 2.01562 4.48438L6 8.44531L9.96094 4.48438C10.2422 4.17969 10.7344 4.17969 11.0156 4.48438C11.3203 4.76562 11.3203 5.25781 11.0156 5.53906L6.51562 10.0391C6.23438 10.3438 5.74219 10.3438 5.46094 10.0391Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<rect x="20" y="4" width="36" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<line x1="6" y1="15" x2="6" y2="48" stroke="var(--wa-color-surface-border)" stroke-width="2"/>
+<path d="M27.5156 22.9844C27.8203 23.2656 27.8203 23.7578 27.5156 24.0391L23.0156 28.5391C22.7344 28.8438 22.2422 28.8438 21.9609 28.5391C21.6562 28.2578 21.6562 27.7656 21.9609 27.4844L25.9219 23.5L21.9609 19.5391C21.6562 19.2578 21.6562 18.7656 21.9609 18.4844C22.2422 18.1797 22.7344 18.1797 23.0156 18.4844L27.5156 22.9844Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<rect x="36" y="21" width="36" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+<path d="M27.5156 39.9844C27.8203 40.2656 27.8203 40.7578 27.5156 41.0391L23.0156 45.5391C22.7344 45.8438 22.2422 45.8438 21.9609 45.5391C21.6562 45.2578 21.6562 44.7656 21.9609 44.4844L25.9219 40.5L21.9609 36.5391C21.6562 36.2578 21.6562 35.7656 21.9609 35.4844C22.2422 35.1797 22.7344 35.1797 23.0156 35.4844L27.5156 39.9844Z" fill="var(--wa-color-neutral-on-quiet)"/>
+<rect x="36" y="38" width="36" height="4" rx="2" fill="var(--wa-color-neutral-border-loud)"/>
+</svg>
diff --git a/docs/_includes/svgs/visually-hidden.njk b/docs/_includes/svgs/visually-hidden.njk
new file mode 100644
index 000000000..be314ad2a
--- /dev/null
+++ b/docs/_includes/svgs/visually-hidden.njk
@@ -0,0 +1,4 @@
+<svg width="50" height="50" viewBox="0 0 50 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1 7C1 3.68629 3.68629 1 7 1H43C46.3137 1 49 3.68629 49 7V43C49 46.3137 46.3137 49 43 49H7C3.68629 49 1 46.3137 1 43V7Z" stroke="var(--wa-color-surface-border)" stroke-width="2" stroke-linecap="round" stroke-dasharray="6 6"/>
+<path d="M16.1875 17.1875L19.6875 19.9062C21.0938 18.8438 22.8438 18 25 18C27.5 18 29.5312 19.1562 31 20.5312C32.4688 21.875 33.4375 23.5 33.9062 24.625C34 24.875 34 25.1562 33.9062 25.4062C33.5 26.4062 32.6562 27.8438 31.4062 29.0938L34.6875 31.6875C35.0312 31.9375 35.0938 32.4062 34.8125 32.7188C34.5625 33.0625 34.0938 33.125 33.7812 32.8438L15.2812 18.3438C14.9375 18.0938 14.875 17.625 15.1562 17.3125C15.4062 16.9688 15.875 16.9062 16.1875 17.1875ZM21.9688 21.6875L24.7812 23.9062C24.9062 23.625 25 23.3438 25 23.0312C25 22.7812 24.9375 22.5938 24.875 22.375C24.8438 22.2188 24.9375 22 25.125 22.0312C26.4062 22.0625 27.5312 22.9375 27.875 24.25C28.0625 24.9375 28 25.625 27.75 26.2188L28.9375 27.1562C29.2812 26.5312 29.5 25.7812 29.5 25C29.5 22.5312 27.4688 20.5 25 20.5C23.8125 20.5 22.75 20.9688 21.9688 21.6875ZM26.6562 29.1875L28.9375 31C27.7812 31.625 26.4688 32 25 32C22.4688 32 20.4375 30.875 18.9688 29.5C17.5 28.125 16.5312 26.5 16.0625 25.4062C15.9688 25.1562 15.9688 24.875 16.0625 24.625C16.375 23.9062 16.875 23 17.5938 22.0625L20.5312 24.375C20.5 24.5938 20.5 24.8125 20.5 25C20.5 27.5 22.5 29.5 25 29.5C25.5625 29.5 26.125 29.4062 26.6562 29.1875Z" fill="var(--wa-color-neutral-border-normal)"/>
+</svg>
diff --git a/docs/docs/components/index.md b/docs/docs/components/index.md
new file mode 100644
index 000000000..fec90d1af
--- /dev/null
+++ b/docs/docs/components/index.md
@@ -0,0 +1,459 @@
+---
+title: Components
+description: Browse the library of customizable, framework-friendly web components included in Web Awesome.
+layout: page-outline
+---
+
+<style>
+  wa-page > main {
+    max-width: 120ch;
+    margin-inline: auto;
+  }
+  .index-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
+    gap: var(--wa-space-2xl);
+  }
+  .index-category {
+    grid-column: 1 / -1;
+    margin-bottom: 0;
+    margin-top: var(--wa-space-2xl);
+  }
+  .index-grid a {
+    border-radius: var(--wa-border-radius-m);
+  }
+  .index-grid wa-card {
+    --box-shadow: none;
+    --spacing: var(--wa-space-m);
+    width: 100%;
+  }
+  .index-grid wa-card:hover {
+    --border-color: var(--wa-color-brand-border-loud);
+    --box-shadow: 0 0 0 var(--wa-border-width-s) var(--border-color);
+    & .component-name {
+      color: var(--wa-color-brand-on-quiet);
+    }
+  }
+  .index-grid wa-card [slot='header'] {
+    display: flex;
+  }
+  .index-grid wa-card::part(header) {
+    background-color: var(--wa-color-neutral-fill-quiet);
+    border-bottom: none;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-height: calc(6rem + var(--spacing));
+  }
+  wa-card#drawer-card::part(header) {
+    --spacing: 0;
+    justify-content: flex-end;
+    overflow: hidden;
+  }
+  wa-card .component-name {
+    font-size: var(--wa-font-size-s);
+    font-weight: var(--wa-font-weight-action);
+  }
+</style>
+
+<p style="max-width: 80ch">Components are the essential building blocks to create intuitive, cohesive experiences. Browse the library of customizable, framework-friendly web components included in Web Awesome.</p>
+
+<div class="index-grid">
+  <h2 class="index-category">Actions</h2>
+  <a href="/docs/components/button">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/button.njk" %}
+      </div>
+      <span class="component-name">Button</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/button-group">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/button-group.njk" %}
+      </div>
+      <span class="component-name">Button Group</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/copy-button">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/copy-button.njk" %}
+      </div>
+      <span class="component-name">Copy Button</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/dropdown">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/dropdown.njk" %}
+      </div>
+      <span class="component-name">Dropdown</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/icon-button">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/icon-button.njk" %}
+      </div>
+      <span class="component-name">Icon Button</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/menu">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/menu.njk" %}
+      </div>
+      <span class="component-name">Menu</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/qr-code">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/qr-code.njk" %}
+      </div>
+      <span class="component-name">QR Code</span>
+    </wa-card>
+  </a>
+
+  <h2 class="index-category" style="grid-column: 1 / -1">Feedback and Status</h2>
+  <a href="/docs/components/badge">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/badge.njk" %}
+      </div>
+      <span class="component-name">Badge</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/callout">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/callout.njk" %}
+      </div>
+      <span class="component-name">Callout</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/progress-bar">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/progress-bar.njk" %}
+      </div>
+      <span class="component-name">Progress Bar</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/progress-ring">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/progress-ring.njk" %}
+      </div>
+      <span class="component-name">Progress Ring</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/skeleton">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/skeleton.njk" %}
+      </div>
+      <span class="component-name">Skeleton</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/spinner">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/spinner.njk" %}
+      </div>
+      <span class="component-name">Spinner</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/tag">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/tag.njk" %}
+      </div>
+      <span class="component-name">Tag</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/tooltip">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/tooltip.njk" %}
+      </div>
+      <span class="component-name">Tooltip</span>
+    </wa-card>
+  </a>
+
+  <h2 class="index-category">Imagery</h2>
+  <a href="/docs/components/animated-image">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/animated-image.njk" %}
+      </div>
+      <span class="component-name">Animated Image</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/avatar">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/avatar.njk" %}
+      </div>
+      <span class="component-name">Avatar</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/carousel">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/carousel.njk" %}
+      </div>
+      <span class="component-name">Carousel</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/icon">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/icon.njk" %}
+      </div>
+      <span class="component-name">Icon</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/image-comparer">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/image-comparer.njk" %}
+      </div>
+      <span class="component-name">Image Comparer</span>
+    </wa-card>
+  </a>
+
+  <h2 class="index-category">Inputs</h2>
+  <a href="/docs/components/checkbox">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/checkbox.njk" %}
+      </div>
+      <span class="component-name">Checkbox</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/color-picker">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/color-picker.njk" %}
+      </div>
+      <span class="component-name">Color Picker</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/input">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/input.njk" %}
+      </div>
+      <span class="component-name">Input</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/radio-group">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/radio-group.njk" %}
+      </div>
+      <span class="component-name">Radio Group</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/range">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/range.njk" %}
+      </div>
+      <span class="component-name">Range</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/rating">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/rating.njk" %}
+      </div>
+      <span class="component-name">Rating</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/select">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/select.njk" %}
+      </div>
+      <span class="component-name">Select</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/switch">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/switch.njk" %}
+      </div>
+      <span class="component-name">Switch</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/textarea">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/textarea.njk" %}
+      </div>
+      <span class="component-name">Textarea</span>
+    </wa-card>
+  </a>
+
+  <h2 class="index-category">Navigation</h2>
+  <a href="/docs/components/breadcrumb">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/breadcrumb.njk" %}
+      </div>
+      <span class="component-name">Breadcrumb</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/tab-group">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/tab-group.njk" %}
+      </div>
+      <span class="component-name">Tab Group</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/tree">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/tree.njk" %}
+      </div>
+      <span class="component-name">Tree</span>
+    </wa-card>
+  </a>
+
+  <h2 class="index-category">Organization</h2>
+  <a href="/docs/components/card">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/card.njk" %}
+      </div>
+      <span class="component-name">Card</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/details">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/details.njk" %}
+      </div>
+      <span class="component-name">Details</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/dialog">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/dialog.njk" %}
+      </div>
+      <span class="component-name">Dialog</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/divider">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/divider.njk" %}
+      </div>
+      <span class="component-name">Divider</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/drawer">
+    <wa-card id="drawer-card">
+      <div slot="header">
+        {% include "svgs/drawer.njk" %}
+      </div>
+      <span class="component-name">Drawer</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/split-panel">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/split-panel.njk" %}
+      </div>
+      <span class="component-name">Split Panel</span>
+    </wa-card>
+  </a>
+
+  <h2 class="index-category">Utilities</h2>
+  <a href="/docs/components/animation">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/animation.njk" %}
+      </div>
+      <span class="component-name">Animation</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/format-bytes">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/format-bytes.njk" %}
+      </div>
+      <span class="component-name">Format Bytes</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/format-date">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/format-date.njk" %}
+      </div>
+      <span class="component-name">Format Date</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/format-number">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/format-number.njk" %}
+      </div>
+      <span class="component-name">Format Number</span>
+    </wa-card>
+  </a>
+    <a href="/docs/components/include">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/include.njk" %}
+      </div>
+      <span class="component-name">Include</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/mutation-observer">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/mutation-observer.njk" %}
+      </div>
+      <span class="component-name">Mutation Observer</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/popup">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/popup.njk" %}
+      </div>
+      <span class="component-name">Popup</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/relative-time">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/relative-time.njk" %}
+      </div>
+      <span class="component-name">Relative Time</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/resize-observer">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/resize-observer.njk" %}
+      </div>
+      <span class="component-name">Resize Observer</span>
+    </wa-card>
+  </a>
+  <a href="/docs/components/visually-hidden">
+    <wa-card with-header>
+      <div slot="header">
+        {% include "svgs/visually-hidden.njk" %}
+      </div>
+      <span class="component-name">Visually Hidden</span>
+    </wa-card>
+  </a>
+</div>
\ No newline at end of file
diff --git a/src/themes/applied.css b/src/themes/applied.css
index e0a03a53c..dbef5b979 100644
--- a/src/themes/applied.css
+++ b/src/themes/applied.css
@@ -382,11 +382,10 @@ legend {
 }
 
 /* Images, videos, iframes, etc. */
-img:not(wa-card *),
-picture,
+img,
 svg,
+picture,
 video {
-  border-radius: var(--wa-border-radius-s);
   max-width: 100%;
   height: auto;
 }