--- title: The digital Styleguide of Your Game Race - Core --- {% include_relative partials/head.html %}
{% include_relative partials/leftNav.html %}
{% include_relative partials/topBar.html %}

Core

Typography

Font

Your Game Race uses Fivo Sans, a beautiful free font. Feel free to donate some coffee money to its creator.

Font weights

The default font weight for text is 300. Most of the default text styles will use this. The weight 400 is used for headlines and other more important text. The weight 600 is used for emphasized text as well as table headers, form labels, and some other elements. In rare cases for some elements the heavy font weight 700 is used.

This is a regular text with font-weight 300.

This is a bolder text with font-weight 400.

This is a bold text with font-weight 600.

This is a heavy text with font-weight 700.

Headlines

Headline H1 is about 48pt. Its line-height is equal.

Headline H2 is 75% of h1. Its line height is 111% of its size.

Headline H3 is 62.5 % of h1. Its line height is 120 % of its size.

Headline H4 ia 50% of h1. Its line-height is 125% of its size.

Colors

Gray

White
#FFFFFF
Headlines, Active navigation
Dark-Gray
#656C7C
Sub-headlines, Inactive navigation

Purple

Dark-purple
#6859f2
Usually used for links and in button transitions.
Purple
#6577ff
Button text is between bot purple colors.
Light-purple
#4e8cff
Usually used in button transitions.

Orange

Orange-regular
#DA6635
Secondary color for important things like links, active navigation, icons

Other action colors

Green-regular
#3ABE6B
Blue-regular
#2B9BE7

Responsive

Show elements for wide displays

Responsive elements usually use the full available width. In some cases instead of showing line breaks for small width devices, some elements can be hidden using .ygr-wide-only

05
Races played
87 Matches with 52.34% win-rate
05
Races played
87 Matches with 52.34% win-rate
05
For wide devices only
Here is some additional text