Fontul Roboto este un tip de caractere sans-serif creat de Google care există încă din zilele Android 4.0 (Ice Cream Sandwich). Este un font elegant care se redă bine pe ecranele de înaltă rezoluție, cum ar fi telefoanele Android.
Roboto conține setul complet de greutate a fontului (include greutăți obișnuite, aldine, italice și italice aldine) și este utilizat în principal pentru aplicațiile de sistem și toate aplicațiile Google.
Dacă vă place fontul și doriți să îl utilizați pe Windows, Mac, Linux sau chiar pe site-ul dvs. web, atunci aveți noroc. Dezvoltatorii Google au lansat fontul Roboto gratuit și îl puteți utiliza fără restricții (sub licența software Apache).
Iată cum se instalează fontul Google Roboto pe toate platformele.
Descărcați Google Roboto
Indiferent de platforma pe care vă aflați, trebuie mai întâi să descărcați pachetul de fonturi Roboto.
Du-te la Site-ul fontului Roboto și descărcați fontul (fișier comprimat). Trebuie să faceți clic pe „Selectați acest font”, apoi în partea de jos a ecranului, faceți clic pe fila întunecată care scrie „1 familie selectată”.
În fila nou deschisă, faceți clic pe pictograma „Descărcați” pentru a descărca fontul Roboto ca fișier zip.
Extrageți fișierul zip într-un dosar la alegere. Deschideți folderul și ar trebui să vedeți toate fonturile Roboto din interior.
Instalați Font Roboto pe Windows 10
Deschideți folderul de fonturi Roboto. Selectați toate fonturile. Faceți clic dreapta pe mouse și selectați „Instalați”.
Aceasta va instala fonturile pe computerul dvs. Windows. Acum puteți utiliza fontul Roboto în aplicațiile dvs.
Instalați Roboto Font pe Linux
Deschideți folderul de acasă și activați opțiunea de vizualizare a fișierelor / folderelor ascunse. Găsiți folderul „.fonts”. Dacă nu există, creați-l. Apoi, mutați folderul de fonturi Roboto în acest folder „.fonts”.
Reporniți LibreOffice, GIMP, Photoshop sau orice aplicații pe care le utilizați. Ar trebui să vedeți fontul Roboto disponibil pentru selectare.
Instalați Font Roboto pe Mac
Similar cu Windows. Extrageți fonturile, faceți dublu clic pentru a le instala și acestea vor apărea în cartea dvs. de fonturi. Alternativ, le puteți trage și plasa pe toate în Font Book.
Instalați Font Roboto pe site-ul dvs. web
Dacă doriți să utilizați fontul Roboto pe site-ul dvs. web, puteți utiliza sintaxa CSS3 „@ font-face” pentru a încorpora fontul extern în pagina dvs. web.
Mergi la Pagina fontului FontSquirrel Roboto, faceți clic pe „Webfont Kit”, apoi alegeți formatele de font preferate, un subset (dacă există) și faceți clic pe „Download @ Font-Face Kit”.
Extrageți fișierul comprimat în folderul de fonturi al site-ului dvs. Deschideți foaia de stil web și adăugați următorul cod:
@font-face { font-family: 'Roboto'; 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') format('truetype'), url('Roboto-Regular-webfont.svg#RobotoRegular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto'; 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-Italic-webfont.ttf') format('truetype'), url('Roboto-Italic-webfont.svg#RobotoItalic') format('svg'); font-weight: normal; font-style: italic; } @font-face { font-family: 'Roboto'; 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'); font-weight: bold; font-style: normal; } @font-face { font-family: 'Roboto'; 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'); font-weight: bold; font-style: italic; } @font-face { font-family: 'Roboto'; 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'); font-weight: 200; font-style: normal; } @font-face { font-family: 'Roboto'; 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') format('truetype'), url('Roboto-ThinItalic-webfont.svg#RobotoThinItalic') format('svg'); (under the Apache Software License). font-weight: 200; font-style: italic; } @font-face { font-family: 'Roboto'; src: url('Roboto-Light-webfont.eot'); src: url('Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'), url('Roboto-Light-webfont.woff') format('woff'), url('Roboto-Light-webfont.ttf') format('truetype'), url('Roboto-Light-webfont.svg#RobotoLight') format('svg'); font-weight: 100; font-style: normal; } @font-face { font-family: 'Roboto'; 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'); font-weight: 100; font-style: italic; } @font-face { font-family: 'Roboto'; 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'); font-weight: 300; font-style: normal; } @font-face { font-family: 'Roboto'; 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'); font-weight: 300; font-style: italic; }
Asigurați-vă că schimbați „src” pentru a indica calea folderului fontului.
Apoi, puteți utiliza sintaxa
font-family:"Roboto";
pentru a afișa fontul Roboto pe pagina dvs. web.
Asta e. Bucurați-vă!
