@hashir first you need to create a css file containing all new colors for specific data-theme and include it in hooks for example :
[data-theme=red]{
--primary:#ff000;
}
next copied the switcher class from theme_switcher.js to my custom app and add new red theme to the fetch_theme function . and include your js to the hooks .
next open navbar settings , hide the old button and create new one that using the new switcher class .
when this works fine you can create new doctypes and python codes to add new themes dynamically from the ui .