Roboto
Download free Roboto font for website or Photoshop
Black
BlackItalic
Bold
BoldItalic
Medium
MediumItalic
Regular
Italic
Light
LightItalic
Thin
ThinItalic
Typography
Aa
91
Characters
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
Numbers
1234567890`?'"!(%)[#]{@}/&\<-+^*>|$~
Typescale
H1 - Display 01
H2 - Display 02
H3 - Headline
H4 - Subhead
H5 - Body
H6 - Body small
@font-face {
font-family: "RobotoBlack";
src: url("../fonts/Roboto/RobotoBlack/RobotoBlack.eot");
src: url("../fonts/Roboto/RobotoBlack/RobotoBlack.eot?#iefix")format("embedded-opentype"),
url("../fonts/Roboto/RobotoBlack/RobotoBlack.woff") format("woff"),
url("../fonts/Roboto/RobotoBlack/RobotoBlack.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-display: swap;
}
@font-face {
font-family: "RobotoBlackItalic";
src: url("../fonts/Roboto/RobotoBlackItalic/RobotoBlackItalic.eot");
src: url("../fonts/Roboto/RobotoBlackItalic/RobotoBlackItalic.eot?#iefix")format("embedded-opentype"),
url("../fonts/Roboto/RobotoBlackItalic/RobotoBlackItalic.woff") format("woff"),
url("../fonts/Roboto/RobotoBlackItalic/RobotoBlackItalic.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-display: swap;
}
@font-face {
font-family: "RobotoBold";
src: url("../fonts/Roboto/RobotoBold/RobotoBold.eot");
src: url("../fonts/Roboto/RobotoBold/RobotoBold.eot?#iefix")format("embedded-opentype"),
url("../fonts/Roboto/RobotoBold/RobotoBold.woff") format("woff"),
url("../fonts/Roboto/RobotoBold/RobotoBold.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-display: swap;
}
@font-face {
font-family: "RobotoBoldItalic";
src: url("../fonts/Roboto/RobotoBoldItalic/RobotoBoldItalic.eot");
src: url("../fonts/Roboto/RobotoBoldItalic/RobotoBoldItalic.eot?#iefix")format("embedded-opentype"),
url("../fonts/Roboto/RobotoBoldItalic/RobotoBoldItalic.woff") format("woff"),
url("../fonts/Roboto/RobotoBoldItalic/RobotoBoldItalic.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-display: swap;
}
@font-face {
font-family: "RobotoMedium";
src: url("../fonts/Roboto/RobotoMedium/RobotoMedium.eot");
src: url("../fonts/Roboto/RobotoMedium/RobotoMedium.eot?#iefix")format("embedded-opentype"),
url("../fonts/Roboto/RobotoMedium/RobotoMedium.woff") format("woff"),
url("../fonts/Roboto/RobotoMedium/RobotoMedium.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-display: swap;
}
@font-face {
font-family: "RobotoMediumItalic";
src: url("../fonts/Roboto/RobotoMediumItalic/RobotoMediumItalic.eot");
src: url("../fonts/Roboto/RobotoMediumItalic/RobotoMediumItalic.eot?#iefix")format("embedded-opentype"),
url("../fonts/Roboto/RobotoMediumItalic/RobotoMediumItalic.woff") format("woff"),
url("../fonts/Roboto/RobotoMediumItalic/RobotoMediumItalic.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-display: swap;
}
@font-face {
font-family: "RobotoRegular";
src: url("../fonts/Roboto/RobotoRegular/RobotoRegular.eot");
src: url("../fonts/Roboto/RobotoRegular/RobotoRegular.eot?#iefix")format("embedded-opentype"),
url("../fonts/Roboto/RobotoRegular/RobotoRegular.woff") format("woff"),
url("../fonts/Roboto/RobotoRegular/RobotoRegular.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-display: swap;
}
@font-face {
font-family: "RobotoItalic";
src: url("../fonts/Roboto/RobotoItalic/RobotoItalic.eot");
src: url("../fonts/Roboto/RobotoItalic/RobotoItalic.eot?#iefix")format("embedded-opentype"),
url("../fonts/Roboto/RobotoItalic/RobotoItalic.woff") format("woff"),
url("../fonts/Roboto/RobotoItalic/RobotoItalic.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-display: swap;
}
@font-face {
font-family: "RobotoLight";
src: url("../fonts/Roboto/RobotoLight/RobotoLight.eot");
src: url("../fonts/Roboto/RobotoLight/RobotoLight.eot?#iefix")format("embedded-opentype"),
url("../fonts/Roboto/RobotoLight/RobotoLight.woff") format("woff"),
url("../fonts/Roboto/RobotoLight/RobotoLight.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-display: swap;
}
@font-face {
font-family: "RobotoLightItalic";
src: url("../fonts/Roboto/RobotoLightItalic/RobotoLightItalic.eot");
src: url("../fonts/Roboto/RobotoLightItalic/RobotoLightItalic.eot?#iefix")format("embedded-opentype"),
url("../fonts/Roboto/RobotoLightItalic/RobotoLightItalic.woff") format("woff"),
url("../fonts/Roboto/RobotoLightItalic/RobotoLightItalic.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-display: swap;
}
@font-face {
font-family: "RobotoThin";
src: url("../fonts/Roboto/RobotoThin/RobotoThin.eot");
src: url("../fonts/Roboto/RobotoThin/RobotoThin.eot?#iefix")format("embedded-opentype"),
url("../fonts/Roboto/RobotoThin/RobotoThin.woff") format("woff"),
url("../fonts/Roboto/RobotoThin/RobotoThin.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-display: swap;
}
@font-face {
font-family: "RobotoThinItalic";
src: url("../fonts/Roboto/RobotoThinItalic/RobotoThinItalic.eot");
src: url("../fonts/Roboto/RobotoThinItalic/RobotoThinItalic.eot?#iefix")format("embedded-opentype"),
url("../fonts/Roboto/RobotoThinItalic/RobotoThinItalic.woff") format("woff"),
url("../fonts/Roboto/RobotoThinItalic/RobotoThinItalic.ttf") format("truetype");
font-style: normal;
font-weight: normal;
font-display: swap;
}