A fonte Roboto é uma fonte de estilo sem serifa criada pelo Google. Esta fonte apareceu desde os primeiros dias do lançamento do Android 4.0 (Ice Cream Sandwich) com a vantagem da elegância e boa visibilidade em telas de alta resolução como os telefones Android .
Roboto possui uma gama completa de fontes (incluindo regular, negrito, itálico, itálico e negrito) e é usado principalmente em aplicativos do sistema e em todos os aplicativos do Google .
Há boas notícias para esses amantes de fontes: os desenvolvedores do Google lançaram a fonte Roboto gratuitamente e você pode usá-la sem restrições (sob a licença de software Apache). Então agora você pode usá-lo no Windows , MAC , Linux ou até mesmo no seu site .
Abaixo está como instalar o Google Roboto Font em todas as plataformas de sistema operacional acima.

Baixe o Google Roboto
Não importa qual sistema operacional você usa, a primeira e mais importante coisa é baixar o conjunto de fontes Google Roboto para o seu dispositivo.
Visite o site da fonte Roboto e baixe a fonte (arquivo compactado). Você precisa clicar em “Selecionar esta fonte” e então na parte inferior da tela, clicar na aba escura que diz “1 família selecionada”.
Na guia recém-aberta, clique no ícone “download” para baixar a fonte Roboto. O conjunto de fontes será então baixado como um arquivo zip.
Extraia o arquivo zip que você acabou de baixar em uma pasta arbitrária. Abra essa pasta e você verá todas as fontes Roboto dentro dela.
Instale a fonte Roboto no Windows 10
Abra a pasta de fontes Roboto. Selecione todas as fontes, clique com o botão direito e selecione “Instalar”.
Neste ponto, a fonte será instalada automaticamente em seu sistema após alguns minutos. Agora você pode usar a fonte Roboto em aplicativos do seu dispositivo.
Instale a fonte Roboto no Linux
Abra sua pasta pessoal e habilite arquivos/pastas ocultos. Encontre a pasta “.fonts”. Caso não exista, crie uma nova pasta com a extensão “.fonts”. Em seguida, mova a pasta que contém a fonte Roboto para a pasta “.fonts” que você acabou de criar.
Em seguida, reinicie o LibreOffice, GIMP, Photoshop ou qualquer aplicativo que você esteja usando. Você verá a fonte Roboto aparecer para seleção.
Instale a fonte Roboto no MAC
Para MAC, o método é semelhante ao do Windows. Primeiro você extrai a fonte, clique duas vezes para instalar e o Roboto aparecerá no Catálogo de Fontes. seu. Além disso, você também pode arrastá-los e soltá-los em seu Catálogo de Fontes.
Instale Roboto Font para o site
Se quiser usar a fonte Roboto em seu site, você pode usar a sintaxe CSS3 “@font-face” . Este é o método para incorporar fontes externas ao site.
Vá para a página da fonte FontSquirrel Roboto , clique em "Webfont Kit" , selecione os formatos de fonte de sua preferência e clique em “Baixar @Font-Face Kit”.
Descompacte o arquivo baixado na pasta de fontes do seu site. Em seguida, abra a folha de estilo do seu site e adicione o seguinte código:
@font-face { font-family : 'Robô'; src: url('Roboto-Regular-webfont.eot'); src: url('Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Regular-webfont.woff') format('woff'), url('Roboto- Regular-webfont.ttf') formato('truetype'), url('Roboto-Regular-webfont.svg#RobotoRegular') formato('svg'); peso da fonte : normal; estilo da fonte : normal; } @font-face { font-family : 'Robô'; src: url('Roboto-Italic-webfont.eot'); src: url('Roboto-Italic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Italic-webfont.woff') format('woff'), url('Roboto- Itálico-webfont.ttf') format('truetype'), url('Roboto-Italic-webfont.svg#RobotoItalic') format('svg'); peso da fonte : normal; estilo da fonte : itálico; } @font-face { font-family : 'Robô'; src: url('Roboto-Bold-webfont.eot'); src: url('Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Bold-webfont.woff') format('woff'), url('Roboto- Bold-webfont.ttf') format('truetype'), url('Roboto-Bold-webfont.svg#RobotoBold') format('svg'); intensidade da fonte : Negrito; estilo da fonte : normal; } @font-face { font-family : 'Robô'; src: url('Roboto-BoldItalic-webfont.eot'); src: url('Roboto-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-BoldItalic-webfont.woff') format('woff'), url('Roboto- BoldItalic-webfont.ttf') format('truetype'), url('Roboto-BoldItalic-webfont.svg#RobotoBoldItalic') format('svg'); intensidade da fonte : Negrito; estilo da fonte : itálico; } @font-face { font-family : 'Robô'; src: url('Roboto-Thin-webfont.eot'); src: url('Roboto-Thin-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Thin-webfont.woff') format('woff'), url('Roboto- Thin-webfont.ttf') format('truetype'), url('Roboto-Thin-webfont.svg#RobotoThin') format('svg'); peso da fonte : 200; estilo da fonte : normal; } @font-face { font-family : 'Robô'; src: url('Roboto-ThinItalic-webfont.eot'); src: url('Roboto-ThinItalic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-ThinItalic-webfont.woff') format('woff'), url('Roboto- ThinItalic-webfont.ttf') formato('truetype'), url('Roboto-ThinItalic-webfont.svg#RobotoThinItalic') format('svg'); (sob a licença de software Apache). peso da fonte : 200; estilo da fonte : itálico; } @font-face { família de fontes: 'Robô'; src: url('Roboto-Light-webfont.eot'); src: url('Roboto-Light-webfont.eot?#iefix') formato('embedded-opentype'), url('Roboto-Light-webfont.woff') formato('woff'), url('Roboto- Light-webfont.ttf') formato('truetype'), url('Roboto-Light-webfont.svg#RobotoLight') formato('svg'); peso da fonte : 100; estilo da fonte : normal; } @font-face { font-family : 'Robô'; src: url('Roboto-LightItalic-webfont.eot'); src: url('Roboto-LightItalic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-LightItalic-webfont.woff') format('woff'), url('Roboto- LightItalic-webfont.ttf') format('truetype'), url('Roboto-LightItalic-webfont.svg#RobotoLightItalic') format('svg'); peso da fonte : 100; estilo da fonte : itálico; } @font-face { font-family : 'Robô'; src: url('Roboto-Medium-webfont.eot'); src: url('Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Medium-webfont.woff') format('woff'), url('Roboto- Medium-webfont.ttf') format('truetype'), url('Roboto-Medium-webfont.svg#RobotoMedium') format('svg'); peso da fonte : 300; estilo da fonte : normal; } @font-face { font-family : 'Robô'; src: url('Roboto-MediumItalic-webfont.eot'); src: url('Roboto-MediumItalic-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-MediumItalic-webfont.woff') format('woff'), url('Roboto- MediumItalic-webfont.ttf') format('truetype'), url('Roboto-MediumItalic-webfont.svg#RobotoMediumItalic') format('svg'); peso da fonte : 300; estilo da fonte : itálico;
Certifique-se de alterar “src” para o caminho da pasta de fontes.
A seguir, você usa a seguinte sintaxe para exibir a fonte Roboto em seu site:
família de fontes :"Robô";
Espero que você possa instalar as fontes que desejar.
Ver mais: