Шрифт Exo 2

Шрифт Exo 2

Начертания, входящие в состав архива со шрифтом: Regular, Bold, Light, BoldItalic, ExtraBold, ExtraBoldItalic, ExtraLight, ExtraLightItalic, Italic, BlackItalic, LightItalic, Medium, MediumItalic, Black, SemiBold, SemiBoldItalic, Thin, ThinItalic, .

Проверить русский шрифт Exo 2 в действии

Введите или вставьте URL адрес страницы, к которой хотите применить шрифт:

Ниже напечатайте текст для проверки или вставьте HTML код из редактора. Также, вы можете выбрать начертание, размер шрифта и его регистр. Поддерживаются Emmet сокращения для тестирования верстки.

Введите текст здесь...
---

Как установить шрифт в ОС

Для установки русского шрифта Exo 2 в операционную систему, скопируйте файлы из архива, которые имеют расширение *.ttf в системную папку со шрифтами или воспользуйтесь штатным установщиком шрифтов. Для OC семейства Windows, папка со шрифтами находится здесь:
C:/Windows/Fonts.

После установки, шрифт Exo 2 автоматически появится в списке шрифтов Photoshop.

---

Подключение шрифта Exo 2 в CSS

1. Для того, чтобы установить шрифт Exo 2 в свой HTML-проект, сперва скопируйте содержимое архива в папку /fonts, которая должна лежать в той-же директории, что и папка /css вашего HTML сайта.

Структура проекта после установки шрифтов:
/ (корневой каталог шаблона или проекта)
/fonts (Шрифты из архива распаковываем в папку /fonts) /Exo2Regular
/Exo2Bold
/Exo2Light
/Exo2BoldItalic
/Exo2ExtraBold
/Exo2ExtraBoldItalic
/Exo2ExtraLight
/Exo2ExtraLightItalic
/Exo2Italic
/Exo2BlackItalic
/Exo2LightItalic
/Exo2Medium
/Exo2MediumItalic
/Exo2Black
/Exo2SemiBold
/Exo2SemiBoldItalic
/Exo2Thin
/Exo2ThinItalic
/css (Папка со стилями должна находиться в той-же категории, что и /fonts) /stylename.css (Файл стилей, в котором подключаются русские шрифты)

2. Далее вставляем код, указанный ниже, в файл стилей, который должен находиться в папке /css.

