Live demo — powered by @hiloop/elements

Interaction cards

All 11 interaction types — embed any of these in your own application with a single script tag.

Read the embed SDK docs →

One script tag, all interaction types

<link rel="stylesheet" href="https://cdn.hiloop.ai/elements/hiloop-elements.css">
<script type="module" src="https://cdn.hiloop.ai/elements/hiloop-elements.js"></script>

<!-- Works in any HTML page -->
<hiloop-approval-card
  agent-name="OpsBot"
  title="Deploy v3.0 to production?"
  options='["Deploy now","Schedule","Cancel"]'
  priority="high"
  deadline-at="2026-03-01T10:00:00Z">
</hiloop-approval-card>

<script>
  document.querySelector("hiloop-approval-card")
    .addEventListener("respond", (e) => console.log(e.detail));
</script>