Skip to main content
Tako API responses contain one or more knowledge_cards that can be embedded in your application. Each knowledge_card entry includes:
embed_url: An iframe URL for embedding the interactive card
image_url: A link to a static image of the card

​
Dynamic Sizing

Tako Knowledge Cards vary in size. Some interactive elements will change the card’s dimensions. The iframe emits a resize event when the card is resized, allowing you to adjust the size in your application. 
<iframe 
  width="100%" 
  src="https://trytako.com/embed/mA-C6b48zxyU3G33JJdO/" 
  scrolling="no" 
  frameborder="0"
></iframe>

<script type="text/javascript">
!function() {
  "use strict";
  window.addEventListener("message", function(e) {
    const d = e.data;
    if (d.type !== "tako::resize") return;
    
    for (let iframe of document.querySelectorAll("iframe")) {
      if (iframe.contentWindow !== e.source) continue;
      iframe.style.height = d.height + "px";
    }
  });
}();
</script>
Static Images
For cases where you need a static representation, you can use the image_url to download and embed a static image of the card in your application.

​
Switch between dark and light mode

You can make your card dark themed by adding ?dark_mode=true or light mode by explicitly adding ?dark_mode=false to the embed url

​
dark_mode=true

<iframe 
  width="100%" 
  src="https://trytako.com/embed/LMAyfrgePzxzYylx9pqZ/?dark_mode=true" 
  scrolling="no" 
  frameborder="0"
></iframe>

​
dark_mode=false

<iframe 
  width="100%" 
  src="https://trytako.com/embed/LMAyfrgePzxzYylx9pqZ/?dark_mode=false" 
  scrolling="no" 
  frameborder="0"
></iframe>

​
Customizing Tako

Tako Enterprise users can use our theme builder to customize the fonts, spacing and colors of Tako visualizations. This allows you to achieve a look consistent with your brand identity.

Tako Card With Custom Fonts


Enterprise users can also add their logo and shrink the Tako logo:

Tako Card With Co-Branded Logo


⌘I