Themes
View as MarkdownYou have full control over the look and feel of your chat UI and notification emails, so they match the style of your site or app.
How you customize your theme depends on how you've added TalkJS to your project. The following table gives an overview of the customization options.
| Building with | Customize using |
|---|---|
| React components, Web components (any framework) | Theme components |
| Flutter, React Native, Classic React SDK, Clasic JavaScript SDK | Theme editor |
| Email themes | Email theme editor |
If you’re using React components or web components, you can edit your theme directly in your project code. This way you have full control over both the appearance and behavior of your chat. You can:
- Choose from a range of prebuilt themes.
- Start from a base theme and fully customize it with your own HTML, CSS, and JavaScript.
- Build a fully custom theme from scratch.
See the getting started guide of your preferred framework for installation and customization steps.
If you're using Flutter, React Native, or the classic React or JavaScript SDK, then you can manage your themes from the Themes page of your TalkJS dashboard. Here you can:
- Choose from a range of prebuilt themes.
- Start from a base theme and customize much of its HTML and CSS directly in the dashboard.
See the theme reference docs for customization guides.
Email themes let you customize the look of your notification emails, using the same dashboard-based editor across all frameworks. See: Email themes to get started, or Email component for the full component reference details.
Themes let you create a chat experience that looks and feels like familiar apps. Check out the following guides to build themes inspired by platforms such as: