# Mutirão An endless whiteboard to stick notes, draw shapes, connect arrows and sketch by hand, like a live workshop wall. > Mutirão is an exclusive THM Componentes component that puts an infinite whiteboard inside your product: sticky notes, rectangles, ellipses, text, arrows that stay attached to shapes and a smoothed freehand pen. It has multi-select, rotate, resize, zoom, undo, keyboard shortcuts and SVG export. It suits planning workshops, journey maps and project roadmaps. - Category: Apps and productivity - Origin: THM exclusive, built by THM Tecnologia Inteligente; the prompt includes the full source code - Load weight: Heavy: WebGL or simulation; one per page, loaded on demand - Technology: Vue 3, TypeScript, Canvas 2D - Interaction: Mouse, Touch, Keyboard - URL: https://vibecode.thmtecnologia.com/en/components/mutirao/ ## What it looks like It looks like a wall covered in sticky notes, seen from a step back. The near-white background has a subtle dot grid. Floating cards at the top show the board name with undo and redo, the zoom level and an export button. A centered bar at the bottom gathers the tools, each with its shortcut key, and six colors such as yellow, pink and blue. Notes are pastel with a soft shadow, and arrows follow the shapes when they move. In the demo, a project plan shows columns of notes, curved arrows, a hand-drawn underline and a check mark. ## You may be looking for this if you asked for something like - “a Miro-style board inside my app” - “an online whiteboard to stick notes and connect them with arrows” - “an endless canvas where the team can sketch and organize ideas” - “a brainstorm wall with colorful sticky notes for client workshops” - “draw flows with boxes and arrows that follow when I drag” - “an idea board with zoom and a pen for handwriting” - “export the planning board as a vector image” ## Also known as idea board, infinite canvas, sticky notes board, online whiteboard, brainstorm board, digital whiteboard ## When to use - Planning and brainstorm workshops run live with clients - Journey maps, project roadmaps and hand-drawn flows - Internal tools where the team organizes ideas and priorities - Education or consulting products that need a whiteboard inside the platform ## When to avoid - Marketing pages, where an editable board weighs on the page and pulls focus from the message - Real-time collaboration among several people, which needs a separate sync server ## How to ask your AI ```text Create an infinite whiteboard in the projects area of my app: sticky notes, shapes, arrows attached to shapes, a smoothed pen, wheel and pinch zoom, undo, keyboard shortcuts, SVG export and saving the shapes to my database. ``` With THM Componentes, you paste the full prompt from the catalog, which already includes this component's source code, and the AI reproduces this exact effect instead of improvising. ## Questions about Mutirão ### How do I save what people draw on Mutirão? Mutirão exposes its shapes through v-model:shapes, a list with the type, position, size, rotation, color and text of each item, and arrows store which shapes they connect. Save that list to your API and load it back when the board opens. There are also toJSON and fromJSON methods and SVG export. ### Does Mutirão work on phones and tablets? Yes, with touch: one finger draws, moves or selects depending on the tool, and two fingers pinch to zoom and move the view. The toolbar sits at the bottom within thumb reach, and the export button shrinks on narrow screens. Because THM Componentes rates Mutirão as Heavy, test it on lower-end devices. ### Can I use Mutirão with a keyboard? Yes. In Mutirão each tool has a key, such as N for note, R for rectangle, A for arrow and P for pen. Tab moves through items, Enter edits text, arrow keys move the selection, Delete removes it, Ctrl+D duplicates and Ctrl+Z undoes. Screen readers hear a description of each selected item. ## Related components - [Engenhoca](https://vibecode.thmtecnologia.com/en/components/engenhoca/): An infinite board where you wire boxes together to build automations and watch the flow run with pulses of light. - [Ipê](https://vibecode.thmtecnologia.com/en/components/ipe/): A central idea in the middle and colored curved branches you create with Tab and Enter, drag and collapse. - [Comitiva](https://vibecode.thmtecnologia.com/en/components/comitiva/): Colored arrows with each teammate's name moving across the document, with their text selections and cursor messages. - [Alfinete](https://vibecode.thmtecnologia.com/en/components/alfinete/): Numbered pins you drop on an image or screen to comment, reply and mark as resolved. - [Deriva](https://vibecode.thmtecnologia.com/en/components/deriva/): An endless wall of photo cards you drag in any direction and open in detail with a single click. --- THM Componentes: THM Componentes is a catalog of 268 UI components for Vue 3 and Nuxt, 115 of them exclusive, each with a live demo and a ready prompt for Claude Code, Cursor and other AI assistants. Pick the effect, copy the prompt and your AI applies it to your project. Lifetime access for R$ 497 (about US$ 99).