> For the complete documentation index, see [llms.txt](https://fiveelementslabs.gitbook.io/tide/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://fiveelementslabs.gitbook.io/tide/white-label/simple-embeds/embedded-spaces/how-to-integrate-embedded-spaces.md).
# How to integrate embedded spaces
## Integration methods
Tide embedded spaces feature supports two different types of integrations:
1. [Basic HTML integration](#basic-html-integration)
2. [Next.js apps integration](#integration-in-a-next.js-website)
### Basic HTML integration
**Embed the space banner**
Insert the following HTML snippet into your website where you want the space banner to appear. Replace `[space-id]` with the specific ID of your space. The `data-background-color` attribute is optional and can be used to set a custom background color for the space banner. The `data-text-color` attribute is also optional and can be used to set a custom text color for the space banner. There's also the possibility to change the modal theme color, which is Dark by default. To set the Light theme simply add the `light-mode="true"` parameter.
```html
```
### Integration in a Next.js Website
**Insert Script Tag in ``**\
\
In a Next.js application, due to its server-side rendering, you need to insert the `
```
### Demo
Visit the [Tide SDK Example page](https://tide-sdk-example.vercel.app/embedded-campaign) and interact with Tide embedded spaces. This will help you understand how the integration appears and works from a user's perspective.