[ Web Proxy ]
URL:
Viewing: https://developers.cloudflare.com/realtime/realtimekit/ui-kit/component-library/#rtk-header [Back]  [Original]
Component Library Cloudflare Realtime docsSkip to content
[]DirectoryAPISDKsChangelog
SearchCtrlKLog in
Realtime
/
  1. Home
  2. /Realtime
  3. /…
    RealtimeKit
  4. /Build using UI Kit
  5. /Component Library

Component Library

Last updated Apr 21, 2026Copy as MarkdownView as MarkdownAgent setup

The UI Kit components library provides a comprehensive set of pre-built, customizable components that you can use to build your own custom meeting interface.

WebMobile
ReactWeb ComponentsAngular

Note

All UI Kit components are built on top of Web Components, regardless of which framework (React/Angular) you use. They render as Web Components in the browser DOM.

Component naming conventions:

  • Web Components and Angular: Use kebab-case (e.g., rtk-meeting)
  • React: Use PascalCase (e.g., RtkMeeting)

React and Angular components are wrappers around the same underlying Web Components, so functionality is identical across all frameworks.

Component Gallery

Search through the comoponent gallery for the component you need.

Basic Components

Small, reusable building blocks for your UI.

Avatar [Avatar]
RtkAvatar
Audio Visualizer [Audio Visualizer]
RtkAudioVisualizer
Button [Button]
RtkButton
Clock [Clock]
RtkClock
Header [Header]
RtkHeader
Meeting Title [Meeting Title]
RtkMeetingTitle
Recording Indicator [Recording Indicator]
RtkRecordingIndicator
Spinner [Spinner]
RtkSpinner
Switch [Switch]
RtkSwitch
Tooltip [Tooltip]
RtkTooltip

UI Components

Interactive controls and interface elements.

Control Bar [Control Bar]
RtkControlbar
Control Bar Button [Control Bar Button]
RtkControlbarButton
Dialog [Dialog]
RtkDialog
Emoji Picker [Emoji Picker]
RtkEmojiPicker
Grid Pagination [Grid Pagination]
RtkGridPagination
Menu [Menu]
RtkMenu
Name Tag [Name Tag]
RtkNameTag
Notification [Notification]
RtkNotification
Participant Count [Participant Count]
RtkParticipantCount
Participant Tile [Participant Tile]
RtkParticipantTile
Plugin Main View [Plugin Main View]
RtkPluginMain

Composite Components

Complete, feature-rich components combining multiple elements.

Chat [Chat]
RtkChat
Grid [Grid]
RtkGrid
Image Viewer [Image Viewer]
RtkImageViewer
Leave Meeting [Leave Meeting]
RtkLeaveMeeting
Mixed Grid [Mixed Grid]
RtkMixedGrid
Participants [Participants]
RtkParticipants
Participants Audio [Participants Audio]
RtkParticipantsAudio
Plugins [Plugins]
RtkPlugins
Polls [Polls]
RtkPolls
Screenshare View [Screenshare View]
RtkScreenshareView
Settings [Settings]
RtkSettings
Settings Audio [Settings Audio]
RtkSettingsAudio
Settings Video [Settings Video]
RtkSettingsVideo
Sidebar [Sidebar]
RtkSidebar
Simple Grid [Simple Grid]
RtkSimpleGrid
Spotlight Grid [Spotlight Grid]
RtkSpotlightGrid

Screen Components

Full-screen views for different meeting states.

Ended Screen [Ended Screen]
RtkEndedScreen
Idle Screen [Idle Screen]
RtkIdleScreen
Meeting Screen [Meeting Screen]
RtkMeeting
Setup Screen [Setup Screen]
RtkSetupScreen
PreviousState ManagementNextBuild Your Own UI

Was this helpful?

YesNo
Edit pageReport issue

On this page

Edit pageReport issue
Getting started
PlansContact salesPartnersFind a partnerStartupsUnder attack?Domain name search
Company
AboutCareersInvestorsPressPress kitGlobal network
Public interest
Project GalileoAthenian ProjectCloudflare for CampaignsProject FairshotImpact/ESG
Compliance
Compliance resourcesTrust HubData ProtectionResponsible AITransparency reportReport abuse
Resources
App innovation reportCloudflare RadarCase studiesStatusSupportEventsBlog
Developers
DocumentationLearning centerCommunity
Solutions
SSE and SASE platformCloudflare AI CloudAI SecurityFrontend Development PlatformMulti-Tenant Platform DevelopmentWeb Security Platform
Start BuildingLog In
2026 Cloudflare, Inc.
Privacy policy| Report security issues| Terms of use| Trademark
privacy options [privacy options]Your privacy choices
[]
Web Proxy Viewer  |  New URL  |  Original Page