MarkLayer

One URL. A shared board. A faster decision.

MarkLayer turns any webpage into a collaborative review surface. Instead of passing screenshots back and forth, send a link. Teammates or clients can open the original page in their own browser, leave feedback where it belongs, and see changes land live.

• For client feedback: let clients point to exactly what they mean, without an account or extension.
• For design review: sketch ideas, highlight details, and keep the conversation attached to the page.
• For QA: pin reproducible issues to the actual UI, then share a clean link with the team.
• For AI-assisted work: inspect an element to copy its stable selector and an AI-ready markdown snapshot.

How it works

1. Open a page: paste any public URL at marklayer.app, or use the Chrome extension on the page you are already viewing — including a page on your own localhost dev server, which never has to be reachable from the internet.
2. Make the feedback visible: draw, highlight text, measure space, pin a threaded comment, or inspect an element.
3. Share one link: collaborators join the same board and see cursors, marks, replies, and calls in real time.

No sign-up. No trial clock. No client install.

What you can do

Annotate freely	Pen, highlighter, eraser, shapes, arrows, text, and text-selection highlights.
Keep feedback in context	Pin threaded comments to the page, reply inline, and track status.
Review live	Real-time cursors, drawings, and comments via WebSocket, plus peer-to-peer voice and video chat.
Hand off precise implementation context	Inspect an element for a stable selector, computed styles, parent layout, viewport details, and framework component information.
Measure the UI	Check element dimensions and edge-to-edge gaps between two elements.
Share or export	Create shareable links with preview cards, or export annotations to PNG.
Make it yours	Reorder toolbar tools; drafts persist locally and restore when you return.

Built to respect the reviewer's time and privacy

• No accounts or tracking: start reviewing immediately.
• Links expire thoughtfully: shared boards expire 90 days after their last view.
• Open source and self-hostable: MarkLayer is released under Apache-2.0, so your workflow is not tied to a pricing change.

Want the non-technical version? Read How MarkLayer works.

Self-hosting & development

git clone https://github.com/thevrus/MarkLayer.git
cd MarkLayer
bun install
bun run dev

For the Chrome extension in development:

1. Build or run the extension app.
2. Open chrome://extensions/ and turn on Developer mode.
3. Choose Load unpacked and select apps/extension/.output/chrome-mv3-dev.

Repository layout

├── apps/extension/     Chrome extension (WXT + Preact)
├── apps/worker/        Cloudflare Worker, API, real-time rooms, proxy, OG generator
├── apps/site/          Static marketing site (Astro)
└── packages/types/     Shared TypeScript types

Stack

Area	Technologies
Frontend	Preact, Signals, Tailwind CSS, Vite
Extension	WXT, Chrome APIs
Backend	Cloudflare Workers, Hono, Durable Objects
Storage	D1 (SQLite), R2
Real-time	WebSockets, WebRTC

Scripts

Command	What it does
bun run dev	Run the workspace in development mode
bun run build	Build all apps
bun run check	Type-check the workspace
bun run lint	Lint and format-check with Biome
bun run lint:fix	Apply lint and formatting fixes
cd apps/worker && bun run deploy	Deploy the Worker to Cloudflare
cd apps/site && bun run indexnow:submit	Ping IndexNow (Bing and friends) after a deploy that changed pages

Contributing

Found a bug or have an idea? Open an issue. Contributions are welcome.

License

Apache License 2.0 © Vadym Rusin

---