Skip to main content

Call Preview and Thumbnail

Depending on your call type settings, our system can occasionally generate a preview image (thumbnail) for your call. You can use this image to show a preview of the call in your app, typically in a lobby, waiting room, etc.

Get the preview thumbnail

import { useCallStateHooks } from '@stream-io/video-react-sdk';

const { useCallThumbnail } = useCallStateHooks();
const thumbnail = useCallThumbnail();


Show the preview thumbnail

Our React Video SDK provides a built-in component to show the preview image. You can use it like this:

import { CallPreview } from '@stream-io/video-react-sdk';

export const MyComponent = () => {
return (
<div className="my-container">
style={{ width: '240px', height: '135px' }}

Optionally, it accepts className and style props, so you can style it as you wish.

Did you find this page helpful?