Drop-in comments & live chat for any website

Website · Documentation · Examples

Desktop	Mobile

• Privacy-first — Your data, your server. No tracking, no ads, no third-party cookies. GDPR compliant.
• Real-time — WebSocket-powered live updates, typing indicators, and presence.
• Threaded replies — Nested conversations with unlimited depth.
• SSR support — Server-side rendering for SEO. Comments are indexable by search engines.
• Notifications — Email and push notifications for replies and mentions.
• Responsive — Works great on desktop and mobile.
• Moderation tools — Approve/reject queue, shadowbans, reports, and role-based permissions.
• Self-hostable — Run on your own infrastructure. Redis is the only dependency.
• Lightweight — Small bundle size. No heavy dependencies.

ThreadKit supports multiple authentication methods out of the box:

Cloud (free) — Sign up at usethreadkit.com and get running in minutes. No server setup required.

Self-hosted — Run on your own infrastructure for full control. See self-hosting below.

npm install @threadkit/react

import { ThreadKit } from '@threadkit/react'
import '@threadkit/react/styles.css'

function App() {
  return (
    <ThreadKit
      projectId="your-project-key"
      pageId="unique-page-id"
    />
  )
}

ThreadKit works on any website. Load it from our CDN:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@threadkit/react/dist/styles.css" />
<script src="https://cdn.jsdelivr.net/npm/@threadkit/react/dist/threadkit.umd.js"></script>

<div id="comments"></div>

<script>
  ThreadKit.render('#comments', {
    projectId: 'your-project-key',
    pageId: 'unique-page-id'
  })
</script>

npm install @threadkit/svelte

<script>
  import { ThreadKit } from '@threadkit/svelte';
  import '@threadkit/svelte/styles.css';
</script>

<ThreadKit
  projectId="your-project-id"
  pageId="unique-page-id"
/>

See the Svelte example for a complete setup.

For vanilla JavaScript or any other framework, use @threadkit/core directly:

npm install @threadkit/core

import { CommentStore, WebSocketClient } from '@threadkit/core';
import '@threadkit/core/styles';

const store = new CommentStore({
  siteId: 'your-site-id',
  url: window.location.pathname,
  apiUrl: 'https://api.usethreadkit.com',
});

store.on('stateChange', (state) => {
  // Render comments however you like
  console.log(state.comments);
});

store.fetch();

See the Vanilla example for a complete implementation.

ThreadKit is designed to be extensible. Add functionality with official plugins or build your own.

import { ThreadKit } from '@threadkit/react'
import { ethereumPlugin } from '@threadkit/plugin-auth-ethereum'
import { latexPlugin } from '@threadkit/plugin-latex'

<ThreadKit
  projectId="your-api-key"
  pageId="unique-page-id"
  plugins={[ethereumPlugin(), latexPlugin()]}
/>

ThreadKit uses CSS custom properties for easy theming:

:root {
  --tk-primary: #6366f1;
  --tk-background: #ffffff;
  --tk-text: #1f2937;
  --tk-border: #e5e7eb;
  --tk-radius: 8px;
}

See the theming guide for all available CSS variables.

Plugins can add custom renderers, authentication methods, or modify comment behavior:

import { definePlugin } from '@threadkit/react'

export const myPlugin = definePlugin({
  name: 'my-plugin',

  // Add custom markdown renderers
  renderers: {
    myCustomBlock: (props) => <MyComponent {...props} />
  },

  // Add toolbar buttons
  toolbar: [
    { icon: MyIcon, action: (editor) => editor.insert('...') }
  ],

  // Hook into comment lifecycle
  onCommentCreate: (comment) => { /* ... */ },
  onCommentRender: (comment) => { /* ... */ }
})

ThreadKit includes powerful moderation tools to keep your community safe:

• Manual moderation — Approve/reject queue, edit/delete comments, ban users, shadowbans
• Akismet integration — Automatic spam detection powered by Akismet
• LLM moderation — AI-powered content moderation that detects spam, abuse, harassment, hate speech, and more
• Reports — Users can report inappropriate content for review
• Role-based permissions — Owner, Admin, Moderator, and User roles with granular permissions

ThreadKit prioritizes accessibility, especially through its extensive language support. We currently support 38 languages, enabling a broad global reach for your community.

ThreadKit puts the developer in control of language management, making it trivial to integrate with your application's accessibility strategy.

• Developer-Controlled Language: You can easily load one of our 38 supported language packs from @threadkit/i18n and pass it directly to the ThreadKit component via the translations prop. This allows you to implement your preferred language detection strategy (e.g., based on user preferences, browser settings, or site configuration).
• Full String Customization: The translations prop also enables you to override any string used within ThreadKit components, giving you complete control over the displayed text.

import { ThreadKit } from '@threadkit/react';
import { locales, type LocaleCode } from '@threadkit/i18n';
import '@threadkit/react/styles';

function App() {
  // Determine the desired locale (e.g., from user settings, browser, or a dropdown)
  const currentLocale: LocaleCode = 'es'; // Example: Spanish

  return (
    <ThreadKit
      projectId="your-project-id"
      pageId="unique-page-id"
      translations={locales[currentLocale]}
    />
  );
}

For a complete working example, see examples/with-i18n.

ThreadKit can be fully self-hosted. The server is written in Rust for performance. Redis is the only dependency.

# Clone the repo
git clone https://github.com/usethreadkit/threadkit.git
cd threadkit/server

# Build and run
cargo build --release
./target/release/threadkit-http

See the self-hosting guide for detailed instructions including Docker deployment.

Visit usethreadkit.com/docs for full documentation.

• Getting Started
• Self-Hosting Guide
• API Reference
• Authentication
• Moderation
• Plugins

If you discover a security vulnerability, please email [email protected]. Do not open a public issue.

We welcome contributions! Please see our contributing guidelines for details.

MIT © ThreadKit