Inline Commenting v1

A Markdown viewer with paragraph-level AI-powered inline commenting. Built with Next.js 16 and remark/rehype.

How it works

Click on any paragraph to open the comment panel on the right. You can write your own comments or use the Ask AI button to get an AI-generated review.

This is a blockquote. Comments on blockquotes work the same way — just click on the paragraph.

Features

• Paragraph targeting — each paragraph is its own commentable unit
• AI commenting — powered by OpenRouter (free model as default)
• Manual comments — write your own thoughts with Cmd+Enter
• Comment count badges — see at a glance which paragraphs have feedback
• Dark mode — respects your system preference via Tailwind CSS v4

Code example

Below is a TypeScript snippet. Code blocks within paragraphs render with syntax highlighting via rehype-highlight.

interface Comment {
  id: string
  paragraphIndex: number
  selectedText: string
  author: string
  content: string
  timestamp: Date
  aiGenerated: boolean
}

Markdown tables are also supported thanks to remark-gfm:

Why this exists

Managing feedback on documents — specs, documentation, code reviews — is often fragmented between tools. This project explores a unified approach: render markdown as the source of truth, and attach comments inline at the paragraph level.

The AI commenting feature gives you a second pair of eyes. It's not meant to replace human review, but to catch blind spots and offer alternative perspectives.

Try it yourself

1. Click on this paragraph to select it
2. Write a comment in the panel on the right
3. Or click Ask AI to get an AI-generated review
4. Click on a different paragraph to switch context

This is the last paragraph. If you've read this far, why not leave a comment? 👇