Decorator

Glyphs Icons: Small icons sprite 14x14 Visit Glyphicons

All of the icon sprites are available in many different colors. For more info on available colors, please check out the icons directory and icons-decorator.css file included with decorator framework. You can easily get access to all of the icon sprites by placing icons-decorator.css file under main decorator.css file.

Lets say you want to change the icon sprite color, you can do so by changing the path of the sprite in your theme.css file as shown in example below:

[class^="si_"], [class*=" si_"] {
     background-image: url("../img/small/glyph-small-blue.png");
}

Glyphs Icons: Big icons sprite 32x32 Visit Glyphicons

Lets say you want to change the icon sprite color, you can do so by changing the path of the sprite in your theme.css as shown in example below:

[class^="bi_"], [class*=" bi_"] {
     background-image: url("../img/big/glyph-big-blue.png");
}

Glyphs Icons: Social icons sprite 24x24 Visit Glyphicons

Lets say you want to change the icon sprite color, you can do so by changing the path of the sprite in your theme.css as shown in example below:

[class^="so24_"], [class*=" so24_"] {
     background-image: url("../img/social/so24-gray-blue.png");
}

Flag Icons: 16x16 flag icons

Flag icons are available in glossy and flat styles
If you want to use flat instead of glossy, you can do so by changing the path of the sprite in your theme.css as shown in example below:

[class^="f16_"], [class*=" f16_"] {
     background-image: url("../img/flags/f16.png");
}

Flag Icons: 24x24 flag icons

Flag icons are available in glossy and flat styles
If you want to use flat instead of glossy, you can do so by changing the path of the sprite in your theme.css as shown in example below:

[class^="f24_"], [class*=" f24_"] {
     background-image: url("../img/flags/f24.png");
}

Flag Icons: 32x32 flag icons

Flag icons are available in glossy and flat styles
If you want to use flat instead of glossy, you can do so by changing the path of the sprite in your theme.css as shown in example below:

[class^="f32_"], [class*=" f32_"] {
     background-image: url("../img/flags/f32.png");
}

Flag Icons: 48x48 flag icons

Flag icons are available in glossy and flat styles
If you want to use flat instead of glossy, you can do so by changing the path of the sprite in your theme.css as shown in example below:

[class^="f48_"], [class*=" f48_"] {
     background-image: url("../img/flags/f48.png");
}

Flag Icons: 64x64 flag icons

Flag icons are available in glossy and flat styles
If you want to use flat instead of glossy, you can do so by changing the path of the sprite in your theme.css as shown in example below:

[class^="f64_"], [class*=" f64_"] {
     background-image: url("../img/flags/f64.png");
}