Бесплатные шрифты для сайта: каталог Fontsource с 1500+ вариантами

Каждый раз, когда начинаю новый проект, трачу кучу времени на выбор шрифта. Google Fonts работают нормально, но их CDN добавляет небольшую задержку, и как-то некомфортно когда шрифт грузится с серверов Гугла — особенно если хочется соблюдать приватность. Fontsource решает это — каталог из 1500+ бесплатных шрифтов, которые встраиваются прямо в проект, без внешних запросов.

Весь каталог живёт на fontsource.org — заходишь, выбираешь что нравится, говоришь агенту название. Все Google Fonts там есть плюс сотни других, которых у Гугла нет. Шрифт встраивается в проект и грузится офлайн, работает быстро и никогда не меняется сам по себе (Гугл иногда тихо обновляет свои шрифты и это ломает вёрстку).

1Как пользоваться Fontsource

Зайди на fontsource.org/fonts и полистай. Можно фильтровать по стилю — с засечками, без засечек, декоративные, моноширинные. Нашёл шрифт — скопируй название и передай агенту примерно вот так:

Если хочешь уточнить детали — команда, которую агент выполнит, выглядит вот так. Меняй «inter» на слаг шрифта со страницы fontsource.org:

npm install @fontsource/inter

import '@fontsource/inter';
/* потом в CSS: */
font-family: 'Inter', sans-serif;

Для элегантного шрифта с засечками — Playfair Display хорошо подходит для блогов и портфолио. Space Grotesk отлично смотрится в технических проектах. Lato работает практически везде. В каталоге есть фильтр по поддержке языков — удобно если нужна кириллица или арабский.

npm install @fontsource/playfair-display