Dashboards
Applications
UI Elements
Pages
External Link
Menu Levels
Docs
Settings

Go premium to get all the cool features!

View Plans
AboutDocsPurchase
  • Welcome
  • Introduction
  • FAQ
  • Changelog
  • Getting Started
  • Installation
  • File Structure
  • Routing and Menu
  • Multi Language
  • Theme
  • Settings
  • Theme Provider
  • Styling

Theme Provider

  1. Home
  2. /
  3. Docs
  4. /
  5. Theme
  6. /

  7. Theme Provider

useThemeContext

It provides functions to modify the theme on the runtime.

1import NiMoon from "@/icons/nexture/ni-moon";
2import NiSun from "@/icons/nexture/ni-sun";
3import { useThemeContext } from "@/theme/theme-provider";
4
5
6export default function Page() {
7  const { isDarkMode } = useThemeContext();
8
9
10  return <>{isDarkMode ? <NiMoon /> : <NiSun />}</>;
11}

It has several functions and variables.

theme
Returns

ThemeVariant

Receives

none

setTheme
Returns

void

Receives

theme: ThemeVariant

mode
Returns

system | light | dark

Receives

none

setMode
Returns

void

Receives

mode: ModeVariant

content
Returns

ContentType

Receives

none

setContent
Returns

void

Receives

content: ContentType

isDarkMode
Returns

boolean

Receives

none