panphora/overtype

OverType is a small JavaScript library for adding a markdown editor to a web page. It uses an approach called an invisible textarea overlay: instead of building a custom rich-text editing surface, it places a transparent input area on top of a styled preview panel. You type into the transparent textarea, and the styled preview underneath updates to show formatted text. This gives the appearance of editing styled markdown directly, while keeping the actual input mechanism a plain browser textarea. Because it relies on a standard textarea rather than a more complex editing engine, the library weighs about 111KB minified and has no external dependencies. This is considerably smaller than comparable editors like TUI Editor (561KB) or Milkdown (345KB). The tradeoff is that OverType shows markdown syntax while you type rather than hiding it, which suits users comfortable reading markdown who want a simple, fast editor rather than full word-processor-style hiding of syntax. The library includes both light and dark themes applied globally across all editor instances on a page, an optional toolbar with buttons for bold, italic, headings, lists, links, and code blocks, keyboard shortcuts for common formatting operations, GitHub-style automatic list continuation when pressing Enter inside a list, and three view modes: normal editing, a raw textarea showing plain markdown, and a read-only preview. Syntax highlighting for code blocks can be added by connecting a separate highlighter library. Installation is through npm or a CDN script tag with no build step required. Creating an editor means pointing the constructor at a DOM element and passing an options object. Multiple editors can be initialized at once. The library works with React, Vue, and plain HTML pages alike. The full README is longer than what was shown.