Выделить код
/* Код для подключения шрифта в /css/stylename.css */
/* font-family: "Exo2Regular"; */
@font-face {
    font-family: "Exo2Regular";
    src: url("../fonts/Exo2Regular/Exo2Regular.eot");
    src: url("../fonts/Exo2Regular/Exo2Regular.eot?#iefix")format("embedded-opentype"),
    url("../fonts/Exo2Regular/Exo2Regular.woff") format("woff"),
    url("../fonts/Exo2Regular/Exo2Regular.ttf") format("truetype");
    font-style: normal;
    font-weight: normal;
}
/* font-family: "Exo2Bold"; */ @font-face { font-family: "Exo2Bold"; src: url("../fonts/Exo2Bold/Exo2Bold.eot"); src: url("../fonts/Exo2Bold/Exo2Bold.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2Bold/Exo2Bold.woff") format("woff"), url("../fonts/Exo2Bold/Exo2Bold.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2Light"; */ @font-face { font-family: "Exo2Light"; src: url("../fonts/Exo2Light/Exo2Light.eot"); src: url("../fonts/Exo2Light/Exo2Light.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2Light/Exo2Light.woff") format("woff"), url("../fonts/Exo2Light/Exo2Light.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2BoldItalic"; */ @font-face { font-family: "Exo2BoldItalic"; src: url("../fonts/Exo2BoldItalic/Exo2BoldItalic.eot"); src: url("../fonts/Exo2BoldItalic/Exo2BoldItalic.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2BoldItalic/Exo2BoldItalic.woff") format("woff"), url("../fonts/Exo2BoldItalic/Exo2BoldItalic.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2ExtraBold"; */ @font-face { font-family: "Exo2ExtraBold"; src: url("../fonts/Exo2ExtraBold/Exo2ExtraBold.eot"); src: url("../fonts/Exo2ExtraBold/Exo2ExtraBold.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2ExtraBold/Exo2ExtraBold.woff") format("woff"), url("../fonts/Exo2ExtraBold/Exo2ExtraBold.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2ExtraBoldItalic"; */ @font-face { font-family: "Exo2ExtraBoldItalic"; src: url("../fonts/Exo2ExtraBoldItalic/Exo2ExtraBoldItalic.eot"); src: url("../fonts/Exo2ExtraBoldItalic/Exo2ExtraBoldItalic.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2ExtraBoldItalic/Exo2ExtraBoldItalic.woff") format("woff"), url("../fonts/Exo2ExtraBoldItalic/Exo2ExtraBoldItalic.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2ExtraLight"; */ @font-face { font-family: "Exo2ExtraLight"; src: url("../fonts/Exo2ExtraLight/Exo2ExtraLight.eot"); src: url("../fonts/Exo2ExtraLight/Exo2ExtraLight.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2ExtraLight/Exo2ExtraLight.woff") format("woff"), url("../fonts/Exo2ExtraLight/Exo2ExtraLight.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2ExtraLightItalic"; */ @font-face { font-family: "Exo2ExtraLightItalic"; src: url("../fonts/Exo2ExtraLightItalic/Exo2ExtraLightItalic.eot"); src: url("../fonts/Exo2ExtraLightItalic/Exo2ExtraLightItalic.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2ExtraLightItalic/Exo2ExtraLightItalic.woff") format("woff"), url("../fonts/Exo2ExtraLightItalic/Exo2ExtraLightItalic.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2Italic"; */ @font-face { font-family: "Exo2Italic"; src: url("../fonts/Exo2Italic/Exo2Italic.eot"); src: url("../fonts/Exo2Italic/Exo2Italic.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2Italic/Exo2Italic.woff") format("woff"), url("../fonts/Exo2Italic/Exo2Italic.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2BlackItalic"; */ @font-face { font-family: "Exo2BlackItalic"; src: url("../fonts/Exo2BlackItalic/Exo2BlackItalic.eot"); src: url("../fonts/Exo2BlackItalic/Exo2BlackItalic.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2BlackItalic/Exo2BlackItalic.woff") format("woff"), url("../fonts/Exo2BlackItalic/Exo2BlackItalic.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2LightItalic"; */ @font-face { font-family: "Exo2LightItalic"; src: url("../fonts/Exo2LightItalic/Exo2LightItalic.eot"); src: url("../fonts/Exo2LightItalic/Exo2LightItalic.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2LightItalic/Exo2LightItalic.woff") format("woff"), url("../fonts/Exo2LightItalic/Exo2LightItalic.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2Medium"; */ @font-face { font-family: "Exo2Medium"; src: url("../fonts/Exo2Medium/Exo2Medium.eot"); src: url("../fonts/Exo2Medium/Exo2Medium.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2Medium/Exo2Medium.woff") format("woff"), url("../fonts/Exo2Medium/Exo2Medium.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2MediumItalic"; */ @font-face { font-family: "Exo2MediumItalic"; src: url("../fonts/Exo2MediumItalic/Exo2MediumItalic.eot"); src: url("../fonts/Exo2MediumItalic/Exo2MediumItalic.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2MediumItalic/Exo2MediumItalic.woff") format("woff"), url("../fonts/Exo2MediumItalic/Exo2MediumItalic.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2Black"; */ @font-face { font-family: "Exo2Black"; src: url("../fonts/Exo2Black/Exo2Black.eot"); src: url("../fonts/Exo2Black/Exo2Black.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2Black/Exo2Black.woff") format("woff"), url("../fonts/Exo2Black/Exo2Black.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2SemiBold"; */ @font-face { font-family: "Exo2SemiBold"; src: url("../fonts/Exo2SemiBold/Exo2SemiBold.eot"); src: url("../fonts/Exo2SemiBold/Exo2SemiBold.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2SemiBold/Exo2SemiBold.woff") format("woff"), url("../fonts/Exo2SemiBold/Exo2SemiBold.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2SemiBoldItalic"; */ @font-face { font-family: "Exo2SemiBoldItalic"; src: url("../fonts/Exo2SemiBoldItalic/Exo2SemiBoldItalic.eot"); src: url("../fonts/Exo2SemiBoldItalic/Exo2SemiBoldItalic.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2SemiBoldItalic/Exo2SemiBoldItalic.woff") format("woff"), url("../fonts/Exo2SemiBoldItalic/Exo2SemiBoldItalic.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2Thin"; */ @font-face { font-family: "Exo2Thin"; src: url("../fonts/Exo2Thin/Exo2Thin.eot"); src: url("../fonts/Exo2Thin/Exo2Thin.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2Thin/Exo2Thin.woff") format("woff"), url("../fonts/Exo2Thin/Exo2Thin.ttf") format("truetype"); font-style: normal; font-weight: normal; }
/* font-family: "Exo2ThinItalic"; */ @font-face { font-family: "Exo2ThinItalic"; src: url("../fonts/Exo2ThinItalic/Exo2ThinItalic.eot"); src: url("../fonts/Exo2ThinItalic/Exo2ThinItalic.eot?#iefix")format("embedded-opentype"), url("../fonts/Exo2ThinItalic/Exo2ThinItalic.woff") format("woff"), url("../fonts/Exo2ThinItalic/Exo2ThinItalic.ttf") format("truetype"); font-style: normal; font-weight: normal; }
Русские шрифты в комплектации TTF + WOFF + EOT