').prependTo(".header-wrap nav.nav-secondary"), $('body').addClass('top-announcement'); })(jQuery);
Sencha
Sencha Themer

Sencha Themer

Rapidly style Ext JS application by creating custom themes using graphical tools - without writing code.

START FREE TRIAL

Everything You Need to Theme Stunning Web Apps

Overview

Sencha Themer - Overview

Theme apps visually without writing Sass code

Sencha Themer empowers you to style Ext JS app and make them look great. You can create custom themes using graphical tools – without writing code. Themer gives you access to 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.

Use Pre-Built App

Sencha Themer - Pre-Built

Theme with a Pre-Built App

Sencha Themer provides a pre-built example app that has many Ext JS component you can theme. You can create custom themes by customizing any base theme including Material, Triton, and iOS. You can easily theme global variables including base color, background color, font, gradient, and more.

Custom Theme

Sencha Themer - Custom Themes

Create a Distinct Style

Ext JS component 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 & Theme

Sencha Themer - Inspect Themes

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 & Share

Sencha Themer - Export and Share

Export and Share Your Theme

Once you’re happy with your theme, a single click will export the theme as a theme 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.

Design Better Applications with Sencha Themer

Themer for Ext JS

Ext JS is the most robust, comprehensive JavaScript framework for building enterprise-grade, data-intensive web apps for desktop, tablets, and smartphones. It provides the largest set of rich, customizable UI components, all designed to work together seamlessly. Themer ensures that you deliver a consistent, polished look and feel for a superior user experience. Try it as part of a 30-day Ext JS trial.

GETTING STARTED

SUPPORTED FRAMEWORKS

  • Ext JS 6.0+

SUPPORTED SUBSCRIBERS

OTHER RESOURCES

Build Web Apps Faster

with Sencha JavaScript Frameworks and 140+ High Performance UI Components

START FOR FREE