Documentation
What is Kakadu Play?
Play is a step-by-step guidance tool from Kakadu. It helps you create visual guides that make digital tasks easy to learn, repeat, and master.
Kakadu is a Norwegian software company based in Stavanger, focused on improving customer experiences.
Embedding Plays
Plays can be embedded on your website with an iframe. An embedded Kakadu Play iframe will look something like this:
<iframe src="https://play.kakadu.no/embed/bankid/id-kontroll-med-pass-som-metode/4491d2fa-cac3-4647-b6f5-4251bcbd79f9" loading="lazy" width="100%" height="580px" frameborder="0" scrolling="no"></iframe>iframe looks like this.Embed code
When you’re logged into the Kakadu Play dashboard, you can copy the embed code for any Play. Or paste a Play URL below to generate one:
<iframe src="https://play.kakadu.no/embed/bankid/id-kontroll-med-pass-som-metode/4491d2fa-cac3-4647-b6f5-4251bcbd79f9" loading="lazy" width="100%" height="580px" frameborder="0" scrolling="no"></iframe>Colors and theme
By default, buttons in the Kakadu Play embeds are Kakadu green™. If you want to change this color to better fit your brand, you can append a query parameter button-color with a URL-encoded 6-character hex color value. For example %235994ce, where %23 is the encoded hash sign.
Embeds follow the current color scheme by default. To lock an embed to light or dark mode, add a theme query parameter to the URL set to light or dark.
You can use the fields below to generate an embed code with a custom button color and theme.
<iframe src="https://play.kakadu.no/embed/bankid/id-kontroll-med-pass-som-metode/4491d2fa-cac3-4647-b6f5-4251bcbd79f9" loading="lazy" width="100%" height="580px" frameborder="0" scrolling="no"></iframe>The embed looks something like this:
Whitelisting domains
If your website uses a Content Security Policy (CSP), allow play.kakadu.no in frame-src (or child-src) so the Play iframe can load.
Content-Security-Policy: frame-src https://play.kakadu.no;If you also use a firewall or other network allowlists, whitelist both play.kakadu.no and components.kakadu.no. The embed loads resources from both domains, and without them it may fail to load or render incorrectly.
Upgrading from Kolibri
What used to be called Kolibri is now Kakadu Play. Upgrading is simple, and can cut load times by up to 90% and download size by up to 60%.
Your old embed code should look something like the one below, although the URL will be different.
<iframe src="https://www.kakadu.no/bankid/id-kontroll-med-pass-som-metode/embed" loading="lazy" width="100%" height="580px" frameborder="0" scrolling="no"></iframe>To upgrade the embed code, copy the URL within the src attribute, and paste it in the input field below. For the above embed code, the URL you should copy looks like this: https://www.kakadu.no/bankid/id-kontroll-med-pass-som-metode/embed
<iframe src="https://play.kakadu.no/embed/bankid/id-kontroll-med-pass-som-metode/4491d2fa-cac3-4647-b6f5-4251bcbd79f9" loading="lazy" width="100%" height="580px" frameborder="0" scrolling="no"></iframe>Simply replace your old embed code, and you’re done!