Ant Design Dynamic Theme | Light vs Dark Theme Switcher | Ant Design Theme Customization in React J

Описание

#reactjs #antd #theme
In this Ant Design Dynamic Theme tutorial I have explained how to do Ant Design Theme Customization in React JS and how to switch between Light and Dark Themes.

This video focuses on
- How to do Ant Design Theme Customization in React JS
- How to create them using ant design v5 configProvider theme prop
- How to switch between Light and Dark Themes using antd theme config provider
- How to create custom ant design dynamic theme in react js
- How to set or change primary color of ant design components
- How to use Ant Design config provide theme token
- How to create two different themes in react js using antd v5
- How to create child thems to override parent thems in ant design react js
- How to set inherit as false to use default antd theme inside a custom theme
- How to create custom component based them using ant design v5 and react js
- How to get current theme style or property value inside child components
- How to consume current theme token properties in child components of react js
- How to use useState to track current selected theme and switch between themes dynamically
- How to apply them on the fly using antd v5 config provider

If you are new to ant-design, I have already added an intro video on ant-design and overview of its components at https://www.youtube.com/watch?v=03rzGKtEZmw link, please go through that video to set up the ground for further components implementation.

For more details on ant-design theme and to see the list of css properties that can be used inside a theme, please visit its documentation at https://ant.design/docs/react/customize-theme-cn

Happy Coding!