Підбір шрифтів і каталог Google Fonts
Перегляньте підібраний каталог популярних шрифтів Google Fonts із живим прев'ю, фільтруйте за категорією та шукайте за назвою, потім копіюйте готовий до вставлення CSS і досліджуйте запропоновані пари шрифтів — усе у вашому браузері.
Усе працює у вашому браузері — шрифти завантажуються з Google Fonts лише для живого прев'ю, нічого не вивантажується, без реєстрації, повністю безкоштовно.
Заголовок, набраний акцидентним шрифтом
А ось абзац основного тексту, набраний парним текстовим шрифтом. Вдалі пари шрифтів врівноважують характер і читабельність: виразний заголовковий шрифт привертає увагу, а чистий і зручний основний шрифт робить довгі фрагменти легкими для читання. Натисніть «CSS», щоб скопіювати обидва рядки @import та правила font-family для ваших заголовків і основного тексту.
Про Підбір шрифтів і каталог Google Fonts
Цей каталог шрифтів збирає 80 популярних Google Fonts на одній сторінці з можливістю пошуку, кожен зображений як живий зразок з рядком-панграмою, рядком алфавіту й цифр та значком категорії. Він охоплює п’ять родин шрифтів — без засічок, із засічками, декоративні, рукописні та моноширинні, — тож ви можете порівнювати реальні форми літер замість того, щоб здогадуватися за назвами.
Кожна картка шрифту містить підібрані пропозиції поєднань: партнерські шрифти, що добре працюють разом для заголовків і основного тексту. Клацання на чипі пари відкриває попередній перегляд, який встановлює заголовок в одному шрифті, а абзац — в іншому, тож ви можете оцінити поєднання в контексті, перш ніж обрати його.
Коли шрифт чи поєднання підходять, одним кліком копіюється готовий до вставки CSS — рядок @import для таблиці стилів Google Fonts плюс відповідний стек font-family з розумним резервним варіантом. Шрифти завантажуються з Google Fonts лише для живих переглядів; нічого з того, що ви вводите, нікуди не завантажується.
Як використовувати Підбір шрифтів і каталог Google Fonts
- Перегляньте картки шрифтів, кожна з яких показує назву, значок категорії та живий приклад тексту, встановлений реальним шрифтом.
- Скористайтеся полем пошуку, щоб знайти шрифт за назвою, або клацніть чип категорії (Sans-serif, Serif, Display, Handwriting, Monospace), щоб відфільтрувати сітку.
- Перетягніть повзунок розміру (16–72 px), щоб переглянути зразковий рядок у потрібному розмірі заголовка чи основного тексту.
- Клацніть чип «Pairs with» або кнопку «Preview pairing», щоб побачити заголовок і абзац основного тексту, встановлені в запропонованому поєднанні.
- Клацніть кнопку «CSS» на картці або в попередньому перегляді поєднання, щоб скопіювати рядок @import і оголошення font-family в буфер обміну.