0.2.334 · Feature map + tiered availability

Every tool. Every gesture. Every surface.

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.

Open the canvas → Jump to tools See the MCP layer Plan Tiers
12
Tools
3
Object realms
XY
Spatial canvas
3
Plan tiers
PNG
Lossless export
MCP
Agent-ready

01The promise

Elite Fidelity

Exports preserve the composition as intentionally as possible: alpha-aware PNG, selected-area output, GIF, PDF, and Google Slides pathways.

Input Tested

Core tap, drag, keyboard, undo, and canvas flows are covered by browser regression checks.

Polished Details

The app includes sound, touch feedback where the browser supports it, and animated visual feedback.

Borderless

No fixed artboard. Objects can be placed outside the starting viewport and reached through pan/zoom.

Accessible Defaults

OpenDyslexic branding, dark default UI, keyboard shortcuts, and responsive layouts are part of the tested surface.

02Canvas & viewport

Boundless canvas

No fixed artboard. Objects render in a unified spatial ledger sorted by zIndex.

Transparent background

Default is alpha — checkerboard hint shows what's see-through.

Background color picker

Pan with grab

Drag empty space in Grab mode. Single-finger on touch, drag-from-background on desktop.

Wheel zoom

Smooth cursor-anchored zoom on desktop.

Pinch zoom

Two-finger pinch is handled through browser touch events and covered by mobile-emulation regression checks.

Two-finger pan

Drag with two fingers anywhere on the stage to move the viewport.

Zoom buttons

Discrete +/− controls for keyboard and accessibility users.

Double-tap reset

Double-click or double-tap empty stage → snap back to 100% / origin.

Live cursor mapping

Cursor mirrors the active tool: grab, grabbing, crosshair, text, default.

03Tools

Select

Single-click selection. The precise pointer tool.

Grab

Default mode. Pan the canvas and move objects with one drag.

Marquee

Drag a rectangle to multi-select any objects underneath.

Text

Tap to place. Auto-opens the Typography panel on both desktop and mobile.

Draw

Freehand pen for sketches and signatures.

Rectangle

Drag to draw a rect with the current stroke, fill, opacity, edge feather, and corner radius.

Circle

Drag to draw an ellipse / perfect circle.

Arrow

Drag to draw an arrow — fill and stroke move together.

Shapes

Mobile sheet with shape options, rounded-corner support, opacity, edge feather, and presets.

Gallery

One-tap image picker for raster files including PNG, JPEG, WebP, and GIF. Fire-and-forget, no mode switch.

Layers

Opens the Layers panel to reorder, hide, and inspect z-order.

Multi-select toggle

Touch-friendly Shift equivalent. ORs with the keyboard Shift flag.

04Object types

Shape nodes

Rectangles, circles, arrows, triangles, and freehand draw paths. Each carries stroke, fill, opacity, edge feather, corner radius where supported, and full spatial state.

Text nodes

Free-floating editable text with font, size, alignment, weight, decoration, color, and stroke FX.

Image nodes

Pasted, picked from gallery, or uploaded. GIF imports are accepted, and the first image fills ~75% of the visible canvas to signal scale.

05Selection

Click to select

Tap or click any object. Selection store stays consistent across realms.

Shift / additive touch

Shift+click on desktop, or flip the multi-select toggle on touch.

Marquee multi-select

Drag a box to add every object inside it to the selection.

Select all / invert

Available from the right-click / long-press menu.

Multi-select pulse

When two or more objects are selected, each gets a softly pulsing outline so you can see the group at a glance.

Selection wiggle

Subtle animation feedback on attention events.

Escape clears

One key, two effects: deselect everything and close the active panel.

06Transform & styling

Transform handles

Konva transformer: 8 handles for resize, dedicated handle for rotate.

Drag to move

Per-realm onDragEnd writes back to the store via a labeled history entry.

Arrow-key nudge

←↑→↓ moves 1 px. Shift+arrow moves 10 px.

Edit mode

Per-object editing surface (EditToolLayer) for deeper attribute changes.

Stroke slider

1 – 50 px. Gesture-coalesced — the entire drag becomes one undo step.

Color picker

Native OS color dialog with 350 ms idle-commit so dragging through colors collapses to one undo.

Opacity control

Shape opacity is stored on the node, so objects can be partially transparent without flattening the canvas.

Transparent shapes

Shapes can be stroke-only with no fill, preserving true transparent interiors through canvas rendering, PDF export, and Google Slides export.

