Appearance

< All Topics
Print

Appearance

smartChord offers a wide range of options to change the appearance to suit your taste. There are different app themes to change the colors of the app’s screens or there are various color schemes that associate colors with notes.

The s.mart songbook offers additional options for customizing the appearance to your own taste.

Light or dark mode

Independent from the app themes which provide dark and light themes, the songbook does have its own dark mode. The dark mode shows the song with a dark background in a dark color scheme. It could be the better choice for your live performance in the dark pub or to reduce battery consumption. You can change this mode in the ‘Songbook appearance’ settings.

Color variants

You can customize the colors of the songbook sections according to your taste or possible visual impairment. The Appearance settings allows to define a color set for light and dark mode and also for the printout. You can select one of the predefined color variants and customize it if you wish. Separate text and background colors are possible for:

  • Verse
  • Chorus
  • Pre-Chorus
  • Bridge
  • Interlude
  • Highlight
  • Default (all other texts)
  • Chords color

There is a preview screen for about 40 predefined color variants:

Text color

There are two directives for changing the color of the text or its background. The directive {textcolor:color} changes the color of the text that follows. The directive {textcolor} without a color value resets the text color to the previous color. The directive {background:color} changes the background color of the text that follows. The directive {background} without a color value resets the background color to the previous background color. Please note that these directives cannot be mixed.

The color value must either be a valid HTML color name or a hexadecimal color code, such as #4491ff.

{textcolor:RED}
The directive {textcolor:RED} sets the text color to RED.
The text color is valid ...
{textcolor:BLUE}
... until the directive {textcolor} sets or resets a new text color 
{textcolor}
The text color has been reset to the previous
{textcolor}
The text color has been reset to the default

{background:maroon}
The directive {background:maroon} sets the text background color to maroon.
{textcolor:WHITE}
The directive {textcolor:WHITE} sets the text color to WHITE.
The directives {textcolor} and {background} can be used together, but only nested.
{textcolor}
{background}

{textcolor:#099620}
The color value must either be a valid HTML color name or a hexadecimal color code, such as #099620.
{textcolor}

Font

You can also select a font of your liking in the settings.

Table of Contents