More information on it here: Help:infoboxes
An infobox design is made of 2 parts
1: layout
This infobox is using Help:Infoboxes
The above infobox layout is here
2: styling
That is stored in MediaWiki:Infoboxes.css. To stop vandalism, only Admins of the wiki can add or edit.
The color schemes are controlled by a "switchword" in the 1st row of the infobox. In this infobox is "nation"
<infobox theme-source="nation">
Then it picks the "nation" styling from MediaWiki:Infoboxes.css
In this example is water
/*Water*/ .pi-theme-water, .pi-theme-Water, .pi-theme-Waterbending, .pi-theme-Dark-Avatar { border: 1px solid #006 !important; } .pi-theme-water .pi-title, .pi-theme-Water .pi-title, .pi-theme-Waterbending .pi-title { background-color: #006 !important; } .pi-theme-water .pi-header, .pi-theme-Water .pi-header, .pi-theme-Waterbending .pi-header, .pi-theme-water .pi-navigation, .pi-theme-Water .pi-navigation, .pi-theme-water .pi-image-collection-tabs, .pi-theme-Water .pi-image-collection-tabs { background-color: #039 !important; } .pi-theme-water .pi-collapse .pi-header:not(:first-child) { background-color: #294364 !important; } .pi-theme-water .pi-collapse nav { background-color: #ddddff !important; }
If only have 1 color-scheme, it won't need to be so complex