Ant Design allows you to customize design tokens to satisfy UI diversity from business or brand requirements, including primary color, border radius, border color, etc. Design Tokens are the smallest element that affects the theme. By modifying the Design Token, we can present various themes or components.
<ConfigProvider/> component can be used to change theme. It is not required if you decide to use the default theme.
Overriding the themes
You can override or extend the default themes. You can also create your own theme. Let's see how to do this.
Use Preset Algorithms
Themes with different styles can be quickly generated by modifying algorithm. Ant Design 5.0 provides three sets of preset algorithms by default, which are default algorithm
theme.defaultAlgorithm, dark algorithm
theme.darkAlgorithm and compact algorithm
theme.compactAlgorithm. You can switch algorithms by modifying the algorithm property of theme in
Switching to dark theme
npm create refine-app@latest -- --example customization-theme-antd