A comprehensive development kit for building web plugins and desktop applications that extend Miro's collaborative whiteboarding capabilities.
Install & Download
1. ClawHub CLI
The fastest way to install a skill directly from the registry.
npx clawhub@latest install miro-sdk
2. Manual Installation
Copy the skill folder to one of these locations
~/.openclaw/skills/ <project>/skills/ Priority: Workspace > Local > Bundled
3. Prompt Installation
Copy this prompt to OpenClaw to install it automatically.
Help me install miro-sdk using Clawhub. If Clawhub is not installed, install it first (npm i -g clawhub).
Prefer to download?
Get the raw skill files in a ZIP archive.
What is Miro Web SDK?
The Miro Web SDK is a powerful framework designed for developers to create custom tools, automate complex workflows, and integrate external data sources directly into the Miro ecosystem. By leveraging this toolset within Openclaw Skills, developers can build everything from simple utility plugins to complex desktop applications using TypeScript or JavaScript. The SDK provides deep access to Miro boards, allowing for real-time manipulation of items like shapes, sticky notes, and connectors, while ensuring seamless synchronization across multiple users.
This SDK is essential for teams looking to tailor their digital workspace. It provides a robust set of APIs to handle everything from user authentication via implicit flow to complex viewport manipulations and event-driven architectures. Whether you are building for the browser or a standalone desktop environment, this skill ensures you have the technical foundation to scale your Miro integrations effectively.
Miro Web SDK Use Cases
- Automating the creation of project diagrams and flowcharts based on external data sources.
- Developing custom UI panels and modal dialogs to enhance the user experience within Miro.
- Synchronizing Miro board content with external project management tools or databases for real-time updates.
- Creating interactive workshops with custom keyboard shortcuts and automated item styling.
- Building standalone desktop applications for macOS, Windows, and Linux using the Electron-based SDK.
How Miro Web SDK Works
- Initialize the plugin environment using the Miro CLI to scaffold a new project structure with all necessary dependencies.
- Define the required permission scopes in the manifest file to grant the plugin access to board data or user identity information.
- Utilize the SDK's onReady event to establish a secure connection between the plugin code and the active Miro board instance.
- Implement specific event listeners to react to real-time user actions such as item creation, selection changes, or board updates.
- Execute programmatic API calls to create, move, resize, or modify board items and their properties.
- Deploy the finished plugin as a web extension or compile it into a desktop application for distribution.
Miro Web SDK Setup
To begin using this skill with Openclaw Skills, first install the necessary CLI and SDK packages via npm:
npm install @mirohq/websdk-cli @mirohq/miro-webplugin
Next, scaffold your plugin project and start the development server:
npm create @mirohq/websdk-cli my-plugin
cd my-plugin
npm start
Ensure your manifest.json includes the required scopes such as board:read and board:write to enable full board interaction.
Miro Web SDK Data Schema & Taxonomy
The Miro SDK organizes board data and plugin metadata through a structured taxonomy:
| Data Component | Description |
|---|---|
| Board Metadata | Contains core info including board name, owner details, and size metrics. |
| Item Objects | Individual entities like shapes, sticky notes, and frames, each with unique IDs and coordinate properties. |
| Custom Properties | Plugin-specific metadata stored at the item level for persistent data management. |
| Event Payloads | JSON objects containing real-time data for actions like item:create, item:update, or selection:change. |
| Scopes | Configuration settings defining the plugin's read/write permissions. |
Miro Web SDK Advanced Features
- Batch operations for high-performance bulk creation and updating of board items without UI lag.
- Viewport and zoom control to programmatically guide users through specific board areas or presentations.
- Real-time collaboration features including user presence indicators and shared selection syncing.
- Animation support for creating smooth transitions and interactive visual elements on the canvas.
- Integrated notification systems and custom context menus to provide a native user experience within Openclaw Skills.
SKILL.md
Loading
Related Openclaw Skills
Miro MCP Integration
Connect OpenClaw agents to Miro via the Model Context Protocol to bridge the gap between visual brainstorming and technical implementation.
Miro API Integration
A comprehensive developer tool for programmatically managing Miro boards, shapes, cards, and team resources via the v2 REST API.
Agent Matchmaker
Automatically discovers compatible AI agents and posts collaboration recommendations to foster ecosystem growth.
GM3 Alertworthy Feed
A high-fidelity data skill providing real-time snapshots of alertworthy crypto tokens and market structure signals for analysis agents.
ntfy-notify
A versatile CLI skill for sending rich, interactive notifications to ntfy.sh topics with full support for attachments and actions.
Instacart Browser Automation
Automate grocery ordering and smart replenishment on Instacart using browser-based AI agents.
Featured*
