Source Sans Pro font

The downloaded Source Sans Pro fonts with matching @font-face declarations in CSS.

Each font-family has a library-definition, so you can control which variations to include in your theme.

1) Add the libraries that you want to use in your theme's compony.info.yml file:

libraries:
  - compony/global
  - compony/font--source-sans-pro--black-italic
  - compony/font--source-sans-pro--black
  - compony/font--source-sans-pro--bold-italic
  - compony/font--source-sans-pro--bold
  - compony/font--source-sans-pro--extra-light-italic
  - compony/font--source-sans-pro--extra-light
  - compony/font--source-sans-pro--italic
  - compony/font--source-sans-pro--light-italic
  - compony/font--source-sans-pro--light
  - compony/font--source-sans-pro--regular
  - compony/font--source-sans-pro--semi-bold-italic
  - compony/font--source-sans-pro--semi-bold

(Only include the library definitions of the fonts that you need)

2) Use it in your CSS as follows:

font-family: 'source-sans-pro--black-italic';

All the fonts are named using the BEM-naming structure.

Specifications

Machine name

font--source-sans-pro

Perks

Responsive
Accessible

Building blocks

CSS

Stats

Public component
37 downloads
No open issue

Contributors