Бесплатные шрифты с кириллицей: 38 шрифтов с живым превью
38 бесплатных шрифтов с поддержкой кириллицы для сайтов, дизайна и документов: без засечек, с засечками, заголовочные, рукописные и моноширинные. Проверьте на своём тексте прямо на странице, подберите удачную пару для заголовков и текста и узнайте, как установить шрифт в Windows, macOS и Linux и подключить на сайт.
Найти красивый шрифт несложно. Найти красивый шрифт, у которого есть нормальная кириллица, который бесплатен и который можно законно поставить на сайт или в коммерческий макет, — уже задача. Половина «бесплатных шрифтов» в поиске либо без русских букв, либо с кириллицей, дорисованной кое-как, либо с лицензией только для личного использования.
Ниже 38 шрифтов, у которых всё в порядке с каждым из трёх пунктов. Напишите свой текст в поле — и он сразу покажется всеми шрифтами. Можно менять размер, включить жирное начертание и посмотреть светлый текст на тёмном фоне. Кнопка «Скопировать CSS» даст готовую строку для сайта.
Съешь же ещё этих мягких французских булок, да выпей чаю
Интерфейсы и сайты: отлично читается на экране в любом размере
Съешь же ещё этих мягких французских булок, да выпей чаю
Геометрический, для заголовков и лендингов
Съешь же ещё этих мягких французских булок, да выпей чаю
Современный гротеск для сайтов и приложений
Съешь же ещё этих мягких французских булок, да выпей чаю
Сделан ParaType для государственных сайтов — хорош в интерфейсах и формах
Съешь же ещё этих мягких французских булок, да выпей чаю
Свежий гротеск для текста и интерфейсов
Съешь же ещё этих мягких французских булок, да выпей чаю
Мягкий, со скруглёнными окончаниями
Съешь же ещё этих мягких французских булок, да выпей чаю
Слегка скруглённый и дружелюбный
Съешь же ещё этих мягких французских булок, да выпей чаю
Классика рунета из проекта «Общедоступные шрифты народов России»
Съешь же ещё этих мягких французских булок, да выпей чаю
Нейтральный и универсальный — подойдёт почти куда угодно
Съешь же ещё этих мягких французских булок, да выпей чаю
Строгий и технологичный
Съешь же ещё этих мягких французских булок, да выпей чаю
Футуристичный, для игровой и технической тематики
Съешь же ещё этих мягких французских булок, да выпей чаю
Геометрический в духе классической Futura
Съешь же ещё этих мягких французских булок, да выпей чаю
Элегантный, лучше всего в заголовках
Съешь же ещё этих мягких французских булок, да выпей чаю
Округлый, для детской и уютной тематики
Съешь же ещё этих мягких французских булок, да выпей чаю
Пара к PT Sans, удобен для длинных текстов
Съешь же ещё этих мягких французских булок, да выпей чаю
Книжный шрифт для статей и блогов
Съешь же ещё этих мягких французских булок, да выпей чаю
Контрастный, для заголовков и журнальной вёрстки
Съешь же ещё этих мягких французских булок, да выпей чаю
Спроектирован для чтения с экрана
Съешь же ещё этих мягких французских булок, да выпей чаю
Изящная антиква для приглашений и крупных надписей
Съешь же ещё этих мягких французских булок, да выпей чаю
Книжный, изначально сделан для электронных книг
Съешь же ещё этих мягких французских булок, да выпей чаю
Декоративная антиква в духе старых книг · только обычное начертание
Съешь же ещё этих мягких французских булок, да выпей чаю
Выразительный и нарядный — только для заголовков · только обычное начертание
Съешь же ещё этих мягких французских булок, да выпей чаю
Широкий и смелый, для крупных заголовков
Съешь же ещё этих мягких французских булок, да выпей чаю
Жёсткий и плотный — спорт, техника, игры · только обычное начертание
Съешь же ещё этих мягких французских булок, да выпей чаю
Узкий, экономит место в плакатах и заголовках
Съешь же ещё этих мягких французских булок, да выпей чаю
Стилизация под древнерусское письмо · только обычное начертание
Съешь же ещё этих мягких французских булок, да выпей чаю
Пиксельный, как в играх 80-х · только обычное начертание
Съешь же ещё этих мягких французских булок, да выпей чаю
Брусковые засечки, характерный заголовочный · только обычное начертание
Съешь же ещё этих мягких французских булок, да выпей чаю
Узнаваемый рукописный — лучше в малых дозах · только обычное начертание
Съешь же ещё этих мягких французских булок, да выпей чаю
Кисть в стиле серф-ретро · только обычное начертание
Съешь же ещё этих мягких французских булок, да выпей чаю
Живой почерк для заметок и подписей
Съешь же ещё этих мягких французских булок, да выпей чаю
Каллиграфический почерк · только обычное начертание
Съешь же ещё этих мягких французских булок, да выпей чаю
Почерк маркером, неформальный · только обычное начертание
Съешь же ещё этих мягких французских булок, да выпей чаю
Узкий рисованный, только прописные буквы
Съешь же ещё этих мягких французских булок, да выпей чаю
Моноширинный с лигатурами для кода
Съешь же ещё этих мягких французских булок, да выпей чаю
Моноширинный из семейства PT · только обычное начертание
Съешь же ещё этих мягких французских булок, да выпей чаю
Строгий моноширинный для кода и таблиц
Съешь же ещё этих мягких французских булок, да выпей чаю
Фирменный моноширинный Ubuntu
Все шрифты здесь выпущены под открытой лицензией SIL Open Font License (у Ubuntu Mono — похожая Ubuntu Font Licence): их можно бесплатно использовать в личных и коммерческих проектах, на сайтах, в печати, логотипах и видео. Нельзя только продавать сами файлы шрифтов. Превью работает на наших копиях шрифтов — ни одного запроса к сторонним сервисам страница не делает.
Какие бывают шрифты
Без засечек (гротески) — основа современных сайтов и интерфейсов. Чистые, нейтральные, хорошо читаются на экране в любом размере. Если сомневаетесь, какой шрифт взять, — берите отсюда: Inter, Manrope, Golos Text, PT Sans.
С засечками (антиквы) — книжные шрифты. Засечки — маленькие штрихи на концах букв — ведут глаз по строке, поэтому такие шрифты хороши для длинного чтения: статей, книг, документов. Выглядят солиднее и «гуманитарнее» гротесков.
Заголовочные (акцидентные) — шрифты с характером: широкие, узкие, пиксельные, стилизованные. Созданы для крупных надписей — заголовков, плакатов, обложек. Набирать ими основной текст нельзя: читать его будет тяжело.
Рукописные — имитация почерка или кисти. Хороши для подписей, открыток, акцентных фраз. Правило то же: только короткие надписи.
Моноширинные — все символы одной ширины, как на печатной машинке. Нужны для кода, таблиц с цифрами и технических текстов.
Удачные пары шрифтов
Хорошая типографика почти всегда — это два шрифта: один для заголовков, второй для текста. Контраст между ними создаёт иерархию, а общая «эпоха» и характер — гармонию.
| Заголовок | Текст | Настроение | Для чего |
|---|---|---|---|
| Playfair Display | PT Sans | Элегантно, журнально | Блоги, мода, рестораны |
| Unbounded | Inter | Современно, смело | Стартапы, IT, лендинги |
| Lora | Golos Text | Тепло, по-книжному | Статьи, образование |
| Montserrat | Merriweather | Уверенно, классически | Новости, корпоративные сайты |
| Oswald | Open Sans | Энергично | Спорт, мероприятия |
| Russo One | Manrope | Технично | Игры, техника, авто |
| PT Serif | PT Sans | Строго, официально | Документы, госпроекты |
Простое правило подбора: контраст по форме, сходство по духу. Засечки в заголовке — без засечек в тексте, и наоборот. Два разных гротеска или две разные антиквы рядом обычно выглядят как ошибка: они похожи, но не одинаковы.
А если лень думать — возьмите один хороший гротеск в двух начертаниях: жирный для заголовков, обычный для текста. Inter, Manrope и Golos Text справляются с этим отлично.
Как установить шрифт на компьютер
Нажмите «Скачать» в карточке шрифта — откроется его страница в Google Fonts. Там кнопка Get font, затем Download all. Скачается архив с файлами .ttf — его нужно распаковать.
Windows. Выделите файлы шрифта, нажмите правой кнопкой → Установить для всех пользователей. Шрифт сразу появится в Word, Photoshop, Figma и других программах — их, возможно, придётся перезапустить.
macOS. Дважды нажмите на файл шрифта → Установить. Откроется приложение «Шрифты», где видны все установленные шрифты.
Linux. Скопируйте файлы в папку шрифтов пользователя и обновите кэш:
mkdir -p ~/.local/share/fonts
cp ~/Загрузки/*.ttf ~/.local/share/fonts/
fc-cache -fПроверить, что система видит шрифт, можно командой fc-list | grep -i "golos" — подставьте название своего.
Многие из этих шрифтов есть и в репозиториях: например, sudo apt install fonts-inter fonts-ibm-plex в Ubuntu.
Как подключить шрифт на сайт
Есть два способа, и второй лучше.
Через Google Fonts. Проще всего: вставляете в <head> строку, которую выдаст сайт Google Fonts, и прописываете font-family. Минус — каждый посетитель делает запрос к серверам Google, а в России они иногда работают медленно и нестабильно. Шрифт может подгружаться с задержкой, и текст на секунду будет отображаться системным шрифтом.
Со своего сервера. Скачайте файлы в формате WOFF2 и положите рядом с сайтом. Так грузится быстрее, не зависит от чужих серверов и не передаёт данные посетителей третьим лицам. Так сделан и этот сайт.
@font-face {
font-family: 'Golos Text';
src: url('/fonts/golos-text-400.woff2') format('woff2');
font-weight: 400;
font-display: swap;
}
body {
font-family: 'Golos Text', system-ui, sans-serif;
}Файлы WOFF2 проще всего взять из проекта Fontsource или сконвертировать из TTF. Три совета, чтобы шрифты не тормозили сайт:
- Подключайте только нужные начертания. Обычный и жирный — обычно достаточно. Каждое лишнее начертание — ещё 20–50 КБ.
- Разделяйте наборы символов. Кириллица и латиница в разных файлах с
unicode-range— браузер скачает только то, что есть на странице. - Ставьте
font-display: swap. Текст сразу покажется системным шрифтом, а когда загрузится нужный — подменится. Без этого пользователь может несколько секунд смотреть на пустую страницу.
Размер, межстрочный интервал и длина строки
Шрифт — половина дела. Даже хороший шрифт читается плохо, если текст мелкий или строки слишком длинные.
| Параметр | Хорошее значение | Почему |
|---|---|---|
| Размер основного текста | 16–20 px | Меньше 16 на телефоне читать тяжело |
| Межстрочный интервал | 1,5–1,7 от размера | Глазу проще найти начало следующей строки |
| Длина строки | 60–80 символов | Длиннее — глаз теряет строку при переходе |
| Заголовок | в 1,5–2,5 раза крупнее текста | Иерархия должна быть видна сразу |
| Цвет текста | не чисто чёрный на белом | Тёмно-серый мягче и меньше утомляет |
Для подбора цветов текста и фона пригодятся наши готовые палитры — у каждой проверен контраст.
Частые вопросы
Можно ли использовать эти шрифты в коммерческих проектах?
Да. Лицензия OFL разрешает использовать шрифты бесплатно в любых проектах: на сайтах, в рекламе, упаковке, логотипах, видео. Нельзя только продавать сами файлы шрифтов отдельно.
Какой шрифт лучше всего подходит для сайта?
Для основного текста — хорошо читаемый гротеск: Inter, Manrope, Golos Text, PT Sans или Open Sans. Для блога с длинными статьями можно взять антикву: PT Serif, Lora, Literata или Merriweather.
Как проверить, есть ли у шрифта кириллица?
Напишите русский текст в поле превью. Если шрифт кириллицу не поддерживает, буквы покажутся другим, запасным шрифтом, и это будет сразу видно. В нашей подборке кириллица есть у всех 38 шрифтов.
Можно ли использовать шрифты из Windows на своём сайте?
Как правило, нет. Шрифты, которые идут в комплекте с Windows и macOS, лицензированы для использования на этом компьютере, а размещение их на сайте в виде веб-шрифтов обычно требует отдельной лицензии. Для сайта надёжнее брать шрифты с открытой лицензией.
Почему в Word шрифт выглядит нормально, а в PDF заменяется?
Если шрифт не встроен в документ, на другом компьютере он подменится установленным. При сохранении в PDF включите встраивание шрифтов — в Word это «Параметры → Сохранение → Внедрить шрифты в файл».
Где найти ещё шрифты с кириллицей?
Самый большой бесплатный каталог — Google Fonts, в нём можно отфильтровать шрифты по кириллице. Много качественных бесплатных шрифтов выпускает ParaType — например, всё семейство PT и Golos.
Что дальше
Шрифт и цвет — две главные части визуального стиля. Если нужна красивая надпись для ника в игре или соцсети, где обычные шрифты не поддерживаются, пригодятся шрифты для ника — это стилизованные символы Unicode, которые вставляются куда угодно. А для фона под надписью — генератор градиентов.
Если статья пригодилась — отметьте, это помогает выбирать темы
Статья помогла?
Комментарии
Пока никто не написал. Будьте первым — вопрос или свой опыт одинаково полезны.
