Web/CSS Fonts



I’m trying to build a UI and want to use custom fonts, such as Roboto for example.
Usually I’d use css to define the font using @font-face.
How could I do something similar in my wisej application ?

Andi Gordon

  • You must to post comments
Best Answer

Wisej defines all its visual properties in the single theme files: https://wisej.com/docs/html/Themes.htm

Colors, fonts and images are all indirected to simplify the management of the themes and the handling of the data. For example, instead of setting an image or a color or a font by value, you simply set it by the name defined in the theme. The built in themes define 4 fonts: “default”, “window-title”, “defaultBold”, and “menu”. You can modify one of these, or add new fonts. Then in your app you assign the font using the name in the theme, this way when a theme changes everything is updated automatically.

The font definition in the theme has many options, fortunately they are all handled visually using the theme builder. You can define only few properties or define multiple families and multiple sources.

The json definition below changes the “default” font family to “roboto”, “arial”. I have also attached the actual mixin file. You can add it to /Themes to override any theme loaded by the app.

“fonts”: {

“default”: {
“size”: 13,
“family”: [ “roboto”, “arial” ],
“sources”: [
“family”: “roboto”,
“source”: [ “https://fonts.gstatic.com/s/roboto/v15/CWB0XYA8bzo0kSThX0UTuA.woff2” ]




  • You must to post comments
Showing 1 result
Your Answer

Please first to submit.