Rounded corners

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.

Edge feather

Shape edges can be softened with a feather radius for overlays, callouts, and less rigid marks.

Per-object styling

Stroke, fill, opacity, edge feather, corner radius, and text FX (fxFill, fxStrokeWidth) live on the node, not the tool.

07Text & typography

In-canvas editing

Tap a text node to edit in place. Commit-before-switch prevents stranded edits.

Font picker

Curated default fonts plus default swatches for quick, clean typesetting.

Size slider

Smooth font sizing, bounded for design safety and readability.

Alignment

Left, center, right — applied via TextAlign on the node.

Font style

Regular, bold, italic, bold-italic.

Decoration

Underline, strikethrough — per-node decoration.

Text FX stroke

Stroke width and color for text outline effects.

08Layers & z-order

Layers panel

Inspect and reorder every object in one list.

Bring forward / back

[ and ] step. Shift+ jumps to bottom / top.

Unified zIndex

Shapes, text, and images share one ordering — no realm hierarchy fights.

09Layouts & grids

Auto-Wrap Border

5 px frame around everything currently on canvas.

Meme Grid

1 large slot + 3 stacked slots — the classic meme layout.

Equal 2×2

Perfect quad split.

Clear all overlays

Removes layout frames without touching your content.

11Context menu

Duplicate & delete

Two of the most-used verbs, always one click away.

Reorder

Bring forward, send back, to top, to bottom.

Edit

Enter edit mode for the selection.

Open Typography

For text selections — jumps you straight to the font panel.

Select all / invert

Stage-context shortcuts for power users.

Paste

Image or clipboard content at the right-click point.

Background color

Quick swatch from the stage context menu.

12Export

Canvas PNG export

Export the whole composition as PNG with alpha-aware crop and transparent-background support.

Selection PNG export

Export just the selected objects, derived from their spatial ledger, without flattening unrelated canvas content.

Static Crop Frame

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.

v0.2.299

Footprint estimator

See the projected pixel size before exporting.

Footprint measurement

True post-export size, so you can spot surprises.

Export budget

Configurable limit prevents accidental browser-crashing megapixel exports.

Custom filenames

Personal and Pro users can name exports directly from the Export panel instead of accepting timestamp-only filenames.

GIF export

Personal and Pro can record the visible canvas area or selected objects as animated GIF output.

PDF export

Pro can compile the whole canvas or the current selection into a local PDF.

Pro

Google Slides export

Pro can compile selected canvas objects into a Google Slides-compatible export payload for slide workflows.

Pro

Transparent export semantics

Stroke-only shapes, transparent backgrounds, and alpha-bearing images are intentionally preserved where the target format supports them.

13History

Undo / redo

100-slot ring buffer with labeled entries you can read in the panel.

Gesture coalescing

Slider drags, color drags, transform drags collapse to one undo step.

Idle-commit pattern

OS color pickers (which fire onChange constantly) idle-commit after 350 ms.

Dock buttons

Undo / redo in the mobile dock with disabled state when the stack is empty.

14Keyboard shortcuts

KeysAction
EscClear selection & close active panel
Delete / BackspaceDelete the current selection
Ctrl/Cmd+ZUndo
Ctrl/Cmd+Shift+ZRedo
Ctrl/Cmd+YRedo (alt)
Ctrl/Cmd+DDuplicate selection
[ / ]Send back / bring forward
Shift+[ / ]Send to bottom / bring to top
←↑→↓Nudge 1 px
Shift+arrowNudge 10 px

15Panels & surfaces

Header & status bar

Top brand + project name. Bottom contextual status.

Desktop tool palette

Grouped: grab · marquee/text/draw · rect/circle/arrow · multi-select · stroke + color · layouts + layers.

Mobile dock

Gallery, grab, marquee, text, draw, layouts, layers, export, help, undo, redo, multi-select — all reachable.

Mobile tool sheet

Slide-up sheet hosts tool options without covering the canvas.

Typography panel

Font family, size, alignment, style, decoration, swatches, FX stroke.

Layouts panel

One-tap collage frames and grids.

Layers panel

One unified z-order list across all object realms.

Shape options

Stroke, fill, opacity, edge feather, and corner radius controls where supported by the selected shape type.

Image Edit panel

Side panel that opens when editing an image node, hosting color grades, crop tools, flip horizontal/vertical actions, and cookie-cutter shape masks.

v0.2.300

Export panel

