On this page
Corporate typeface
Big Shoulders Text is the key typeface of the KELLYS brand. A narrow, sporty grotesque with a large x-height, it keeps the line compact even at large sizes – which is why it is used for headlines, category names, the main navigation and banner titles.
Tip
The preview and the tester below run on the actual font file – what you type is what you see, in the correct weight.
Download all weights (ZIP)
The family on Google Fonts
How it is used on the KELLYS website
Show
Where it appears
- Banner titles and main headlines – ExtraBold 800, 50–60 px
- Category names – ExtraBold 800, 40 px, capitals
- Main navigation and breadcrumbs – Bold 700, 14–16 px, capitals
- Headings of product groups and attributes – Bold 700 to Black 900
Typesetting rules
- Headlines and navigation are set in capitals with slight letter spacing (0.25–0.5 px).
- Keep the leading of large titles tight (100 % of the type size) – the typeface is narrow and a large gap breaks the line up.
- Regular 400 is used only for longer headlines and captions; for body text use Roboto.
Licence
Big Shoulders Text is released under the SIL Open Font License – it may be used freely, embedded in documents and passed on to suppliers. The ZIP contains the static weights as well as the variable font (weight 100–900).
Supporting typeface
Roboto Condensed carries the functional layer of the interface – buttons, tabs, prices, product names and page titles. It is narrower than Roboto, so more information fits into the same width while it still stays neutral.
Download all weights (ZIP)
The family on Google Fonts
How it is used on the KELLYS website
Show
- Buttons – Bold 700, approx. 15 px, letter spacing 0.04 em
- Product names in the card – Black 900, 24 px
- Prices – ExtraBold 800, 24 px, capitals; struck-through price Medium 500, 22 px
- Page title and tabs – Bold 700, capitals
- Headings and links in the footer – Bold 700, 22 px, capitals
Body text typeface
Roboto is the basic text typeface – ordinary paragraphs, captions, forms and system messages. On the website it is set on body, so it forms the default layer from which the other two typefaces stand out.
Download all weights (ZIP)
The family on Google Fonts
How it is used on the KELLYS website
Show
- Body text – Regular 400
- Captions in cards and in the footer – Regular 400, 12–14 px
- Emphasis and headings in the footer – Bold 700 to Black 900, 14–16 px, capitals
- Fallback order on the website: Roboto → Arial → Helvetica → sans-serif
Typesetting rules
The three typefaces have clearly separated roles. Keeping to the hierarchy matters more than the individual sizes – those differ from medium to medium.
- Big Shoulders Text = the voice of the brand. Headlines, category names, navigation, campaign titles. Always in capitals.
- Roboto Condensed = the interface. Buttons, prices, tabs, page titles, the footer.
- Roboto = the content. Paragraphs, captions, forms, emails.
- Do not mix the roles. Never set longer text in Big Shoulders – a narrow grotesque is hard to read in large amounts of text.
- Body text is set in black or in shades of grey; on a dark background in white.
- Replacing the typeface with one other than the system fallback listed (Arial / Helvetica) damages the consistent visual style of the brand.
Typography inside the logo
The logotype and the lock-ups with the claim are fixed vector artwork – the type in them is converted to outlines.
Warning
Resetting the lettering in the logo in a different typeface is a prohibited modification of the logo – see “Prohibited use” on the logo page.
The supplementary lettering BIKE COMPANY and SINCE 1991 and the claim text EVERY BIKE HAS A MISSION were set in Helvetica Neue Condensed Bold and have been part of the logo artwork ever since. They are therefore not live text and are never reset – not even after the switch to Big Shoulders Text.
In practice this means:
- Always place the logo and the claim as a finished file from the logopack, never retype them.
- A claim used as body text in communication (outside the logo) is set in the corporate typeface Big Shoulders Text.
- Helvetica Neue is no longer a corporate typeface of the brand – it lives only inside the logo artwork.
Weights and their use
The weights and sizes correspond to the settings of the kellysbike.com website.
| Typeface and weight | Typical use |
|---|---|
| Big Shoulders Text ExtraBold 800 | Banner titles (50–60 px), category names (40 px) |
| Big Shoulders Text Bold 700 | Main navigation, breadcrumbs, attribute headings |
| Big Shoulders Text Black 900 | Product group headings |
| Big Shoulders Text Regular 400 | Longer headlines, supplementary captions |
| Roboto Condensed Black 900 | Product names in the card (24 px) |
| Roboto Condensed ExtraBold 800 | Prices (24 px, capitals) |
| Roboto Condensed Bold 700 | Buttons, tabs, page title, footer |
| Roboto Condensed Medium 500 / Regular 400 | Struck-through price, subnavigation items |
| Roboto Regular 400 | Body text, captions, forms |
| Roboto Bold 700 / Black 900 | Emphasis, footer headings |
| Arial / Helvetica | System fallback – documents, emails, environments without web fonts |
Arial
Where web fonts cannot be loaded – in office documents, in email templates or in an environment without access to Google Fonts – the system fallback takes over. The kellysbike.com website uses the same order: Roboto, Arial, Helvetica, sans-serif.
| Platform | Typeface |
|---|---|
| PC | Arial |
| MAC | Helvetica |
Font Usage
Which of the corporate typefaces is used where, and which system fallback stands in for it.
| Application of Font | Big Shoulders Text – headlines and navigation | Roboto Condensed – buttons, prices, captions | Roboto – body text | Arial / Helvetica (system fallback) |
|---|---|---|---|---|
| Webdesign | ||||
| Mobile Applications | ||||
| Shared Online Documents | ||||
| Offline Documents | ||||
| Marketing Print Materials | ||||
| E-mails |