CSS отличные сочетания шрифтов
Отличные пары шрифтов необходимы для отличного дизайна.
Правила сочетания шрифтов
Вот несколько основных правил для создания отличных сочетаний шрифтов:
1. Дополнение
Всегда безопасно найти пары шрифтов, которые дополняют друг друга.
Хорошая комбинация шрифтов должна гармонировать, не быть слишком похожей или слишком разной.
2. Используйте суперсемейства шрифтов
Надсемейство шрифтов — это набор шрифтов, предназначенных для совместной работы. Таким образом, использование разных шрифтов в одном суперсемействе безопасно.
Например, надсемейство Lucida содержит следующие шрифты: Lucida Sans, Lucida Serif, Lucida Typewriter Sans, Lucida Typewriter Serif и Lucida Math.
3. Контраст — король
Два слишком похожих шрифта часто будут конфликтовать. Тем не менее, контрасты, сделанные правильно, выявляют лучшее в каждом шрифте.
Пример. Комбинация шрифтов с засечками и без засечек является хорошо известной комбинацией.
Сильное суперсемейство включает варианты одного и того же шрифта как с засечками, так и без засечек (например, Lucida и Lucida Sans).
4. Выберите только одного босса
Один шрифт должен быть боссом. Это устанавливает иерархию шрифтов на вашей странице. Это может быть достигнуто путем изменения размера, веса и цвета.
Пример
Без сомнения, «Грузия» здесь хозяин:
body {
background-color: black;
font-family: Verdana,
sans-serif;
font-size: 16px;
color: gray;
}
h1
{
font-family: Georgia, serif;
font-size: 60px;
color: white;
}
Ниже мы показали несколько популярных сочетаний шрифтов, которые подойдут многим брендам и контекстам.
Джорджия и Вердана
Джорджия и Вердана — классическое сочетание. Он также соответствует стандартам веб-безопасных шрифтов:
Пример
Используйте шрифт «Georgia» для заголовков и «Verdana» для текста:
Beautiful Norway
Norway has a total area of 385,252 square
kilometers and a population of 5,438,657 (December 2020). Norway is bordered by Sweden, Finland and Russia to the north-east, and the Skagerrak to the south, with Denmark on the other side.
Norway has beautiful mountains, glaciers and stunning fjords. Oslo, the capital, is a city of green spaces and museums. Bergen, with colorful wooden houses, is the starting point for cruises to the dramatic Sognefjord. Norway is also known for fishing, hiking and skiing.
Гельветика и Гарамонд
Helvetica и Garamond — еще одна классическая комбинация, в которой используются веб-безопасные шрифты:
Пример
Используйте шрифт «Helvetica» для заголовков и «Garamond» для текста:
Beautiful Norway
Norway has a total area of 385,252 square
kilometers and a population of 5,438,657 (December 2020). Norway is bordered by Sweden, Finland and Russia to the north-east, and the Skagerrak to the south, with Denmark on the other side.
Norway has beautiful mountains, glaciers and stunning fjords. Oslo, the capital, is a city of green spaces and museums. Bergen, with colorful wooden houses, is the starting point for cruises to the dramatic Sognefjord. Norway is also known for fishing, hiking and skiing.
Популярные пары шрифтов Google
Если вы не хотите использовать стандартные шрифты в HTML, вы можете использовать Google Fonts.
Google Fonts бесплатны для использования и имеют более 1000 шрифтов на выбор.
Ниже приведены некоторые популярные сочетания веб-шрифтов Google.
Мерриуэзер и Опен Санс
Пример
Используйте шрифт «Merriweather» для заголовков и «Open Sans» для текста:
Beautiful Norway
Norway has a total area of 385,252 square
kilometers and a population of 5,438,657 (December 2020). Norway is bordered by Sweden, Finland and Russia to the north-east, and the Skagerrak to the south, with Denmark on the other side.
Norway has beautiful mountains, glaciers and stunning fjords. Oslo, the capital, is a city of green spaces and museums. Bergen, with colorful wooden houses, is the starting point for cruises to the dramatic Sognefjord. Norway is also known for fishing, hiking and skiing.
Убунту и Лора
Пример
Используйте шрифт «Ubuntu» для заголовков и «Lora» для текста:
Beautiful Norway
Norway has a total area of 385,252 square
kilometers and a population of 5,438,657 (December 2020). Norway is bordered by Sweden, Finland and Russia to the north-east, and the Skagerrak to the south, with Denmark on the other side.
Norway has beautiful mountains, glaciers and stunning fjords. Oslo, the capital, is a city of green spaces and museums. Bergen, with colorful wooden houses, is the starting point for cruises to the dramatic Sognefjord. Norway is also known for fishing, hiking and skiing.
Абрил Фэтфейс и Поппинс
Пример
Используйте шрифт «Abril Fatface» для заголовков и «Poppins» для текста:
Beautiful Norway
Norway has a total area of 385,252 square
kilometers and a population of 5,438,657 (December 2020). Norway is bordered by Sweden, Finland and Russia to the north-east, and the Skagerrak to the south, with Denmark on the other side.
Norway has beautiful mountains, glaciers and stunning fjords. Oslo, the capital, is a city of green spaces and museums. Bergen, with colorful wooden houses, is the starting point for cruises to the dramatic Sognefjord. Norway is also known for fishing, hiking and skiing.
Синзель и Фауна Один
Пример
Используйте шрифт «Cinzel» для заголовков и «Fauna One» для текста:
Beautiful Norway
Norway has a total area of 385,252 square
kilometers and a population of 5,438,657 (December 2020). Norway is bordered by Sweden, Finland and Russia to the north-east, and the Skagerrak to the south, with Denmark on the other side.
Norway has beautiful mountains, glaciers and stunning fjords. Oslo, the capital, is a city of green spaces and museums. Bergen, with colorful wooden houses, is the starting point for cruises to the dramatic Sognefjord. Norway is also known for fishing, hiking and skiing.
Mountain One и Libre Baskerville
Пример
Используйте шрифт «Fjalla One» для заголовков и «Libre Baskerville» для текста:
Beautiful Norway
Norway has a total area of 385,252 square
kilometers and a population of 5,438,657 (December 2020). Norway is bordered by Sweden, Finland and Russia to the north-east, and the Skagerrak to the south, with Denmark on the other side.
Norway has beautiful mountains, glaciers and stunning fjords. Oslo, the capital, is a city of green spaces and museums. Bergen, with colorful wooden houses, is the starting point for cruises to the dramatic Sognefjord. Norway is also known for fishing, hiking and skiing.
Космос Моно и Мули
Пример
Используйте шрифт «Space Mono» для заголовков и «Muli» для текста:
Beautiful Norway
Norway has a total area of 385,252 square
kilometers and a population of 5,438,657 (December 2020). Norway is bordered by Sweden, Finland and Russia to the north-east, and the Skagerrak to the south, with Denmark on the other side.
Norway has beautiful mountains, glaciers and stunning fjords. Oslo, the capital, is a city of green spaces and museums. Bergen, with colorful wooden houses, is the starting point for cruises to the dramatic Sognefjord. Norway is also known for fishing, hiking and skiing.
Спектральный и Рубик
Пример
Используйте шрифт «Спектральный» для заголовков и «Рубик» для текста:
Beautiful Norway
Norway has a total area of 385,252 square
kilometers and a population of 5,438,657 (December 2020). Norway is bordered by Sweden, Finland and Russia to the north-east, and the Skagerrak to the south, with Denmark on the other side.
Norway has beautiful mountains, glaciers and stunning fjords. Oslo, the capital, is a city of green spaces and museums. Bergen, with colorful wooden houses, is the starting point for cruises to the dramatic Sognefjord. Norway is also known for fishing, hiking and skiing.
Освальд и Ното Санс
Пример
Используйте шрифт «Oswald» для заголовков и «Noto Sans» для текста:
Beautiful Norway
Norway has a total area of 385,252 square
kilometers and a population of 5,438,657 (December 2020). Norway is bordered by
Sweden, Finland and Russia to the north-east, and the Skagerrak to the south, with Denmark on the other side.
Norway has beautiful mountains, glaciers and stunning fjords. Oslo, the capital, is a city of green spaces and museums. Bergen, with colorful wooden houses, is the starting point for cruises to the dramatic Sognefjord. Norway is also known for fishing, hiking and skiing.
Чтобы просмотреть список всех бесплатных шрифтов Google, посетите наше руководство How To — Google Fonts Tutorial .