RtkMeeting (2)

Last updated Oct 19, 2026 A single component which renders an entire meeting UI. It loads your preset and renders the UI based on it. With this component, you don't have to handle all the states, dialogs and other smaller bits of managing the application.

Properties

Property Type Required Default Description
applyDesignSystem boolean ✅ - Whether to apply the design system on the document root from config
config UIConfig ✅ - UI Config
gridLayout GridLayout1 ✅ - Grid layout
iconPack IconPack ❌ defaultIconPack Icon pack
leaveOnUnmount boolean ✅ - Whether participant should leave when this component gets unmounted
loadConfigFromPreset boolean ✅ - Whether to load config from preset
meeting Meeting ✅ - Meeting object
mode MeetingMode ✅ - Fill type
overrides Overrides ❌ defaultOverrides UI Kit Overrides
showSetupScreen boolean ✅ - Whether to show setup screen or not
size Size ✅ - Size
t RtkI18n ❌ useLanguage() Language

Usage Examples

Basic Usage

import { RtkMeeting } from '@cloudflare/realtimekit-react-ui';

function MyComponent() {
  return <RtkMeeting />;
}

With Properties

import { RtkMeeting } from '@cloudflare/realtimekit-react-ui';

function MyComponent() {
  return (
    <RtkMeeting
      applyDesignSystem={true}
      config={defaultUiConfig}
      gridLayout={gridlayout1}
    />
  );
}

Was this helpful?

YesNo

On this page

RtkMeeting (2) - 图1Docs

{"@context":"https://schema.org","@type":"WebPage","@id":"https://developers.cloudflare.com/realtime/realtimekit/humans/ui-kit/api-reference/react/rtkmeeting/#page","headline":"RtkMeeting","description":"API reference for RtkMeeting component (React Library)","url":"https://developers.cloudflare.com/realtime/realtimekit/humans/ui-kit/api-reference/react/rtkmeeting/","inLanguage":"en","image":"https://developers.cloudflare.com/realtime/realtimekit/humans/ui-kit/api-reference/react/rtkmeeting/og.png?v=ccf1155879c62afe","dateModified":"2026-10-19","publisher":{"@type":"Organization","name":"Cloudflare","description":"One platform for your apps, agents, and workforce. Build, secure, and scale without managing infrastructure","url":"https://www.cloudflare.com/","sameAs":["https://github.com/cloudflare","https://www.linkedin.com/company/cloudflare","https://x.com/cloudflare"],"logo":{"@type":"ImageObject","url":"https://developers.cloudflare.com/logo.svg"},"address":{"@type":"PostalAddress","streetAddress":"101 Townsend St","addressLocality":"San Francisco","addressRegion":"CA","postalCode":"94107","addressCountry":"US"},"contactPoint":[{"@type":"ContactPoint","contactType":"Customer Support","url":"https://support.cloudflare.com/","availableLanguage":["English"]},{"@type":"ContactPoint","contactType":"Sales","url":"https://www.cloudflare.com/contact/","availableLanguage":["English"]}]},"isPartOf":{"@type":"WebSite","@id":"https://developers.cloudflare.com/#website","name":"Cloudflare Docs","url":"https://developers.cloudflare.com/"}}

description: API reference for RtkMeetingTitle component (React Library) title: RtkMeetingTitle image: https://developers.cloudflare.com/realtime/realtimekit/humans/ui-kit/api-reference/react/rtkmeetingtitle/og.png?v=1d8678b25a56f256

Skip to content

Documentation Index
Fetch the complete documentation index at: https://developers.cloudflare.com/realtime/llms.txt
Use this file to discover all available pages before exploring further.