Comments
Anchored discussion attached to a specific piece of content, with a path to resolution.
Communication & Notifications · 8 checks · 12 resources
Before you ship
8- 01Anchor to context — comments attached to a specific paragraph, image, task or row rather than floating in a general thread
- 02Reply threading — replies nested under the comment they respond to, keeping related discussion together
- 03Resolve and archive — a way to mark a thread resolved, removing it from the active view while keeping it accessible
- 04Reactions — emoji reactions on individual comments as a lightweight acknowledgement
- 05@mention element — mentioning a user notifies them directly and is visually distinguished in the comment body
- 06Edit action — the ability to edit after posting, with a visible edited marker for transparency
- 07Delete action — the ability to delete after posting, with a confirmation modal beforehand
- 08Comment count indicator — a visible count or badge on the item being discussed, so collaborators can see where threads exist
Resources that help you build this
12- Plate · Slate-based rich-text editor framework with 86 shadcn-installable editor components
- React Bits Pro · 703 paid React items in one license-gated shadcn registry: 134 animated components, 538 blocks, 11 templates and an Agent Kit
- UX Patterns for Devs · 92 UX patterns with accessibility rules, an MCP server and llms.txt
- Atlassian Design System · Atlaskit: 59 Apache-2.0 React components behind Jira, Confluence and Bitbucket
- HextaUI · 103 shadcn registry items: primitives plus AI, auth, billing, settings and team blocks
- Pierre Diffs · React diff renderer on Shiki with split/unified layouts, inline edits and comments
- Avvvatars · React component that derives a deterministic placeholder avatar from a string
- Facehash · Deterministic CSS-drawn avatar faces from any string, zero runtime dependencies
- moumenlab · shadcn registry of 13 motion-first interaction components, MIT, React 19 + Tailwind v4
- Oreo Avatar · Deterministic soft-gradient SVG avatars, 6 shapes x 40 palettes
- Page Flows · Screen recordings of real user flows from shipped iOS, Android, web, and email apps
- Primer · GitHub's design system: 62 React components, Octicons and design tokens