Change default theme colors of all components by changing in single file



  • how to change default theme color of all components by changing color in single file I have default-blue-theme.css but I think it is for css components and not for changing colors of tags like <ons-button> <ons-toolbar>


  • Onsen UI

    @Gaurav If you are using Onsen UI <=2.1.0 you can have a look at the old theme roller. For newer version, the same functionality is provided by this local tool. You get a copy of that when you install Onsen UI via npm in node_modules/onsenui/css-components-src/ folder.



  • @Fran-Diox thanks this will help me but css componenets and in build tags does the same work then why 2 things by 2 methods quite confusing sometimes


  • Onsen UI

    @Gaurav It’s not the same, the CSS components is just pure CSS but the “tags” have JavaScript behavior. They also automatically apply CSS classes you don’t need to write all of them manually. The second provides features like navigation, animations, side menus, etc. that you don’t have with only CSS. But it’s up to you to choose.



  • but by changing css of components this will applied to tags also ?? sometimes I have to write !important to css to apply style


  • Onsen UI

    @Gaurav Yes, the tags are using that CSS. For overwriting styles, you probably need to be more specific with your CSS selectors.


Log in to reply