October 7
Как использовать eqcdn.de?
Каталог шрифтов eqcdn.de
Шрифты напрямую влияют на скорость загрузки, читаемость и общее восприятие интерфейса. Чтобы не тратить время на ручную конвертацию файлов, оптимизацию сабсетов и настройку хостинга, мы собрали готовую библиотеку шрифтов с нашим собственным CDN - eqcdn.de.
Сервис отдаёт оптимизированные стили с минимальной задержкой, избавляя от лишних внешних зависимостей.
Как подключить к сайту
Для максимальной производительности рекомендуется предварительно установить соединение с сервером через preconnect, а затем подгрузить нужную таблицу стилей.
Вставьте следующий код внутрь тега <head> вашего HTML-документа:
<!-- Предварительное подключение для ускорения загрузки --> <link rel="preconnect" href="https://eqcdn.de"> <link rel="preconnect" href="https://eqcdn.de" crossorigin> <!-- Подключение выбранного шрифта (например, Inter) --> <link href="https://eqcdn.de/fonts/inter.css" rel="stylesheet">
После этого шрифт сразу готов к использованию в ваших CSS-правилах:
body {
font-family: 'Inter', sans-serif;
}Доступные шрифты
Все шрифты разделены по категориям для удобного подбора под задачу.
Универсальные гротески (Sans-Serif)
Базовые рабочие лошадки для текста, интерфейсов и корпоративных платформ:
- Inter
<link href="https://eqcdn.de/fonts/inter.css" rel="stylesheet"> - Roboto
<link href="https://eqcdn.de/fonts/roboto.css" rel="stylesheet"> - Open Sans
<link href="https://eqcdn.de/fonts/open-sans.css" rel="stylesheet"> - Lato
<link href="https://eqcdn.de/fonts/lato.css" rel="stylesheet"> - PT Sans
<link href="https://eqcdn.de/fonts/pt-sans.css" rel="stylesheet"> - Source Sans 3
<link href="https://eqcdn.de/fonts/source-sans-3.css" rel="stylesheet"> - Work Sans
<link href="https://eqcdn.de/fonts/work-sans.css" rel="stylesheet"> - Mulish
<link href="https://eqcdn.de/fonts/mulish.css" rel="stylesheet"> - Fira Sans
<link href="https://eqcdn.de/fonts/fira-sans.css" rel="stylesheet"> - Ubuntu
<link href="https://eqcdn.de/fonts/ubuntu.css" rel="stylesheet">
Современные UI и брендовые шрифты
Гарнитуры со свежей геометрией, выверенной кириллицей и отличной читаемостью в продуктовых интерфейсах:
- Manrope
<link href="https://eqcdn.de/fonts/manrope.css" rel="stylesheet"> - Golos Text
<link href="https://eqcdn.de/fonts/golos-text.css" rel="stylesheet"> - Onest
<link href="https://eqcdn.de/fonts/onest.css" rel="stylesheet"> - Plus Jakarta Sans
<link href="https://eqcdn.de/fonts/plus-jakarta-sans.css" rel="stylesheet"> - Montserrat
<link href="https://eqcdn.de/fonts/montserrat.css" rel="stylesheet"> - Poppins
<link href="https://eqcdn.de/fonts/poppins.css" rel="stylesheet"> - Lexend (оптимизирован для максимальной скорости чтения)
<link href="https://eqcdn.de/fonts/lexend.css" rel="stylesheet">
Характерные и акцидентные (Display & Геометрия)
Шрифты для броских заголовков, лендингов, постеров и креативных концепций:
- Unbounded (мощный технологичный акцидент)
<link href="https://eqcdn.de/fonts/unbounded.css" rel="stylesheet"> - Space Grotesk
<link href="https://eqcdn.de/fonts/space-grotesk.css" rel="stylesheet"> - Syne
<link href="https://eqcdn.de/fonts/syne.css" rel="stylesheet"> - Oswald
<link href="https://eqcdn.de/fonts/oswald.css" rel="stylesheet"> - Raleway
<link href="https://eqcdn.de/fonts/raleway.css" rel="stylesheet"> - Rubik
<link href="https://eqcdn.de/fonts/rubik.css" rel="stylesheet"> - Nunito (мягкие скругленные формы)
<link href="https://eqcdn.de/fonts/nunito.css" rel="stylesheet"> - Comfortaa (ультра-округлый дизайн)
<link href="https://eqcdn.de/fonts/comfortaa.css" rel="stylesheet">
Моноширинные (Monospace)
Для фрагментов программного кода, логов, терминалов и табличных данных:
- JetBrains Mono
<link href="https://eqcdn.de/fonts/jetbrains-mono.css" rel="stylesheet"> - Fira Code
<link href="https://eqcdn.de/fonts/fira-code.css" rel="stylesheet"> - Roboto Mono
<link href="https://eqcdn.de/fonts/roboto-mono.css" rel="stylesheet">
Антиквы (Serif)
Для редакционных статей, длинных лонгридов, эстетичных премиум-проектов и классической типографики:
- Playfair Display
<link href="https://eqcdn.de/fonts/playfair-display.css" rel="stylesheet"> - Merriweather
<link href="https://eqcdn.de/fonts/merriweather.css" rel="stylesheet"> - Cormorant Garamond
<link href="https://eqcdn.de/fonts/cormorant-garamond.css" rel="stylesheet">
Полный список ссылок (Cheat Sheet)
Если вам нужен быстрый доступ ко всем URL одним списком:
<link href="https://eqcdn.de/fonts/unbounded.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/inter.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/roboto.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/roboto-mono.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/montserrat.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/open-sans.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/plus-jakarta-sans.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/poppins.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/lato.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/oswald.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/raleway.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/nunito.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/rubik.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/manrope.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/golos-text.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/onest.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/fira-sans.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/fira-code.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/jetbrains-mono.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/ubuntu.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/playfair-display.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/merriweather.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/pt-sans.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/source-sans-3.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/work-sans.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/comfortaa.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/syne.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/space-grotesk.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/cormorant-garamond.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/lexend.css" rel="stylesheet"> <link href="https://eqcdn.de/fonts/mulish.css" rel="stylesheet">
Совет по производительности: подключайте только те начертания и гарнитуры, которые фактически используются на странице. Это уменьшит объем трафика и обеспечит моментальный рендеринг текста без задержек.