The Collabase design system for apps: foundations, components, icons and tokens, with dark mode, themes and accessibility built in.
Collakit is the design system of Collabase. It gives developers who build apps for Collabase the same foundations, components, icons and design tokens that Collabase itself uses, so that an app looks and behaves like Collabase.
The repository on GitHub is public. The npm package @getcollabase/collakit is published in Q4 2026. Collakit is open source under the MIT licence.
Dark mode, themes, languages and accessibility are part of the components. An app does not rebuild them and follows the choices of each person and of the instance.
{"docsConfig":{"theme":"mint","$schema":"https://mintlify.com/docs.json","name":"Collabase","description":"Guides, administration and reference for Collabase, the collaboration platform from Switzerland: Docs, Projects, Test Management, Automation, Meetings and more.","colors":{"primary":"#0f4d38","light":"#ccfc75","dark":"#ccfc75"},"logo":{"light":"https://mintcdn.com/collabase-5ba5d338/j8uDSq0SfAexl3JI/images/logo-black.svg?fit=max\u0026auto=format\u0026n=j8uDSq0SfAexl3JI\u0026q=85\u0026s=22aa49d3e2d8036d080f1efb9ff9b531","dark":"https://mintcdn.com/collabase-5ba5d338/j8uDSq0SfAexl3JI/images/logo-white.svg?fit=max\u0026auto=format\u0026n=j8uDSq0SfAexl3JI\u0026q=85\u0026s=0487f394598030171c39de08c6f366b3"},"favicon":{"light":"https://mintcdn.com/collabase-5ba5d338/j8uDSq0SfAexl3JI/images/favicon-light.png?fit=max\u0026auto=format\u0026n=j8uDSq0SfAexl3JI\u0026q=85\u0026s=d37c20abb2f09323711170c227ce7086","dark":"https://mintcdn.com/collabase-5ba5d338/j8uDSq0SfAexl3JI/images/favicon-dark.png?fit=max\u0026auto=format\u0026n=j8uDSq0SfAexl3JI\u0026q=85\u0026s=92ae1ef55e741de8ad13e652a5519c2f"},"api":{"examples":{"prefill":true,"autogenerate":true},"url":"full","mdx":{"auth":{"method":"bearer"}}},"background":{"color":{"light":"#f7f7f7"}},"navbar":{"primary":{"type":"button","label":"Back to website","href":"https://collabase.ch"}},"search":{"prompt":"Search the documentation"},"seo":{"metatags":{"og:site_name":"Collabase documentation","twitter:card":"summary_large_image"},"organization":{"name":"Collabase","url":"https://collabase.ch"}},"fonts":{"heading":{"family":"Outfit","weight":500},"body":{"family":"Outfit","weight":400}},"icons":{"library":"lucide"},"styling":{"eyebrows":"breadcrumbs","codeblocks":"dark","latex":false},"integrations":{"ga4":{"measurementId":"G-9YS9SX848Y"},"cookies":{"key":"collabase-doku-messung","value":"erlaubt"}},"errors":{"404":{"redirect":false,"title":"Page not found","description":"This page does not exist or has moved. Search above, or [go to the documentation home](/)."}},"contextual":{"options":["copy","view","chatgpt","claude","perplexity","mcp","add-mcp","cursor","vscode"],"display":"header"},"thumbnails":{"preset":"headline","eyebrow":{"source":"tab"}},"interaction":{"drilldown":true},"metadata":{"timestamp":true},"markdown":{"schema":true,"instructions":["Collabase documentation. Interface labels are quoted in English, as they appear in the product.","Features marked Enterprise need the Collabase Enterprise Edition licence."]},"navigation":{"languages":[{"language":"en","footer":{"links":[{"header":"Collabase","items":[{"label":"Website","href":"https://collabase.ch"},{"label":"Download","href":"https://collabase.ch/en/download"},{"label":"Trust center","href":"https://collabase.ch/vertrauen"},{"label":"Support","href":"https://infometis.atlassian.net/servicedesk/customer/portal/1/group/81"}]}]},"navbar":{"primary":{"type":"button","label":"Back to website","href":"https://collabase.ch"}},"href":""}]}},"deployment":{"deploymentMetadataValue":{"subdomain":"collabase-5ba5d338","hasAudioNarration":false,"actualSubdomain":"collabase-5ba5d338","customDomains":["collabase.ch"],"gitSource":{"type":"github","owner":"collabase","repo":"docs","deployBranch":"main","contentDirectory":"","isPrivate":false,"mountPath":"","label":""},"chroma":{"collectionId":"3c48481f-443b-4103-9892-257afad28ca1","liveDeploymentHistoryId":"6adcccda3e0e90aa2af91745","schemaVersion":"v3","latestBuiltDeploymentHistoryId":"6adcccda3e0e90aa2af91745"},"feedback":{"thumbs":true,"edits":false,"issues":false},"entitlements":{"AI_CHAT":{"status":"DISABLED"}},"buildId":"6adfc1d2ad68c5d775db877e","clientVersion":"0.0.3971","searchFilterCounts":[{"language":"en","tag":"Apps","count":136},{"language":"en","tag":"API reference","count":106},{"language":"en","tag":"Automation","count":70},{"language":"en","tag":"Guides","count":54},{"language":"en","tag":"Meetings","count":52},{"language":"en","tag":"Administration","count":40},{"language":"en","tag":"Core concepts","count":23},{"language":"en","tag":"Projects","count":21},{"language":"en","tag":"Test Management","count":16},{"language":"en","tag":"HERMES project management","count":14}],"searchSettings":{"maxResults":6,"showContentSnippets":true}},"assistantConfig":{"enableAskAiButton":false,"enableStarterQuestions":false,"enableContextualStarterQuestions":false,"enableAskAiSearchBar":true},"basePath":"/docs","hasChatPermissions":false,"hasWebMcpPermissions":false,"toggles":[{"name":"kill-isr","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-mintlify-slack","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-v7-file-tree","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-integrations-settings","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-pr-grouping","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"custom-prefix","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"analytics-v7","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"user-flows-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"no-publish-flow","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-onboarding","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"llms-txt-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"pause-universal-search-reconcile","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving-live","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"stripTemperatureMiddleware","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"per-site-search-delta","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"support-platform-pylon-zendesk","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"instant-rollback","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications-server","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-private-page-search","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-fable","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fixed-ai-action-pricing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automation-resolve-merge-conflict","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"scoped-publishing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"mintql","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"page-level-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-version-history-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-nav-generations","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"billing-page-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workspace-projects","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"assistant-v5","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"byok-sep-25","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fork-pr-previews","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"revalidation-jwt","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"vite-origin","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-agent-model-picker","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-sso-scim","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"billing-updated-9-15","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-enabled","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"hobby-abuse-scan","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"dashboard-inbox","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-signup","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false}],"privacy":{"consentBanner":{"enabled":true}},"isAtlas":false,"googleFontsInlined":true},"customCss":[{"filePath":"style.css","content":"@keyframes home-float{0%,to{transform:translateY(0) rotate(var(--r))}50%{transform:translateY(-10px) rotate(calc(var(--r) + 2deg))}}:root{--brand-lime:#ccfc75;--brand-green:#77f355;--brand-mint:#1ae299;--brand-sage-1:#dfe9c0;--brand-sage-2:#c9dfae;--brand-sage-3:#b5d2a0;--brand-wald:#0f4d38;--page:#f7f7f7;--card-line:#e5e5e5;--card-hairline:rgb(0 0 0 / 0.06);--brand-ink-on-neon:#10200a;--brand-core-gradient:linear-gradient(90deg, #ccfc75, #77f355, #1ae299)}.brand-marker{background:var(--brand-sage-2);border-radius:.375rem;color:var(--brand-wald);padding:0 .35em}.dark .brand-marker{background:0 0;color:var(--brand-lime);padding:0}.brand-marker-action{background:var(--brand-lime);border-radius:.375rem;box-decoration-break:clone;-webkit-box-decoration-break:clone;color:var(--brand-ink-on-neon);padding:0 .3em}.brand-cards [data-component-part=card-icon]{align-items:center;background:var(--brand-sage-2);border-radius:.5rem;box-sizing:content-box;display:inline-flex;justify-content:center;padding:.4rem}.brand-cards [data-component-part=card-icon] svg{background-color:var(--brand-wald)!important}.dark .brand-cards [data-component-part=card-icon]{background:0 0;box-shadow:inset 0 0 0 1px rgb(204 252 117/.35)}.dark .brand-cards [data-component-part=card-icon] svg{background-color:var(--brand-lime)!important}.nav-tag-pill .nav-tag-pill-text,[data-badge][data-color=green]{background:var(--brand-sage-1);color:var(--brand-wald)}.dark .nav-tag-pill .nav-tag-pill-text{background:var(--brand-core-gradient);color:var(--brand-ink-on-neon)}#topbar-cta-button,#topbar-cta-button a,#topbar-cta-button span{color:var(--brand-ink-on-neon)!important}html[data-current-path=\"/\"] header#navbar,html[data-current-path=\"/de\"] header#navbar{backdrop-filter:blur(12px);background-color:rgb(255 255 255/.95)}html.dark[data-current-path=\"/\"] header#navbar,html.dark[data-current-path=\"/de\"] header#navbar{background-color:rgb(9 9 9/.8)}[data-badge][data-color=green]{border-color:var(--brand-sage-3)}.dark [data-badge][data-color=green]{background:var(--brand-lime);border-color:var(--brand-lime);color:var(--brand-ink-on-neon)}h1,h2,h3{letter-spacing:-.03em}body{letter-spacing:-.01em}.home-hero{overflow:hidden;position:relative}.home-title{color:#171717;font-size:2.5rem;font-weight:500;letter-spacing:-.03em;line-height:1.05}@media (min-width:1024px){.home-title{font-size:3.5rem}}.dark .home-title{color:#fafafa}.home-pill{background:#fff;border-radius:.5rem;box-shadow:0 0 0 1px var(--card-line);color:#404040;display:inline-block;font-size:.8125rem;font-weight:500;padding:.25rem .75rem}.dark .home-pill{background:rgb(255 255 255/.06);box-shadow:0 0 0 1px rgb(255 255 255/.12);color:#e5e5e5}.home-section-title{color:#171717;font-size:1.5rem;font-weight:500;letter-spacing:-.025em}.dark .home-section-title{color:#fafafa}.home-link:hover{color:var(--brand-wald)}.dark .home-link:hover{color:var(--brand-lime)}.home-cards .card,.home-search{background:#fff;border:1px solid var(--card-hairline);margin:6px;outline:1px solid var(--card-line);outline-offset:5px}.home-search{border-radius:.625rem;box-shadow:none;width:calc(100% - 12px)}.home-cards .card{border-radius:.875rem}.dark .home-cards .card,.dark .home-search{background:#171717;border-color:rgb(255 255 255/.08);outline-color:rgb(255 255 255/.12)}.home-cards .card{box-shadow:none}.home-cards .card:hover{border-color:var(--brand-sage-3)}.dark .home-cards .card:hover{border-color:rgb(204 252 117/.5)}.home-cards [data-component-part=card-icon]:not(.brand-cards *){background:0 0}.brand-cards [data-component-part=card-icon]{box-shadow:0 0 0 1px var(--brand-sage-3)}.home-cards{--home-gap:1.25rem}[data-component-part=card-title]{letter-spacing:-.01em}html body #banner{background:#0b0f0a;border-bottom:1px solid rgb(204 252 117/.3)}.home-bg,.home-dots{inset:0;position:absolute}.home-bg{pointer-events:none}.home-dots{background-image:radial-gradient(rgb(15 77 56/.18) 1px,transparent 1.5px);background-size:22px 22px;mask-image:radial-gradient(70% 90% at 50% 0,#000 30%,transparent 100%);-webkit-mask-image:radial-gradient(70% 90% at 50% 0,#000 30%,transparent 100%)}.dark .home-dots{background-image:radial-gradient(rgb(204 252 117/.16) 1px,transparent 1.5px)}.home-float{--r:0deg;animation:home-float 9s ease-in-out infinite;display:none;position:absolute;transform:rotate(var(--r))}.home-float img{border-radius:1.1rem;height:4.5rem;margin:0;width:4.5rem}@media (min-width:1100px){.home-float{display:block}}.home-float:nth-child(2){--r:-8deg;animation-delay:0s;left:6%;top:3rem}.home-float:nth-child(3){--r:6deg;animation-delay:-2s;left:15%;top:11rem}.home-float:nth-child(4){--r:-4deg;animation-delay:-4s;left:4%;top:18rem}.home-float:nth-child(5){--r:8deg;animation-delay:-1s;right:6%;top:4rem}.home-float:nth-child(6){--r:-6deg;animation-delay:-3s;right:15%;top:12rem}.home-float:nth-child(7){--r:5deg;animation-delay:-5s;right:4%;top:19rem}.home-float:nth-child(8){--r:-3deg;animation-delay:-6s;left:14%;top:24rem}@media (prefers-reduced-motion:reduce){.home-float{animation:none}}"}],"page":{"pagePath":"developer/collakit","slug":"/developer/collakit","pageMetadata":{"title":"Collakit","sidebarTitle":"Collakit","icon":"package","description":"The Collabase design system for apps: foundations, components, icons and tokens, with dark mode, themes and accessibility built in.","href":"/developer/collakit"},"description":{"compiledSource":"\"use strict\";\nconst {jsx: _jsx} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = {\n p: \"p\",\n ..._provideComponents(),\n ...props.components\n };\n return _jsx(_components.p, {\n children: \"The Collabase design system for apps: foundations, components, icons and tokens, with dark mode, themes and accessibility built in.\"\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = {\n ..._provideComponents(),\n ...props.components\n };\n return MDXLayout ? _jsx(MDXLayout, {\n ...props,\n children: _jsx(_createMdxContent, {\n ...props\n })\n }) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\n","frontmatter":{},"scope":{}},"pageType":"default","mdx":{"mdxSource":{"compiledSource":"\"use strict\";const{Fragment:_Fragment,jsx:_jsx,jsxs:_jsxs}=arguments[0];const{useMDXComponents:_provideComponents}=arguments[0];function _createMdxContent(props){const _components={a:`a`,code:`code`,li:`li`,p:`p`,strong:`strong`,tbody:`tbody`,td:`td`,th:`th`,thead:`thead`,tr:`tr`,ul:`ul`,..._provideComponents(),...props.components},{Heading,Note,Table}=_components;if(!Heading)_missingMdxReference(`Heading`,true);if(!Note)_missingMdxReference(`Note`,true);if(!Table)_missingMdxReference(`Table`,true);return _jsxs(_Fragment,{children:[_jsx(_components.p,{children:`Collakit is the design system of Collabase. It gives developers who build apps for Collabase the same foundations, components, icons and design tokens that Collabase itself uses, so that an app looks and behaves like Collabase.`}),`\n`,_jsx(Note,{children:_jsxs(_components.p,{children:[`The repository on GitHub is public. The npm package `,_jsx(_components.code,{children:`@getcollabase/collakit`}),` is published in `,_jsx(_components.strong,{children:`Q4 2026`}),`. Collakit is open source under the MIT licence.`]})}),`\n`,_jsx(Heading,{level:`2`,id:`what-it-contains`,children:`What it contains`}),`\n`,_jsxs(Table,{children:[_jsx(_components.thead,{children:_jsxs(_components.tr,{children:[_jsx(_components.th,{children:`Part`}),_jsx(_components.th,{children:`Content`})]})}),_jsxs(_components.tbody,{children:[_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.strong,{children:`Foundations`})}),_jsx(_components.td,{children:`Colour, iconography, emoji graphics, typography, AI patterns, special design and tokens.`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.strong,{children:`Components`})}),_jsx(_components.td,{children:`The building blocks of the interface.`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.strong,{children:`Icons`})}),_jsx(_components.td,{children:`The icon set of Collabase.`})]}),_jsxs(_components.tr,{children:[_jsx(_components.td,{children:_jsx(_components.strong,{children:`Tokens`})}),_jsx(_components.td,{children:`One source of design tokens. The core of Collabase, the apps and the website read the same tokens.`})]})]})]}),`\n`,_jsx(Heading,{level:`2`,id:`what-you-get-without-extra-work`,children:`What you get without extra work`}),`\n`,_jsx(_components.p,{children:`Dark mode, themes, languages and accessibility are part of the components. An app does not rebuild them and follows the choices of each person and of the instance.`}),`\n`,_jsx(Heading,{level:`2`,id:`related`,children:`Related`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsx(_components.li,{children:_jsx(_components.a,{href:`/developer/overview`,children:`Developers`})}),`\n`,_jsx(_components.li,{children:_jsx(_components.a,{href:`/developer/app-sdk`,children:`App SDK`})}),`\n`,_jsx(_components.li,{children:_jsx(_components.a,{href:`https://collabase.ch/platform/developers/collakit`,children:`The page on the website`})}),`\n`]})]})}function MDXContent(props={}){const{wrapper:MDXLayout}={..._provideComponents(),...props.components};return MDXLayout?_jsx(MDXLayout,{...props,children:_jsx(_createMdxContent,{...props})}):_createMdxContent(props)}return{default:MDXContent};function _missingMdxReference(id,component){throw new Error(`Expected `+(component?`component`:`object`)+\" `\"+id+\"` to be defined: you likely forgot to import, pass, or provide it.\")}","frontmatter":{},"scope":{"codeStyling":"dark","config":{},"pageMetadata":{"title":"Collakit","sidebarTitle":"Collakit","icon":"package","description":"The Collabase design system for apps: foundations, components, icons and tokens, with dark mode, themes and accessibility built in.","href":"/developer/collakit"}}},"mdxSourceWithNoJs":null},"mdxExtracts":{"tableOfContents":[{"title":"What it contains","slug":"what-it-contains","depth":2,"children":[]},{"title":"What you get without extra work","slug":"what-you-get-without-extra-work","depth":2,"children":[]},{"title":"Related","slug":"related","depth":2,"children":[]}],"codeExamples":{}},"jsLinks":[],"subdomain":"collabase-5ba5d338","siteName":"Collabase","title":"Collakit - Collabase","navMaps":{"firstHrefInVersion":{},"firstHrefInLanguage":{"en":{"href":"/developer/collakit","matchLevel":0}}},"lastModified":"2026-10-26T21:10:55.445Z","gitLastModified":"2026-10-26T21:10:38.000Z","originalFileLocation":"developer/collakit.mdx","locale":"en"},"headHtml":"\u003cscript data-mint-head>(function(){var d=document.documentElement,p=null;if(!p){try{p=localStorage.getItem(\"isDarkMode\")}catch(e){}if(p==='true')p='dark';else if(p==='false')p='light';if(p!=='light'\u0026\u0026p!=='dark'\u0026\u0026p!=='system')p=\"system\"}var r=p==='system'?(matchMedia(\"(prefers-color-scheme: dark)\").matches?'dark':'light'):p;d.classList.remove(r==='dark'?'light':'dark');d.classList.add(r);d.setAttribute(\"data-theme-preference\",p)})();\u003c/script>\u003cmeta data-mint-head name=\"description\" content=\"The Collabase design system for apps: foundations, components, icons and tokens, with dark mode, themes and accessibility built in.\">\u003cmeta data-mint-head name=\"application-name\" content=\"Collabase\">\u003cmeta data-mint-head name=\"generator\" content=\"Mintlify\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/docs/mintlify-assets/_mintlify/favicons/collabase-5ba5d338/gB0h8fOyOzfM50Et/_generated/favicon/android-chrome-192x192.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"apple-touch-icon\" type=\"image/png\" sizes=\"180x180\" href=\"/docs/mintlify-assets/_mintlify/favicons/collabase-5ba5d338/gB0h8fOyOzfM50Et/_generated/favicon/apple-touch-icon.png\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/docs/mintlify-assets/_mintlify/favicons/collabase-5ba5d338/gB0h8fOyOzfM50Et/_generated/favicon/favicon-16x16.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/docs/mintlify-assets/_mintlify/favicons/collabase-5ba5d338/gB0h8fOyOzfM50Et/_generated/favicon/favicon-32x32.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/docs/mintlify-assets/_mintlify/favicons/collabase-5ba5d338/gB0h8fOyOzfM50Et/_generated/favicon/favicon.ico\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/docs/mintlify-assets/_mintlify/favicons/collabase-5ba5d338/gB0h8fOyOzfM50Et/_generated/favicon-dark/android-chrome-192x192.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/docs/mintlify-assets/_mintlify/favicons/collabase-5ba5d338/gB0h8fOyOzfM50Et/_generated/favicon-dark/favicon-16x16.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/docs/mintlify-assets/_mintlify/favicons/collabase-5ba5d338/gB0h8fOyOzfM50Et/_generated/favicon-dark/favicon-32x32.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/docs/mintlify-assets/_mintlify/favicons/collabase-5ba5d338/gB0h8fOyOzfM50Et/_generated/favicon-dark/favicon.ico\" media=\"(prefers-color-scheme: dark)\">\u003cmeta data-mint-head property=\"og:title\" content=\"Collakit - Collabase\">\u003cmeta data-mint-head property=\"og:description\" content=\"The Collabase design system for apps: foundations, components, icons and tokens, with dark mode, themes and accessibility built in.\">\u003cmeta data-mint-head property=\"og:site_name\" content=\"Collabase documentation\">\u003cmeta data-mint-head property=\"og:url\" content=\"https://collabase.ch/docs/developer/collakit\">\u003cmeta data-mint-head property=\"og:type\" content=\"website\">\u003cmeta data-mint-head property=\"og:image\" content=\"https://collabase-5ba5d338.mintlify.app/_mintlify/api/og/v2?division=Developers\u0026amp;title=Collakit\u0026amp;description=The+Collabase+design+system+for+apps%3A+foundations%2C+components%2C+icons+and+tokens%2C+with+dark+mode%2C+themes+and+accessibility+built+in.\u0026amp;theme=9b75927d6034ee3ce45ec503\u0026amp;signature=34a0dea50c4ac662072027f59d6b00b82b96b83675ff8d6b7366866073496e57\">\u003cmeta data-mint-head property=\"og:image:width\" content=\"1200\">\u003cmeta data-mint-head property=\"og:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"twitter:card\" content=\"summary_large_image\">\u003cmeta data-mint-head name=\"twitter:title\" content=\"Collakit - Collabase\">\u003cmeta data-mint-head name=\"twitter:description\" content=\"The Collabase design system for apps: foundations, components, icons and tokens, with dark mode, themes and accessibility built in.\">\u003cmeta data-mint-head name=\"twitter:image\" content=\"https://collabase-5ba5d338.mintlify.app/_mintlify/api/og/v2?division=Developers\u0026amp;title=Collakit\u0026amp;description=The+Collabase+design+system+for+apps%3A+foundations%2C+components%2C+icons+and+tokens%2C+with+dark+mode%2C+themes+and+accessibility+built+in.\u0026amp;theme=9b75927d6034ee3ce45ec503\u0026amp;signature=34a0dea50c4ac662072027f59d6b00b82b96b83675ff8d6b7366866073496e57\">\u003cmeta data-mint-head name=\"twitter:image:width\" content=\"1200\">\u003cmeta data-mint-head name=\"twitter:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"msapplication-config\" content=\"/docs/mintlify-assets/_mintlify/favicons/collabase-5ba5d338/gB0h8fOyOzfM50Et/_generated/favicon/browserconfig.xml\">\u003cmeta data-mint-head name=\"apple-mobile-web-app-title\" content=\"Collabase\">\u003cmeta data-mint-head name=\"msapplication-TileColor\" content=\"#0f4d38\">\u003clink data-mint-head rel=\"canonical\" href=\"https://collabase.ch/docs/developer/collakit\">\u003clink data-mint-head rel=\"alternate\" type=\"application/xml\" href=\"/docs/sitemap.xml\">\u003clink data-mint-head rel=\"alternate\" type=\"text/markdown\" href=\"/docs/developer/collakit.md\">\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https://collabase.ch/#organization\",\"name\":\"Collabase\",\"url\":\"https://collabase.ch\",\"logo\":{\"@type\":\"ImageObject\",\"url\":\"https://mintcdn.com/collabase-5ba5d338/j8uDSq0SfAexl3JI/images/logo-black.svg?fit=max\u0026auto=format\u0026n=j8uDSq0SfAexl3JI\u0026q=85\u0026s=22aa49d3e2d8036d080f1efb9ff9b531\"}},{\"@type\":\"WebSite\",\"@id\":\"https://collabase.ch/docs#website\",\"name\":\"Collabase\",\"url\":\"https://collabase.ch/docs\",\"publisher\":{\"@id\":\"https://collabase.ch/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https://collabase.ch/docs/developer/collakit#webpage\",\"url\":\"https://collabase.ch/docs/developer/collakit\",\"name\":\"Collakit\",\"description\":\"The Collabase design system for apps: foundations, components, icons and tokens, with dark mode, themes and accessibility built in.\",\"dateModified\":\"2026-10-26T21:10:38.000Z\",\"isPartOf\":{\"@id\":\"https://collabase.ch/docs#website\"},\"breadcrumb\":{\"@id\":\"https://collabase.ch/docs/developer/collakit#breadcrumb\"}},{\"@type\":\"BreadcrumbList\",\"@id\":\"https://collabase.ch/docs/developer/collakit#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Developers\",\"item\":\"https://collabase.ch/docs/developer/overview\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Collakit\",\"item\":\"https://collabase.ch/docs/developer/collakit\"}]},{\"@type\":[\"Article\",\"TechArticle\"],\"@id\":\"https://collabase.ch/docs/developer/collakit#article\",\"headline\":\"Collakit\",\"name\":\"Collakit\",\"description\":\"The Collabase design system for apps: foundations, components, icons and tokens, with dark mode, themes and accessibility built in.\",\"url\":\"https://collabase.ch/docs/developer/collakit\",\"mainEntityOfPage\":{\"@id\":\"https://collabase.ch/docs/developer/collakit#webpage\"},\"dateModified\":\"2026-10-26T21:10:38.000Z\",\"publisher\":{\"@id\":\"https://collabase.ch/#organization\"},\"isPartOf\":{\"@id\":\"https://collabase.ch/docs#website\"}}]}\u003c/script>\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@type\":\"WebSite\",\"name\":\"Collabase\",\"creator\":{\"@type\":\"Organization\",\"name\":\"Mintlify\",\"url\":\"https://mintlify.com\"}}\u003c/script>","siteName":"Collabase","nav":{"global":null,"languages":[{"language":"en","footer":{"links":[{"header":"Collabase","items":[{"label":"Website","href":"https://collabase.ch"},{"label":"Download","href":"https://collabase.ch/en/download"},{"label":"Trust center","href":"https://collabase.ch/vertrauen"},{"label":"Support","href":"https://infometis.atlassian.net/servicedesk/customer/portal/1/group/81"}]}]},"navbar":{"primary":{"type":"button","label":"Back to website","href":"https://collabase.ch"}},"tabs":[{"tab":"Guides","icon":"book-open","pages":[{"title":"Guides","href":""}]},{"tab":"Apps","icon":"layout-grid","pages":[{"title":"Apps","href":"/docs/overview"}]},{"tab":"Administration","icon":"settings","pages":[{"title":"Administration","href":"/installation"}]},{"tab":"Automation","icon":"workflow","pages":[{"title":"Automation","href":"/automation/overview"}]},{"tab":"Developers","icon":"code-xml","groups":[{"group":"Developers","icon":"code-xml","pages":[{"title":"Developers","sidebarTitle":"Overview","icon":"code-xml","href":"/developer/overview"},{"title":"App SDK","sidebarTitle":"App SDK","icon":"app-window","description":"Build your own apps for Collabase in TypeScript and React: what an app can add, how it stays safe and when the App SDK is published.","href":"/developer/app-sdk"},{"title":"Collakit","sidebarTitle":"Collakit","icon":"package","href":"/developer/collakit"},{"title":"Collabase MCP","sidebarTitle":"MCP","icon":"plug","description":"Connect Claude, ChatGPT, Cursor or any MCP client to Collabase: what agents can do, how they sign in and what administrators control.","href":"/developer/mcp"},{"title":"Plug SDK","sidebarTitle":"Plug SDK","icon":"blocks","href":"/developer/plug-sdk"},{"title":"AgentKit","sidebarTitle":"AgentKit","icon":"bot","href":"/developer/agentkit"}]}]},{"tab":"API reference","icon":"code","pages":[{"title":"API reference","href":"/api/introduction"}]},{"tab":"Release notes","icon":"list","pages":[{"title":"Release notes","href":"/changelog/overview"}]}]}]},"title":"Collakit - Collabase","buildId":"dpl_GvhK4qVXq51DpfYJLCtPpYNN4YHN","deploymentId":"dpl_GvhK4qVXq51DpfYJLCtPpYNN4YHN","dynamics":[],"chunks":[]}