应用程序样式是指用户调整组件的外观和感觉。 这些调整可能包括:颜色，颜色渐变，字体，边距/填充等。ext js 6有一种新的应用程序样式。
它使用scss的样式。 scss是编写css代码的更动态的方式。 我们可以在这个帮助下在我们的样式表中写入变量。 但是浏览器不能理解scss它只能理解css，所以所有的scss文件应该被编译成css生产就绪代码。
这就是为什么scss文件被称为预处理器文件。 在extjs中，编译通过sencha cmd工具完成。
sencha cmd手动编译它一次使用命令如下:
sencha应用程序构建[开发]
全局css是主要的css文件，它具有所有的scss变量与extjs相关联，我们可以在我们的应用程序中使用它来定制我们的主题，根据我们的需要提供不同的价值。
以下是extjs中的global_css中提供的一些css变量:
| 编号 | 变量＆描述 |
|---|---|
| 1 | $ base-color $ base-color:color（例如$ base-color:＃808080） 这个基色在整个主题中使用。 |
| 2 | $ base-gradient $ base-gradient:string（例如$ base-gradient:\'matte\'） 在整个主题中使用的基本渐变。 |
| 3 | $ body-background-color $ body-background-color:color（例如$ body-background-color:＃808080） 应用到body元素的背景颜色。 如果设置为transparent或\'none\'，将不会在body元素上设置背景颜色样式 |
| 4 | $ color $ color:color（例如$ color:＃808080） 要在整个主题中使用的默认文本颜色 |
| 5 | $ font-family $ font-family:string（例如$ font-family:arial） 在整个主题中使用的默认font-family。 |
| 6 | $ font-size $ font-size:number（例如$ font-size:9px） 要在整个主题中使用的默认字体大小。 |
| 7 | $ font-weight $ font-weight:string / number（例如$ font-weight:normal） 在整个主题中使用的默认字体权重 |
| 8 | $ font-weight-bold $ font-weight-bold:string / number（例如$ font-weight-bold:bold） 粗体字体的默认字体粗细在整个主题中使用 |
| 9 | $ include-chrome $ include-chrome:boolean（例如$ include-chrome:true） true以包含chrome特定规则 |
| 10 | $ include-ff $ include-ff:boolean（例如$ include-ff:true） true包含firefox特定规则 |
| 11 | $ include-ie $ include-ie:boolean（例如$ include-ie:true） true包括ie9和更低版本的internet explorer特定规则 |
| 12 | $ include-opera $ include-opera:boolean（例如$ include-opera:true） true包含opera特定规则 |
| 13 | $ include-safari $ include-safari:boolean（例如$ include-safari:true） true包含opera特定规则 |
| 14 | $ include-webkit $ include-webkit:boolean（例如$ include-webkit:true） true包括webkit特定的规则 |