PNG canvas/selection export, GIF canvas/selection export, PDF canvas/selection export, Google Slides export, custom filenames, footprint preview, and budget config.

Help modal

Replayable tutorial steps + a tour of feature areas.

Welcome modal

First-launch greeting before the onboarding spotlight kicks in.

Splash screen

"borderless" in OpenDyslexic fading in and out.

16Onboarding & help

1 · Drop a photo

Gallery picker is spotlit; hint adapts to whether you're on mobile or desktop.

2 · Add text

The substep nudges you to place text outside the picture so you feel the boundless canvas.

3 · Add a shape

Square, circle, or arrow — any of the three completes the step.

4 · Restyle

Change size or color and the checklist ticks.

5 · Undo

Teaches the safety net before you need it.

6 · Stack

Open the Layers / Stack panel.

7 · Export

Ship something.

Replay any step

The Help modal lets you re-run individual onboarding steps later.

Contextual hints

Spotlight ring with selector targeting; never blocks the user mid-action.

17Persistence & sync

IndexedDB autosave

BoarderlessReactDB persists every store mutation locally — debounced writes, status pill in the header reports Saved / Saving… / Unsaved.

Boot hydration

App rehydrates from disk before first paint of the canvas — last board, last viewport, last selection.

Multi-board projects

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).

v0.2.191

Board tabs

Single-click an inactive tab to switch boards. Single-click the active tab to rename inline. + creates a new one.

Soft archive

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.

v0.2.283

Permanent delete

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.

v0.2.283

Project thumbnails

Every board carries a JPEG thumbnail (~256 px) captured at flush time, surfaced as the card preview in the Projects modal.

v0.2.246

Pro Cloud Sync to Google Drive

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.

Pro · v0.2.216

Friendly Drive filenames

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.

Pro · v0.2.287

Rename propagates to Drive

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 · v0.2.287

Drive Media subfolder

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.

Pro · v0.2.287

Sync status pill

Header pill in real time: Synced (green), Syncing (pulsing blue), or Sync error (red) — never silent.

Last-writer-wins reconcile

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.

v0.2.218

Reset project

One-shot wipe for a clean slate on the current board, fired via a custom event.

18PWA & Mobile support

Installable PWA

manifest.json, theme color, app icons — installs to home screen on iOS and Android.

Touch event handling

Per-Stage onTouchStart with single-finger pan; pinch reserved for zoom.

Viewport guards

Touch viewport guards reduce rubber-band, double-tap zoom, and gesture hijacking on the stage.

touch-action: manipulation

Applied to dock buttons so taps register instantly.

Responsive viewports

Layouts are checked against desktop and narrow mobile viewport sizes.

Dark mode default

Every panel ships dark; no light-mode flash.

19Agentic & AI

Model Context Protocol (MCP) Adapter

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.

Antigravity & AI Agent Connectors

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.

How agents connect

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.

Agent tool surface

Agents can call get_board_state, mutate_object, and calculate_export_bounds against the visible canvas session.

Current boundaries

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.

Flat, AI-readable state

State mutations are flat coordinate-tracking JSON — no nested view logic.

JSON schema contracts

Well-defined, predictable object schemas for shape, image, typography, opacity, corner radius, edge feather, z-order, and export bounds.

Verified with a live canvas

npm run verify:mcp seeds a real shape, calls the MCP tools, and pixel-samples the Konva canvas to prove the object visibly moved.

Feature page as RAG

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.

20Polish & feel

OpenDyslexic branding

The wordmark uses OpenDyslexic — an accessibility nod baked into the brand.

Splash fade

"borderless" fades in and out on cold boot.

Sound effects

Stack pop, action confirms — tactile feedback without overload.

Tactile feedback

Interactive canvas sounds and local haptic feedback triggers on touch.

Spring-physics intent

Animations move with weight; nothing snaps abruptly.

Pulse outlines

Multi-select members breathe at the same tempo — you can see the group at a glance.

21Plan tiers

Free

Best for lightweight exploration & local testing.

$0
Free forever
  • 1 browser-cached board
  • Up to 5 canvas objects
  • 3 undo slots
  • PNG export format
  • Agentic MCP connection
Select Free

Personal

For creators looking for deeper canvas limits.

$3 / month
or $30 billed annually
  • 5 browser-cached boards
  • Unlimited objects per board
  • 100 undo slots
  • PNG + animated GIF export
  • Custom export filenames
Select Personal

That's the whole map.

Now use it. Drop an image, place text outside the starting viewport, and export a PNG from the canvas.