With 2.1 release, Flexyscore has introduced a new function that allows you to select your favorite template by choosing it from the gallery, or enter your custom template via URL.

When you create a new scoreboard you can choose from the drop down menu your favourite style, Flexyscore will remember your preference and on the next time will propose the same style.
Of course, you can choose from time to time which template to adopt.

Discover all new styles

Browse the gallery

In the same way you can create your own style and insert it into Flexyscore via the console. Just enter the URL in the field below.

In the following paragraphs how to customize the Scoreboards

Power of CSS makes you free

Flexyscore's scoreboards are "simple" html pages that can be modified in their appearance through style sheets (CSS). This way any web developer, graphic designer or anyone who knows even just the basics of this language can easily customize them in all their parts.

We have developed scoreboards in the simplest way possible in order to give anyone the possibility to make their own changes in a simple and direct way. Colors / Characters / Aspect ratio / Dimensions / Backgrounds / Element position are all configurable.

How to Plug In your own CSS

There are TWO possible ways:

1st) Using the function inside the console (as explained above, by entering the Url). All your scoreboards will be generated with the same graphic style, regardless of where you insert them.

2nd) By inserting the style directly into your system, this choice allows you to differentiate the graphics for different types of use. Eg; if you use the same scoreboard for both live streaming and to project the score inside the sports hall you can use different styles.

Every broadcasting software that integrates the WebView functionality allows you to insert your own CSS. On the right, the example of OBS. This panel is accessible from the source properties.

By writing your CSS in the properties the default styles will be overwritten changing the appearance of the Scoreboard.

Once the scoreboard has been modified, your software will save all settings (including styles), so you can reuse them in the next match.

However, you can manually save the CSS on your server and call it with the function @import url('https://www.yoursite.com/mystyle.css')

HTML Scoreboards Schema

To help you we have published the code of all the templates on Codepen, giving some examples of custom CSS. You can use these examples to edit styles, save them, and use them in your broadcasting software.

If you are unfamiliar with CSS we recommend the great guides of w3schools.com.

Soccer / Hockey / Rugby

This is the default Flexyscore template

Below you can see an example of how this can be edited with CSS

Basketball scoreboard

This is the default Flexyscore template

Below you can see an example of how this can be edited with CSS

Volleyball & Table Tennis

This is the default Flexyscore template

Below you can see an example of how this can be edited with CSS

Football scoreboard

This is the default Flexyscore template

Below you can see an example of how this can be edited with CSS

Tennis scoreboard

This is the default Flexyscore template

Below you can see an example of how this can be edited with CSS

Baseball scoreboard

This is the default Flexyscore template

Below you can see an example of how this can be edited with CSS