Government of British ColumbiaGovernment of British Columbia

DevHub

beta

Topic

Design System

British Columbia Government Design System for Digital Services

Status

Typography

Good typography maintains a clear hierarchy of information and structures the content to help users understand and navigate your service.

BC Sans

The standard font for B.C. Government digital services is BC Sans. BC Sans is an open source font family, and is a modified version of Noto Sans, developed by Google. BC Sans includes modifications to support Indigenous languages in British Columbia.

Font weights and styles included:

  • BC Sans Regular - 400
  • BC Sans Italic - 400
  • BC Sans Bold - 700
  • BC Sans Bold Italic - 700

Typography standards for print are on the B.C. Visual Identity Program page.

Download Files

Download and include the font files in your project

Font Integration

Code package management through npm (coming soon)

@font-face {
  src: url('BCSans.woff') format('woff'); /* Modern Browsers */
  font-family: 'BCSans';
}

body {
     font-family: ‘BCSans’, Verdana, Arial, sans-serif;
}

Paragraphs

Example

Loading...

The default paragraph font size is 16px (1em) with a line height of 1.6.

p {
  font-size: 16px;
  line-height: 1.6;
  margin-bottom: 36px;
  color: #494949;
}

Headings

Heading are sized based on a Minor Third (1.200) scale to achieve a harmonious increase of sizes.

Loading...

  • Create an Issue

Design System
Content