Overview
Frontends are the user-facing interfaces that connect to your LiveKit Agents, enabling realtime communication over audio, video, text, and data streams. LiveKit provides SDKs and tooling to build responsive, production-ready frontends for web, mobile, and telephony apps.
Agents communicate with frontends through LiveKit rooms using WebRTC, which delivers fast and reliable realtime connectivity. LiveKit SDKs handle media transport, connection management, and state synchronization ensuring your frontends stay reliable and performant.
Frontend types
LiveKit Agents support multiple frontend platforms and use cases:
Web & mobile frontends
Build frontends that connect to your agents using JavaScript, Swift, Android, Flutter, React Native, and more.
Telephony integration
Integrate your agents with traditional and IP-based telephony systems to make and receive phone calls.
Key concepts
Understand these core concepts to build effective frontends for your LiveKit Agents.
UI components
LiveKit provides prebuilt UI component libraries for popular frontend frameworks that simplify building realtime audio and video applications:
- Agents UI: The fastest way to build web based, multi-modal, agentic experiences
- React components: React components and hooks for building realtime applications.
- Swift components: SwiftUI components for iOS, macOS, visionOS, and tvOS
- Android components: Jetpack Compose components with Material Design
- Flutter components: Cross-platform widgets for mobile and desktop
Agents UI
The fastest way to build web based, multi-modal, agentic experiences.
UI components overview
Learn about the available UI component libraries and how to use them.
Authentication
All LiveKit frontends require JWT-based access tokens to connect to rooms. Tokens encode participant identity, room permissions, and capabilities, and are generated by a backend server. Tokens can either be generated by LiveKit on your application's behalf or manually on your own infrastructure.
Authentication guide
Learn how to generate tokens, configure grants, and manage permissions for your frontends.
Telephony
Integrate your frontends with telephony-based communication systems to enable voice AI agents to make and receive phone calls. LiveKit telephony enables callers to join LiveKit rooms as SIP participants and your frontend can display call status and handle call controls.
Telephony overview
Learn how to build frontends that work with voice AI agents handling phone calls.
Getting started
Choose your platform to get started building a frontend for your agent:
Web & mobile quickstart
Get started with web and mobile frontends using starter apps and platform-specific guides.
Telephony quickstart
Enable your agent to handle phone calls through SIP integration.
Additional resources
For complete SDK documentation, API references, and advanced topics, see the Reference section.