Theme resources

A theme is a style that's applied to your entire app, activity or view hierarchy rather than an individual view. By default, Sendbird UIKit for React provides two themes: Light and Dark. Customized themes that fit your brand identity can also be created by changing the style and color set.

import App from "@sendbird/uikit-react/App";
import "@sendbird/uikit-react/dist/index.css";

const MyApp = () => {
    return (
        <Route id={'/chat'}>
            <App userId={userId} appId={appId} theme="dark" />
        </Route>
    );
};

UIKit for React provides two themes: Light and Dark. Its themes can be applied using the App and SendbirdProvider components.

This is the default Light theme for UIKit if another theme hasn't been specified.

To view the image in full screen, click on the

The Dark theme is as shown below:

To view the image in full screen, click on the