Fonts in use
![Example illustration of the Panton font.](/-/media/country/bmp/design-in-use/digital-media/web-design/typography/bmptypographywebdesignpanton3x42x.png?h=648&iar=0&mw=486&w=486&rev=a772c6a6740541ec832a601651fc6ef3&sc_lang=en&hash=99B97C98B64D7813095EC1A06FB052E9)
![Example illustration of the Roboto font.](/-/media/country/bmp/design-in-use/digital-media/web-design/typography/bmptypographywebdesignroboto3x42x.png?h=648&iar=0&mw=486&w=486&rev=6ef04078327a404e8e4df1d20f9a5b14&sc_lang=en&hash=8375FADCD8BF1FC458D3DE1A10B6F5A2)
Examples
![Example of the font use on the HARTMANN homepage, where the Panton and Roboto fonts are mixed.](/-/media/country/bmp/design-in-use/digital-media/web-design/typography/bmptypeexamples011x12x.jpg?h=840&iar=0&mw=840&w=840&rev=cea40243ee874e859638a2aedcb3319e&sc_lang=en&hash=38404C143305E111034D61C279E4CB17)
Further usage examples: eDetailing
![Example of the font use on the HARTMANN eDetailing page.](/-/media/country/bmp/design-in-use/digital-media/web-design/typography/bmptypeexamples023x42x.jpg?h=1120&iar=0&mw=840&w=840&rev=468d95cd0bbd4b6bb432314d81b7ffe4&sc_lang=en&hash=CAEFCBD86E9D5FFDA4B7BF17215376A5)
Text styles for Desktop
These styles apply to screens with a resolution greater than or equal to 992 px.
H1 | Panton Regular |
H2 | Panton Regular |
H3 | Panton Regular |
H4 | Panton Regular |
H5 | Roboto Regular |
H5 link | Roboto Regular |
Body 1 | Roboto Regular |
Body 1 link inline | Roboto Regular |
Body 1 bold | Roboto Medium |
Body 2 | Roboto Regular |
Body 2 link inline | Roboto Regular |
Body 2 bold | Roboto Medium |
Body 3 | Roboto Regular |
Body 3 link inline | Roboto Regular |
Body 3 bold | Roboto Medium |
Link | Roboto Medium |
Call to Action | Roboto Medium |
Navigation first level | Panton ExtraBold |
Label | Roboto Regular |
Caption | Roboto Regular |
Breadcrumb | Roboto Regular |
Breadcrumb bold | Roboto Bold |
Text styles for Mobile
These styles are valid for screens with a resolution less than or equal to 991 px.
H1 | Panton Regular |
H2 | Panton Regular |
H3 | Panton Regular |
H4 | Panton Regular |
H5 | Roboto Regular |
H5 link | Roboto Regular |
Body 1 | Roboto Regular |
Body 1 link inline | Roboto Regular |
Body 1 bold | Roboto Medium |
Body 2 | Roboto Regular |
Body 2 link inline | Roboto Regular |
Body 2 bold | Roboto Medium |
Body 3 | Roboto Regular |
Body 3 link inline | Roboto Regular |
Body 3 bold | Roboto Medium |
Link | Roboto Medium |
Call to Action | Roboto Medium |
Navigation first level | Panton ExtraBold |
Label | Roboto Regular |
Caption | Roboto Regular |
Breadcrumb | Roboto Regular |
Breadcrumb bold | Roboto Bold |
Infographics
![Four examples of HARTMANN infographics.](/-/media/country/bmp/design-in-use/digital-media/web-design/typography/bmptypeinfographics1x12x.png?h=840&iar=0&mw=840&w=840&rev=7d45cf4ea92f4908a33c0821317b6531&sc_lang=en&hash=09401E76D4472334DE00315495F9539C)
See also
For further information get in touch
Please email us at branding.support@hartmann.info