Google Fonts

Internet search / Google / Web-master

Google Fonts

Google Fonts

The service for introducing fonts to the site.
There is no Russian version, but there are Russian fonts (Cyrillic).

Advantages

The fonts are on the Google server and not on your website. Saves time and increases download speed.

What should I do?

Attention, the service is developing, the number of fonts and features is growing, so changes are possible on the site.
  1. Script: - Select Cyrillic or Cyrillic Extended

  2. At the top of the Preview Text:, you can enter your text, size (Size :) and Sort the fonts alphabetically, popularity ... I chose by popularity. We are looking for the best font from the less popular ones, less popular is less likely to use it and it will be more original.

  3. We select the font for the title (Sentence) or text (Paragraph), depending on how we want to use.

    The beautiful font for the title may not be readable in the text.

  4. Choose the font that best suits us Add to Collection And Quick-use.

  5. We take the code that will be placed in
    <HEAD>
    . He's at 3. Add this code to your website: This is a link like
    <link 
      href='https://fonts.googleapis.com/CSS?Family=PT+Sans&subset=cyrillic' 
      rel='stylesheet' type='Text/CSS'>
  6. Go back and click on the blue Review field (may need to open) and select the font (bold, italic ...) if the font allows it.
In the Test Drive tab, we go through the menu in the right column. There you can set up a lot, it will be more difficult to describe, you will be able to visually see and select, adjust. At the bottom of the main field on a gray background there will be a code like:

 font-family: 'Ubuntu Condensed', sans-serif;
  font-style: normal;
  font-weight: 400; font-size: 13px;
  text-transform: none;
  text-decoration: none;
  letter-spacing: 0em;
  word-spacing: 0em; line-height: 1.4;

Copy it and put it where we need it in CSS. font-style: normal; font-weight: 400; font-size: 13px; text-transform: none; text-decoration: none; letter-spacing: 0em; word-spacing: 0em; line-height: 1.4;

Copy it and paste it into CSS.