Generate dynamic theme files for Ant Design by processing LESS variables to enable runtime color changes.
antd-theme-generator is a Node.js script that generates a color.less file from Ant Design's LESS variables, enabling dynamic theme changes in the browser. It processes custom LESS files and extracts theme variables to create a stylesheet that can be updated at runtime without a full rebuild.
Frontend developers using Ant Design who need to implement dynamic theme switching or runtime color customization in their applications.
It provides a lightweight solution for dynamic theming with Ant Design by generating optimized color stylesheets, avoiding the need for complex build processes or manual LESS compilation during runtime theme updates.
This script is to generate color.less file to update color related css in browser.
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.
Enables live theme color changes in the browser using less.js, as shown with window.less.modifyVars, allowing users to update themes without rebuilding CSS.
Processes user-defined LESS files and variables through options like varFile and themeVariables, facilitating deep customization of Ant Design themes.
Includes default regex for color functions and allows customColorRegexArray, ensuring accurate extraction of complex color values from LESS files.
Can write generated styles to outputFilePath or return them programmatically, offering adaptability for various build and deployment workflows.
Requires loading less.js in the browser for runtime updates, adding JavaScript overhead and potential compatibility issues with modern frameworks.
Only works with LESS-based projects, making it unsuitable for teams using SASS, CSS-in-JS, or vanilla CSS, which limits its versatility.
Manual setup of paths, variable files, and regex patterns can be error-prone and requires a good understanding of Ant Design and LESS structure.