Get teams talking in your product

Combine Cord’s Components and APIs to add messaging, live presence, notifications, and annotations to your product in minutes.

A thread, avatar, and live cursor are combined to show a comment and reply on a whiteboard canvas.
Chat

Chat

Get users talking in your product with top-notch chat features out-of-the-box. Great for internal communication, customer support, and more.

Live Presence

Live Presence

Let users see who's online working at the same time as them, and who's been there before with live cursors, avatars, last seen tooltips and more.

Notifications

Notifications

Easily keep users up-to-date, engaged, and in-context with custom notifications. We take care of pagination, badging logic, and real-time updates.

Comments & annotations

Comments & annotations

Shorten feedback loops with in-app commenting. Users can start discussions and leave feedback on videos, dashboards, documents, canvases, and more.


Chat

Start, manage, and track conversations anywhere in your product. Onboard customers, offer support, and help users find the information they need, when they need it.

Top-notch chat in a few lines of code. Typing indicators, formatting and markdown, file attachments, read receipts, and the ability to edit and delete messages.

  • Easily connect Cord’s APIs to ChatGPT for an AI Assistant, or to Zendesk for a support channel
  • Read and write message data to build unique messaging UI and other complex features on top of Cord’s components
  • Analyze messages to inform your product roadmap, GTM strategy, and more

Multiple people adding comments to a page, in the style of the commenting experience in Google Docs

Comments & annotations

Transform how users interact with text, charts, canvases, videos, and tables. Discussions stay pinned to specific points to make editing, analysis, and sign-off faster and easier.

A comment thread shows two people working together to edit a video. Avatars on the video progress bar show where other users have left comments.

Creative collaboration requires context. Annotations give users a way to discuss specific elements, and keep track of discussions and decisions.

  • Ensure comments are always displayed at the right place, at the right time, without cluttering the screen
  • Automatically send screenshots to users when they’re @mentioned so it’s clear what’s being talked about
  • Make it easy for users to invite their teams, reply in-line, add attachments, and react with emojis

Live presence

Let users see who's online at the same time as them, and who’s viewed a particular page in the past. Show who’s working where and when to boost engagement and productivity.

Live cursors, page presence, a notification bell, and a comment show how users can collaborate in a dashboard.

Live typing indicators, live cursors, profile photos, and last visit tooltips bring different members of the team together to collaborate in real- time.

  • Automatically pull profiles photos, user names, and other information from tools like Slack
  • Customize avatars to fit natively in your product
  • Track ephemeral and durable presence, and ensure low latency with Cord’s Presence API

Notifications

Keep users updated and in-context. Alert users when someone replies to a thread, reacts to a message, or @mentions them, and use our REST API to trigger custom notifications.

Let users manage and archive notifications in-app, and use deep linking to reacting and responding quick and easy.

  • Create a fully customizable notification system that works out-of-the-box. We take care of pagination, badging logic, and real-time updates.
  • Use our APIs and webhooks to push notifications to a separate internal tool, or trigger a custom workflow in your app
  • Integrate with Slack and email, and give your customers the power to customize their experience per-thread and per-platform
A notification list shows timestamped activity in a canvas application.

Customization

Collaborative features don’t have to feel like an add-on. Use CSS to set fonts, colors, and sizes and easily tweak small but important details so the UX feels 100% native.

We use Vanilla CSS to make every piece of Cord UI customizable and create a developer experience worth shouting about.

  • Use our example library to re-create the commenting experience in Google Docs, Figma, or Notion
  • Built with plain, vanilla CSS, so you can hack away to build the pixel-perfect experience for your app
  • Want to mock-up a quick POC? Use our Figma template to see exactly how collaboration could fit into your product
A code snippet shows how you can use CSS to customize the background, border, and color of UI elements.

Get started

Ready to transform your product? Get started for free, or get in touch.