Coral is a thoroughly developed design system widely adopted by developers and designers for creating beautiful and user-friendly Sea internal products.
Copyright © 2018-2025 Sea Labs
BackgroundProvider
BackgroundProvider helps to toggle between using the onLightBg theme and the onDarkBg theme. For example, in Toast component, the contents are wrapped in BackgroundProvider to use onDarkBg theme.
In the following example, Button is placed on a dark background, so by using isDarkBg prop in BackgroundProvider, the hover and pressed interactions are automatically toggled to the right states correctly.
View code
API
BackgroundProvider
| Prop name | Type | Default | Description |
|---|---|---|---|
| isDarkBg | boolean |