Applying styling such as typography and colors to a ReactJS app

Every website, app, or company has its own branding strategy to differentiate itself from others. In this section, we will pick a typography style that is suitable for our project and then change the colors and styling accordingly:

1. Pick a font that you like from https://fonts.google.com, and then we will use it as the font of our project:

   Figure 3.8 – Google Fonts

   As you can see, we have over 1,000 options here to choose from; let's pick something that you like and write down the name of it.

2. In this example, we picked something that sounds cool – Great Vibes – but is not really readable for the users as an experiment to see how it looks with our app:

   Figure 3.9 – Google Fonts – Great Vibes

3. Now open the App.css file and enter the following code block at the top of the file:

   @import url('https://fonts.googleapis.com/css2?family=Great+Vibes');

4. The CSS now...