Theme Ext JS apps visually and without writing Sass code
Sencha Themer empowers you to style Ext JS 6 apps and make them look great. You can create custom themes using graphical tools – without writing code. Themer gives you access to Ext JS components and inspection tools to set fine-grained styles and generate theme packages with dynamic stylesheets.
With the innovative color palette in Themer, it’s easy to apply different color combinations to different component states. The color palette shows base, body background, and font color with progressively lighter and darker colors. There is also a palette that helps you select colors from Material Design. The Themer font management option allows you to quickly add web fonts from Google fonts.
Theme with a Pre-Built App
Sencha Themer provides a pre-built example app that has many Ext JS components you can theme. Based on the toolkit you select, you can customize any Ext JS theme including Material, Triton, and iOS. You can easily theme global variables including base color, background color, font, gradient, and more.
Create a Distinct Style
Ext JS components have a UI mixins configuration for generating multiple visual renditions of a component. Themer makes it easy to create and style UIs for a large number of components including Grid, List, Tabpanel, Title bar, and Form components. With Themer, you get access to all Sass variables to customize and create a distinct look for your application components.
Inspect and Theme Your App
With Themer, you can inspect component styles visually rather than going through hundreds of Sass variables. Themer provides a unique inspect mode that freezes the state of components and locks the styles, so you can easily apply different styles to various states of components such as hover, pressed, selected. Using Inspect mode, you get access to your application component tree, which provides a powerful way to navigate, select, and style components in your app.
Export and Share Your Theme
Once you’re happy with your theme, a single click will export the theme as an Ext JS package. You can then share the theme with other users, add to workspaces, “publish” the theme to any Ext JS app, or import your new theme into Sencha Architect.
Themer is available as part of the Ext JS Pro and Premium packages. Try Sencha Themer free for 30 days by downloading the Ext JS trial. The confirmation email includes a link for Themer, so you can just select it if you’ve already downloaded Ext JS.