Skip to main content
Inbox web, iOS, and Android preview Courier Inbox SDKs are available for web and mobile to embed a fully customizable notification center into your app with just a few lines of code.
import { useCourier, CourierInbox } from "@trycourier/courier-react";

export default function App() {
  const courier = useCourier();

  useEffect(() => {
    // Authenticate the user
    courier.shared.signIn({ userId, jwt });
  }, []);

  // Add the Inbox component
  return <CourierInbox />;
}
See complete working examples of Courier Inbox in our React Inbox sample app and Vanilla JS Inbox sample app.
Check out documentation for each of the Inbox SDKs:
New: v8 of the Courier React SDK and v1 of the new Courier Inbox Web Components SDK have recently been released.We recommend new integrations use these SDKs and existing apps migrate. Check out the Courier React v8 migration guide for more information and links to documentation for earlier versions of the SDKs.

A modern UI - that’s completely customizable

Courier Inbox SDKs provide a clean, modern UI out of the box with the option to fully integrate into your existing web or mobile design. Match your branding and theme the built-in UI, or supply your own views and components for complete customization while taking advantage of the SDKs’ message management. For integrations that require it, the Inbox SDKs also expose low-level APIs you can build on.

Real-time delivery

Inbox messages are delivered across devices in real-time across web and mobile. Message states — whether a message is read, opened, archived, etc. — are automatically synced so your users are always up to date, wherever they’re logged in.

Cross-channel integration

Inbox can be configured to work alongside other messaging channels, including email, SMS, and push notifications. For example, when a notification is sent to both inbox and email channels opening the email will mark the corresponding Inbox notification read. Learn more about cross-channel syncing and how to toggle this feature on/off.

FAQ

Inbox SDKs are available for React, Web Components, React Native, Flutter, iOS, and Android. Web Components work with any framework (Vue, Angular, Svelte, vanilla JS).
Yes. All Inbox SDKs support theming to match your brand colors and typography. You can also supply your own components for complete control over rendering while still using the SDK’s message management (read state, pagination, real-time updates). See the SDK docs for your platform for theming and custom renderer options.
Message states (read, opened, archived) are synced in real time across all devices where a user is signed in. If a user reads a notification on mobile, it updates on web immediately. When cross-channel syncing is enabled, opening an email notification also marks the corresponding Inbox message as read.
Inbox requires a JWT token generated by your backend using your Courier API key. Your backend creates the token with the user’s ID, then passes it to the client SDK via signIn({ userId, jwt }). See Inbox Authentication for implementation details.
Yes. Add inbox alongside other channels (email, push, SMS) in your message’s routing configuration. Courier delivers to each channel according to your channel priority rules. When cross-channel syncing is enabled, interactions on one channel (like opening an email) update the Inbox message state automatically.

Next Steps