Theme.plist file and keys

All the visual themeing can be configured with the single theme.plist file.

A minimum set of properties listed below are required for the app theme. These default properties and values will propagate through the app’s user interface, however most element's properties can be overridden using more specific keys. Colors can be specified as hex values (eg. #32FA56).

Element-specific fonts require both a Font and a FontSize property; in all cases make sure the font name is the full name or postscript name (e.g. Picker.FilterTabs.Font and Picker.FilterTabs.FontSize). Font sizes can be set with real values. As an example: enter 16 as a real value and assume units are pixels.

<key>Picker.EditionLabel.TextColor</key>
 <string>#383737</string>
 <key>Picker.EditionLabel.FontSize</key>
 <real>16</real>
 <key>Picker.EditionLabel.Font</key>
 <string>fonts/OpenSans-Bold</string>

It's also possible to specify different values for phone and tablet, by adding  ~phone or ~tablet to the key names (e.g. Document.BackgroundColor~phone).

This is the Theme.plist:

Minimum theme properties to be set:

• FontName
• BoldFontName
• PrimaryColor
• SecondaryColor
• PrimaryBackgroundColor
• SecondaryBackgroundColor
• SelectionBackgroundColor
• ToolbarColor

Additionally, you can specify fonts that should be used within your content by using the Content Fonts key and providing a dictionary of font name (as key) and relative path to the font in the assets folder (as string).

The plist file can be extended to include any additional keys to theme the app to your design specification. Just add the Key, Type and Value.

A full set of available theme keys can be found here. Use our design guides to understand what keys are used where.