Wiki source code of Style Variables

Last modified by superadmin on 2026/10/14 18:26

Hide last authors
Eleni Cojocariu 1.4 1 **A style variable represents a value shared across all of XWiki's style sheets.** These values are meant to be used instead of hard-coding them in stylesheets. Our [[CSS codestyle>>doc:dev:Community.CodeStyle.XhtmlCssCodeStyle.WebHome||anchor="HCSS"]] makes the use of these variables mandatory in XWiki Standard development. It's recommended to rely on those for your own custom developments too. :)
Lucas Charpentier 1.1 2
3 They provide some level of consistency in the UI:
4
Eleni Cojocariu 1.3 5 * It will be harder for customizations to get unexpected results.
Lucas Charpentier 1.1 6 * XWiki can provide colors that work well together by default. Among other things, it can help make sure all your components respect some minimum contrast.
7 * It's custom UIs using these colors will be compatible with any color theme.
8
9 Style variables are provided by the skin you are using. For XWiki Standard, this skin is Flamingo. All documentation in here will describe specifically the style variables provided by Flamingo.
Lucas Charpentier 1.2 10
11 Currently, the Flamingo Skin supports three kinds of style variables. They are (ranging from the oldest to the newest):
12
Lucas Charpentier 3.2 13 * The Colibri colorTheme variables
Lucas Charpentier 1.2 14 * The LESS variables (Flamingo colorTheme + design system inherited from bootstrap + Misc additions from the Flamingo skin)
15 * {{version since="17.3.0RC1"}}The CSS properties{{/version}}
16
17 (% class="wikigeneratedid" %)
Eleni Cojocariu 1.5 18 All of these variables are supposed to be used in ##.css## files, ##.less## files and their respective StyleSheet Extensions's contents.

Get Connected