🎨 Theme

The FlexNative Theme Context is part of the FlexNative and is available under the @flexnative/theme-context NPM package.

The theme object is where you define your application's color palette. By default there are two color palette light or dark from @flexnative/theme-context. You also can extend BaseTheme object to add custom/extra colors.

Installation

You can installing FlexNative Local Storage packages using npm:

npm i @flexnative/theme-contex

📄️ Default Theme

First of all you need to install @flexnative/theme-context.

📄️ Customizing Themes

BaseTheme object is where you define your application's color palette.

📄️ Consuming Themes

This section show how to consume (use) theme colors for your components.

📄️ Extra Theme Colors

If you need to customize the default theme by adding custom colors to match your design requirements,

📄️ Example

Below example shows a full example how to extend ThemeProvider and implement setColorScheme method to support to dark mode