Visual editors are a great way to allow your customers to interact with your product in an interactive and intuitive manner.But building a visual editor - whether its a simple form builder or a full blown no-code editor is difficult and consumes a lot of time and engineering resources.Embeds are ready-made whitelabel visual editors that handles all the difficult parts including handling drag-n-drop experiences, document versioning, realtime collaboration and more. It’s also highly customisable so you could bring your own UI components and business logic.
{"docsConfig":{"$schema":"https://mintlify.com/docs.json","theme":"mint","name":"Mirin","colors":{"primary":"#4f94e8","light":"#4f94e8","dark":"#4f94e8"},"favicon":"/favicon.svg","logo":{"light":"https://mintcdn.com/mirin/AZtcUx0J-u80CDv1/logo/light.svg?fit=max\u0026auto=format\u0026n=AZtcUx0J-u80CDv1\u0026q=85\u0026s=7829d12d520ede589ad4187a13aa8a76","dark":"https://mintcdn.com/mirin/AZtcUx0J-u80CDv1/logo/light.svg?fit=max\u0026auto=format\u0026n=AZtcUx0J-u80CDv1\u0026q=85\u0026s=7829d12d520ede589ad4187a13aa8a76"},"navbar":{"links":[{"label":"Support","href":"mailto:[email protected]"}],"primary":{"type":"button","label":"Go to app","href":"https://mirin.app"}},"footer":{"socials":{"x":"https://x.com/prevwong","github":"https://github.com/mirinhq","linkedin":"https://linkedin.com/company/mirinhq"}},"fonts":{"heading":{"family":"Inter","weight":400},"body":{"family":"Inter","weight":400}},"navigation":{"pages":[]}},"deployment":{"deploymentMetadataValue":{"subdomain":"mirin","hasAudioNarration":false,"actualSubdomain":"mirin","customDomains":["docs.mirin.app"],"gitSource":{"type":"github","owner":"mirinhq","repo":"docs","deployBranch":"main","contentDirectory":"","isPrivate":false,"mountPath":"","label":""},"chroma":{"liveDeploymentHistoryId":"6a20c6039ed471492517f2c9","collectionId":"9beb1ee3-1f81-4f59-8cbe-fde905d4c92b","schemaVersion":"v2"},"entitlements":{},"buildId":"6a20c6039ed471492517f2c9:success","clientVersion":"0.0.3879","searchFilterCounts":[{"language":"default","tag":"Embeds","count":6}]},"assistantConfig":{},"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":"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":"editor-branches-v2-autocommit","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-branches-v2","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":"teamspace","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":"vite-origin","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":"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":"revalidation-jwt","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":"client-snapshot-docs-config","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}],"isAtlas":false,"googleFontsInlined":false},"customCss":[{"filePath":"style.css","content":"h1,h2,h3,h4,h5,h6{font-weight:400!important}"}],"page":{"pagePath":"introduction","slug":"/introduction","pageMetadata":{"title":"Introduction","description":null,"href":"/introduction"},"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={p:`p`,..._provideComponents(),...props.components},{Heading}=_components;if(!Heading)_missingMdxReference(`Heading`,true);return _jsxs(_Fragment,{children:[_jsx(_components.p,{children:`Mirin Embeds are customisable visual editors that can be integrated into your product to create interactive user experiences for your customers.`}),`\n`,_jsx(Heading,{level:`2`,id:`why`,children:`Why?`}),`\n`,_jsx(_components.p,{children:`Visual editors are a great way to allow your customers to interact with your product in an interactive and intuitive manner.`}),`\n`,_jsx(_components.p,{children:`But building a visual editor - whether its a simple form builder or a full blown no-code editor is difficult and consumes a lot of time and engineering resources.`}),`\n`,_jsx(_components.p,{children:`Embeds are ready-made whitelabel visual editors that handles all the difficult parts including handling drag-n-drop experiences, document versioning, realtime collaboration and more. It’s also highly customisable so you could bring your own UI components and business logic.`})]})}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":{"config":{},"pageMetadata":{"title":"Introduction","description":null,"href":"/introduction"}}},"mdxSourceWithNoJs":null},"mdxExtracts":{"tableOfContents":[{"title":"Why?","slug":"why","depth":2,"children":[]}],"codeExamples":{}},"jsLinks":[],"subdomain":"mirin","siteName":"Mirin","title":"Introduction - Mirin","navMaps":{"firstHrefInVersion":{},"firstHrefInLanguage":{}},"lastModified":"2026-01-07T04:04:08.960Z","originalFileLocation":"introduction.mdx"},"headHtml":"\u003cmeta data-mint-head name=\"application-name\" content=\"Mirin\">\u003cmeta data-mint-head name=\"generator\" content=\"Mintlify\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/mintlify-assets/_mintlify/favicons/mirin/L5xMhPeWirWMIrM-/_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=\"/mintlify-assets/_mintlify/favicons/mirin/L5xMhPeWirWMIrM-/_generated/favicon/apple-touch-icon.png\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/mintlify-assets/_mintlify/favicons/mirin/L5xMhPeWirWMIrM-/_generated/favicon/favicon-16x16.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/mintlify-assets/_mintlify/favicons/mirin/L5xMhPeWirWMIrM-/_generated/favicon/favicon-32x32.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/mintlify-assets/_mintlify/favicons/mirin/L5xMhPeWirWMIrM-/_generated/favicon/favicon.ico\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/mintlify-assets/_mintlify/favicons/mirin/L5xMhPeWirWMIrM-/_generated/favicon-dark/android-chrome-192x192.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/mintlify-assets/_mintlify/favicons/mirin/L5xMhPeWirWMIrM-/_generated/favicon-dark/favicon-16x16.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/mintlify-assets/_mintlify/favicons/mirin/L5xMhPeWirWMIrM-/_generated/favicon-dark/favicon-32x32.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/mintlify-assets/_mintlify/favicons/mirin/L5xMhPeWirWMIrM-/_generated/favicon-dark/favicon.ico\" media=\"(prefers-color-scheme: dark)\">\u003cmeta data-mint-head property=\"og:title\" content=\"Introduction - Mirin\">\u003cmeta data-mint-head property=\"og:site_name\" content=\"Mirin\">\u003cmeta data-mint-head property=\"og:url\" content=\"https://docs.mirin.app/introduction\">\u003cmeta data-mint-head property=\"og:type\" content=\"website\">\u003cmeta data-mint-head name=\"twitter:card\" content=\"summary_large_image\">\u003cmeta data-mint-head name=\"twitter:title\" content=\"Introduction - Mirin\">\u003cmeta data-mint-head name=\"msapplication-config\" content=\"/mintlify-assets/_mintlify/favicons/mirin/L5xMhPeWirWMIrM-/_generated/favicon/browserconfig.xml\">\u003cmeta data-mint-head name=\"apple-mobile-web-app-title\" content=\"Mirin\">\u003cmeta data-mint-head name=\"msapplication-TileColor\" content=\"#4f94e8\">\u003clink data-mint-head rel=\"canonical\" href=\"https://docs.mirin.app/introduction\">\u003clink data-mint-head rel=\"alternate\" type=\"application/xml\" href=\"/sitemap.xml\">\u003clink data-mint-head rel=\"alternate\" type=\"text/markdown\" href=\"/introduction.md\">\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https://docs.mirin.app/#organization\",\"name\":\"Mirin\",\"url\":\"https://docs.mirin.app\",\"logo\":{\"@type\":\"ImageObject\",\"url\":\"https://mintcdn.com/mirin/AZtcUx0J-u80CDv1/logo/light.svg?fit=max\u0026auto=format\u0026n=AZtcUx0J-u80CDv1\u0026q=85\u0026s=7829d12d520ede589ad4187a13aa8a76\"}},{\"@type\":\"WebSite\",\"@id\":\"https://docs.mirin.app#website\",\"name\":\"Mirin\",\"url\":\"https://docs.mirin.app\",\"publisher\":{\"@id\":\"https://docs.mirin.app/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https://docs.mirin.app/introduction#webpage\",\"url\":\"https://docs.mirin.app/introduction\",\"name\":\"Introduction\",\"dateModified\":\"2026-01-07T04:04:08.960Z\",\"isPartOf\":{\"@id\":\"https://docs.mirin.app#website\"},\"breadcrumb\":{\"@id\":\"https://docs.mirin.app/introduction#breadcrumb\"}},{\"@type\":\"BreadcrumbList\",\"@id\":\"https://docs.mirin.app/introduction#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Mirin\",\"item\":\"https://docs.mirin.app\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Introduction\",\"item\":\"https://docs.mirin.app/introduction\"}]},{\"@type\":[\"Article\",\"TechArticle\"],\"@id\":\"https://docs.mirin.app/introduction#article\",\"headline\":\"Introduction\",\"name\":\"Introduction\",\"url\":\"https://docs.mirin.app/introduction\",\"mainEntityOfPage\":{\"@id\":\"https://docs.mirin.app/introduction#webpage\"},\"dateModified\":\"2026-01-07T04:04:08.960Z\",\"publisher\":{\"@id\":\"https://docs.mirin.app/#organization\"},\"isPartOf\":{\"@id\":\"https://docs.mirin.app#website\"}}]}\u003c/script>\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@type\":\"WebSite\",\"name\":\"Mirin\",\"creator\":{\"@type\":\"Organization\",\"name\":\"Mintlify\",\"url\":\"https://mintlify.com\"}}\u003c/script>","siteName":"Mirin","nav":{"global":null,"groups":[{"group":"Embeds","pages":[{"title":"Introduction","href":"/introduction"},{"title":"Setup","description":"Build your own visual editor in 5 minutes","href":"/quickstart"},{"title":"Customisation","href":"/embeds/customisation"},{"title":"Import your components","href":"/embeds/components"},{"title":"Publishing","href":"/embeds/publishing"},{"title":"Custom Session Endpoint","href":"/embeds/custom-endpoint"}]}]},"title":"Introduction - Mirin","buildId":"dpl_5UGCeHaPhSKbAExsKaHeR8dW3HyG","deploymentId":"dpl_5UGCeHaPhSKbAExsKaHeR8dW3HyG","dynamics":[],"chunks":[]}