Skip to main content

Introducing Workflow Engine, try for FREE workflowengine.io.

Theme manipulation

You can control the theme (light, dark, or system default) in your application by passing the theme prop to the FormBuilder component or by directly modifying theme value in localStorage.

Setting the theme​

Using the theme property in FormBuilder component​

To set the theme in FormBuilder, simply pass one of the following values to the theme property:

  • light - forces the application to use the light theme.
  • dark - forces the application to use the dark theme.
  • system - adapts to the user's system theme preference (light or dark).

Example​

<FormBuilder
  theme="light"
  {...otherProps}
/>

Setting the theme via localStorage​

Alternatively, you can control the theme by directly setting the theme value in localStorage.

Example​

localStorage.setItem('theme', 'light');