AJ
Back to Builds
ExtensionComplete

Copy as Markdown

A Chrome extension that converts any selected webpage content, including tables and code blocks, into clean Markdown with a right-click or keyboard shortcut. Built for BAs and technical writers who live between browsers and docs tools.

JavaScriptChrome Extension APITurndown.js

Overview

Copy as Markdown is a Chrome extension that hooks into the browser's context menu and keyboard shortcut system to convert selected webpage content into clean, well-structured Markdown. It handles bold, italic, headings, links, tables, inline code, code blocks, and ordered and unordered lists, outputting text you can paste directly into Confluence, Notion, GitHub, or any Markdown editor without manual cleanup.

Why it was built

Built out of a daily frustration: copying content from web pages into documentation tools always required reformatting. The extension replaces that 3-minute cleanup with a single right-click, and was designed specifically with IT Business Analysts and technical writers in mind, people who constantly move content between browsers and wikis.

Right-click Context Menu

Adds a 'Copy as Markdown' option to the browser's native context menu when text is selected. No popup UI needed: just select, right-click, and paste.

Keyboard Shortcut

Ctrl+Shift+M (Cmd+Shift+M on Mac) copies the selected content as Markdown without touching the mouse. Configurable from Chrome's extension keyboard shortcuts settings.

Table Conversion

HTML tables are converted to GitHub Flavored Markdown table syntax with proper column alignment. Most clipboard tools drop table structure entirely. This preserves it.

Tech Breakdown

Chrome Extension Manifest V3

Built on the current MV3 spec with a service worker background script. MV3 is the required standard for new Chrome Web Store submissions, since MV2 extensions are being phased out.

Turndown.js

A battle-tested HTML-to-Markdown library with plugin support. Handles edge cases in HTML structure that a hand-rolled converter would miss, like nested lists and malformed table cells.

Content Script

The content script runs in the context of the active page and can access the DOM. It reads the selected HTML via getSelection(), passes it to Turndown, and writes the result to the clipboard via the Clipboard API.

Background Service Worker

Registers the context menu item and relays messages between the popup and the content script. In MV3, the background page is replaced by a service worker: it spins up on demand and terminates when idle.

Challenges
  • 1

    getSelection() returns a Selection object, not raw HTML. Converting it to an HTML string for Turndown requires iterating over the selected ranges and cloning them into a temporary div, a non-obvious step that most clipboard examples skip.

  • 2

    Some sites use shadow DOM for their content, which makes selection invisible to standard DOM traversal. Handling shadow root content required additional detection logic in the content script.

What's Next

The extension is complete and installable via developer mode. The next step is submitting it to the Chrome Web Store: the store listing copy, privacy policy, and icons are already written and ready.

Want to know more?

Happy to walk you through the details, just reach out.