Theme Provider

In order for the UI Kit components to work properly they need to acces the main theme of the app. To make your theme available throughout your app you need to add the ThemeProvider to your root component. Update your App.js file as follows:

import React from "react";
import { ThemeProvider } from "@amalgamaco/embassy-ui";

const App = () => (
    <ThemeProvider>
        {/* Your app content goes here */}
    </ThemeProvider>
);

export default App;

ThemeProvider props

theme

A custom theme config to be use instead of the default theme.

TYPE	REQUIRED	DEFAULT
IThemeConfig	No	Default theme

<ThemeProvider theme={customTheme}>
   {...}
</ThemeProvider>

Related links

• Default theme
• Extending default theme

colorMode

The color mode of the app.

TYPE	REQUIRED	DEFAULT
light	dark	No

<ThemeProvider colorMode="dark">
   {...}
</ThemeProvider>