Skip to main content

Introduction

RealtimeKit's RealtimeKit UI is a prebuilt design library of UI components that makes it easy to integrate video and voice calls into any app or website within minutes.

Usage​

The UI Kit under the hood works on top of the same Core SDK that is publicly available. Core SDK handles all the low-level media and network handling parts of a meeting and exposes methods and properties that the UI Kit uses

Uses a layered design structure, allowing you to start with one prebuilt component and slowly go down layers and add custom UI incrementally as your needs evolve.

  • Use prebuilt component: You can use prebuilt component <RtkMeeting /> to create your meeting quickly. With this component, you don't have to handle all the states, dialogs, and other aspects of managing the application. The UI kit also respect your permissions and theming configuration from the preset.

    For more information, see UI Kit Quickstart.

  • Mix and match: Use some components from our component library, build some custom components yourself. Checkout the gallery of available components

Supported Devices​

Here are the device requirements:

  • Android API Level 24 and above
  • iOS 14 and above

Features​

  • RealtimeKit UI Kit is built using React Native components. React Native Components are a built-in components that enables you to develop reusable custom elements without relying on any third-party frameworks.
  • RealtimeKit's RealtimeKit UI also provides multiple Hooks. Hooks let you use different React features from your components. This provides seamless developer experience when integrating RealtimeKit's UI Kit in your React project. You can simply import the package from @cloudflare/realtimekit-react-native, which is a hooks wrapper on @cloudflare/realtimekit. For more information, see Use RealtimeKit Core Hooks.
  • Each component uses design tokens in conjunction with CSS variables for styling. This makes the customization super simple and easy. Other than the design tokens, we've also attempted to improve the customization options, with features like Internationalisation (i18n) and Icon Packs Support.