Free
Best for lightweight exploration & local testing.
- 1 browser-cached board
- Up to 5 canvas objects
- 3 undo slots
- PNG export format
- Agentic MCP connection
Boarderless is a boundless creative canvas built for touch, mouse, and AI agents alike. This is the current public feature map for the canvas: tools, gestures, panels, persistence, export, onboarding, agentic controls, and tier availability.
Exports preserve the composition as intentionally as possible: alpha-aware PNG, selected-area output, GIF, PDF, and Google Slides pathways.
Core tap, drag, keyboard, undo, and canvas flows are covered by browser regression checks.
The app includes sound, touch feedback where the browser supports it, and animated visual feedback.
No fixed artboard. Objects can be placed outside the starting viewport and reached through pan/zoom.
OpenDyslexic branding, dark default UI, keyboard shortcuts, and responsive layouts are part of the tested surface.
No fixed artboard. Objects render in a unified spatial ledger sorted by zIndex.
Default is alpha — checkerboard hint shows what's see-through.
Drag empty space in Grab mode. Single-finger on touch, drag-from-background on desktop.
Smooth cursor-anchored zoom on desktop.
Two-finger pinch is handled through browser touch events and covered by mobile-emulation regression checks.
Drag with two fingers anywhere on the stage to move the viewport.
Discrete +/− controls for keyboard and accessibility users.
Double-click or double-tap empty stage → snap back to 100% / origin.
Cursor mirrors the active tool: grab, grabbing, crosshair, text, default.
Single-click selection. The precise pointer tool.
Default mode. Pan the canvas and move objects with one drag.
Drag a rectangle to multi-select any objects underneath.
Tap to place. Auto-opens the Typography panel on both desktop and mobile.
Freehand pen for sketches and signatures.
Drag to draw a rect with the current stroke, fill, opacity, edge feather, and corner radius.
Drag to draw an ellipse / perfect circle.
Drag to draw an arrow — fill and stroke move together.
Mobile sheet with shape options, rounded-corner support, opacity, edge feather, and presets.
One-tap image picker for raster files including PNG, JPEG, WebP, and GIF. Fire-and-forget, no mode switch.
Opens the Layers panel to reorder, hide, and inspect z-order.
Touch-friendly Shift equivalent. ORs with the keyboard Shift flag.
Rectangles, circles, arrows, triangles, and freehand draw paths. Each carries stroke, fill, opacity, edge feather, corner radius where supported, and full spatial state.
Free-floating editable text with font, size, alignment, weight, decoration, color, and stroke FX.
Pasted, picked from gallery, or uploaded. GIF imports are accepted, and the first image fills ~75% of the visible canvas to signal scale.
Tap or click any object. Selection store stays consistent across realms.
Shift+click on desktop, or flip the multi-select toggle on touch.
Drag a box to add every object inside it to the selection.
Available from the right-click / long-press menu.
When two or more objects are selected, each gets a softly pulsing outline so you can see the group at a glance.
Subtle animation feedback on attention events.
One key, two effects: deselect everything and close the active panel.
Konva transformer: 8 handles for resize, dedicated handle for rotate.
Per-realm onDragEnd writes back to the store via a labeled history entry.
←↑→↓ moves 1 px. Shift+arrow moves 10 px.
Per-object editing surface (EditToolLayer) for deeper attribute changes.
1 – 50 px. Gesture-coalesced — the entire drag becomes one undo step.
Native OS color dialog with 350 ms idle-commit so dragging through colors collapses to one undo.
Shape opacity is stored on the node, so objects can be partially transparent without flattening the canvas.
Shapes can be stroke-only with no fill, preserving true transparent interiors through canvas rendering, PDF export, and Google Slides export.
Rectangle and triangle shapes support a Corners slider. Rounded geometry is retained in the node model and reflected by render/export paths that support it.
Shape edges can be softened with a feather radius for overlays, callouts, and less rigid marks.
Stroke, fill, opacity, edge feather, corner radius, and text FX (fxFill, fxStrokeWidth) live on the node, not the tool.
Tap a text node to edit in place. Commit-before-switch prevents stranded edits.
Curated default fonts plus default swatches for quick, clean typesetting.
Smooth font sizing, bounded for design safety and readability.
Left, center, right — applied via TextAlign on the node.
Regular, bold, italic, bold-italic.
Underline, strikethrough — per-node decoration.
Stroke width and color for text outline effects.
Inspect and reorder every object in one list.
[ and ] step. Shift+ jumps to bottom / top.
Shapes, text, and images share one ordering — no realm hierarchy fights.
5 px frame around everything currently on canvas.
1 large slot + 3 stacked slots — the classic meme layout.
Perfect quad split.
Removes layout frames without touching your content.
Persistent strip at the bottom of the canvas with local device photos and imported raster assets.
One-tap from the dock — opens the OS picker for PNG, JPEG, WebP, and GIF files.
Ctrl/Cmd+V pastes any image straight to canvas.
GIF files enter through the same gallery pipeline as other raster assets, preserving the original blob for export-aware workflows.
Alpha-bearing PNG/WebP assets remain transparent on the canvas and in alpha-aware exports.
Your first image fills most of the viewport so you immediately feel the scale of the canvas.
The Projects modal has a Media tab that aggregates every image you've added across every board, active or archived. Each card shows the format, dimensions, and which boards it lives in.
One click on a Media card drops that image onto the board you're viewing — even if it was first added to a different board. Lands at viewport centre.
Delete an image from the Media tab and it's removed from every board that referenced it. For Pro users, the mirrored file in Drive is removed too.
Mask images into geometric shapes natively (Circle, Rounded Rect, Triangle, Hexagon, Star, Heart) in the image Edit panel, with live previews and full undo/redo support.
Two of the most-used verbs, always one click away.
Bring forward, send back, to top, to bottom.
Enter edit mode for the selection.
For text selections — jumps you straight to the font panel.
Stage-context shortcuts for power users.
Image or clipboard content at the right-click point.
Quick swatch from the stage context menu.
Export the whole composition as PNG with alpha-aware crop and transparent-background support.
Export just the selected objects, derived from their spatial ledger, without flattening unrelated canvas content.
Toggle a persistent, draggable and resizable dashed blue frame at the viewport's center. Arrange assets inside it, and selection exports will crop precisely to the frame boundary.
See the projected pixel size before exporting.
True post-export size, so you can spot surprises.
Configurable limit prevents accidental browser-crashing megapixel exports.
Personal and Pro users can name exports directly from the Export panel instead of accepting timestamp-only filenames.
Personal and Pro can record the visible canvas area or selected objects as animated GIF output.
Pro can compile the whole canvas or the current selection into a local PDF.
Pro can compile selected canvas objects into a Google Slides-compatible export payload for slide workflows.
Stroke-only shapes, transparent backgrounds, and alpha-bearing images are intentionally preserved where the target format supports them.
100-slot ring buffer with labeled entries you can read in the panel.
Slider drags, color drags, transform drags collapse to one undo step.
OS color pickers (which fire onChange constantly) idle-commit after 350 ms.
Undo / redo in the mobile dock with disabled state when the stack is empty.
| Keys | Action |
|---|---|
| Esc | Clear selection & close active panel |
| Delete / Backspace | Delete the current selection |
| Ctrl/Cmd+Z | Undo |
| Ctrl/Cmd+Shift+Z | Redo |
| Ctrl/Cmd+Y | Redo (alt) |
| Ctrl/Cmd+D | Duplicate selection |
| [ / ] | Send back / bring forward |
| Shift+[ / ] | Send to bottom / bring to top |
| ←↑→↓ | Nudge 1 px |
| Shift+arrow | Nudge 10 px |
Top brand + project name. Bottom contextual status.
Grouped: grab · marquee/text/draw · rect/circle/arrow · multi-select · stroke + color · layouts + layers.
Gallery, grab, marquee, text, draw, layouts, layers, export, help, undo, redo, multi-select — all reachable.
Slide-up sheet hosts tool options without covering the canvas.
Font family, size, alignment, style, decoration, swatches, FX stroke.
One-tap collage frames and grids.
One unified z-order list across all object realms.
Stroke, fill, opacity, edge feather, and corner radius controls where supported by the selected shape type.
Side panel that opens when editing an image node, hosting color grades, crop tools, flip horizontal/vertical actions, and cookie-cutter shape masks.
PNG canvas/selection export, GIF canvas/selection export, PDF canvas/selection export, Google Slides export, custom filenames, footprint preview, and budget config.
Replayable tutorial steps + a tour of feature areas.
First-launch greeting before the onboarding spotlight kicks in.
"borderless" in OpenDyslexic fading in and out.
Gallery picker is spotlit; hint adapts to whether you're on mobile or desktop.
The substep nudges you to place text outside the picture so you feel the boundless canvas.
Square, circle, or arrow — any of the three completes the step.
Change size or color and the checklist ticks.
Teaches the safety net before you need it.
Open the Layers / Stack panel.
Ship something.
The Help modal lets you re-run individual onboarding steps later.
Spotlight ring with selector targeting; never blocks the user mid-action.
BoarderlessReactDB persists every store mutation locally — debounced writes, status pill in the header reports Saved / Saving… / Unsaved.
App rehydrates from disk before first paint of the canvas — last board, last viewport, last selection.
Each user can hold multiple independent boards in one project. Switch between them in the header tab strip; counts gated by tier (Free 1, Personal 5, Pro unlimited).
Single-click an inactive tab to switch boards. Single-click the active tab to rename inline. + creates a new one.
X on a board tab moves it to the Projects modal's Inactive section instead of deleting it. Reversible — restore returns it to the tab strip. Archived boards don't count against your tier's active-board cap.
From the Projects modal's Inactive section, "Delete forever" hard-removes the board from IndexedDB and from your Google Drive (if Cloud Sync is on). Not reversible — confirmation dialog spells out both.
Every board carries a JPEG thumbnail (~256 px) captured at flush time, surfaced as the card preview in the Projects modal.
Pro users with sync enabled get every board mirrored to My Drive / Boarderless / as a JSON snapshot. Cross-device: open on phone, your boards are there. Drive sync token auto-recovers across reloads.
Board files in Drive are named after the board ({boardName}.bdrl.json) so you can recognise them at a glance. Internal boardId lives in Drive appProperties so renames stay clean. Legacy board-<uuid>.json files auto-migrate on next save.
Renaming a board in the tab strip also renames the file in your Google Drive. Best-effort — local rename always succeeds; Drive catches up on the next regular save if the rename API call hits a hiccup.
Pro users also get every uploaded image mirrored as a raw file (PNG/JPG/GIF/WebP) in My Drive / Boarderless / Media /, named {boardName} - {shortId}.{ext}. Browse and download them directly from Drive — no JSON unwrap.
Header pill in real time: Synced (green), Syncing (pulsing blue), or Sync error (red) — never silent.
On Drive sync-down, any board newer in Drive than locally is pulled in. If the imported board is currently open, the canvas re-hydrates live without a reload.
One-shot wipe for a clean slate on the current board, fired via a custom event.
manifest.json, theme color, app icons — installs to home screen on iOS and Android.
Per-Stage onTouchStart with single-finger pan; pinch reserved for zoom.
Touch viewport guards reduce rubber-band, double-tap zoom, and gesture hijacking on the stage.
Applied to dock buttons so taps register instantly.
Layouts are checked against desktop and narrow mobile viewport sizes.
Every panel ships dark; no light-mode flash.
Expose the live local canvas tab directly to AI agents using the industry-standard Model Context Protocol. Built-in integration makes it easy for LLMs to query and coordinate canvas elements.
Pre-configured connector scripts (e.g., scripts/mcp-stdio-server.mjs) optimized specifically for Antigravity, Claude Code, and other model context protocol environments to inspect and manipulate canvas nodes.
Run Boarderless locally, open Chrome or Edge with --remote-debugging-port=9222, then point the MCP client at the stdio server. Full setup lives in docs/ai-integration.md.
Agents can call get_board_state, mutate_object, and calculate_export_bounds against the visible canvas session.
MCP can inspect, move, and restyle existing objects. Creating new objects, deleting objects, signing in, connecting Drive, and uploading files still happen through the user-controlled UI.
State mutations are flat coordinate-tracking JSON — no nested view logic.
Well-defined, predictable object schemas for shape, image, typography, opacity, corner radius, edge feather, z-order, and export bounds.
npm run verify:mcp seeds a real shape, calls the MCP tools, and pixel-samples the Konva canvas to prove the object visibly moved.
Connecting AI agents should treat this page as the human-readable capability index for Boarderless: tools, limits, import/export formats, styling controls, persistence, and tier availability.
The wordmark uses OpenDyslexic — an accessibility nod baked into the brand.
"borderless" fades in and out on cold boot.
Stack pop, action confirms — tactile feedback without overload.
Interactive canvas sounds and local haptic feedback triggers on touch.
Animations move with weight; nothing snaps abruptly.
Multi-select members breathe at the same tempo — you can see the group at a glance.
Best for lightweight exploration & local testing.
For creators looking for deeper canvas limits.
Ultimate convenience with Google Drive cloud sync.
Now use it. Drop an image, place text outside the starting viewport, and export a PNG from the canvas.