Skip to content

Instantly share code, notes, and snippets.

@dpogue
Last active April 4, 2021 10:02
Show Gist options
  • Star 6 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save dpogue/cf8561b0cfb9d40be95d to your computer and use it in GitHub Desktop.
Save dpogue/cf8561b0cfb9d40be95d to your computer and use it in GitHub Desktop.

Chrome on OSX

  • sans-serif 100 = Helvetica Light
  • sans-serif 200 = Helvetica Light
  • sans-serif 300 = Helvetica Light
  • sans-serif 400 = Helvetica Regular
  • sans-serif 500 = Helvetica Regular
  • sans-serif 600 = Helvetica Bold
  • sans-serif 700 = Helvetica Bold
  • sans-serif 800 = Helvetica Bold
  • sans-serif 900 = Helvetica Bold

Safari on OSX

  • sans-serif 100 = Helvetica Light
  • sans-serif 200 = Helvetica Light
  • sans-serif 300 = Helvetica Light
  • sans-serif 400 = Helvetica Regular
  • sans-serif 500 = Helvetica Regular
  • sans-serif 600 = Helvetica Bold
  • sans-serif 700 = Helvetica Bold
  • sans-serif 800 = Helvetica Bold
  • sans-serif 900 = Helvetica Bold

Firefox on OSX

  • sans-serif 100 = Helvetica Light
  • sans-serif 200 = Helvetica Light
  • sans-serif 300 = Helvetica Light
  • sans-serif 400 = Helvetica Regular
  • sans-serif 500 = Helvetica Regular
  • sans-serif 600 = Helvetica Bold
  • sans-serif 700 = Helvetica Bold
  • sans-serif 800 = Helvetica Bold
  • sans-serif 900 = Helvetica Bold

Safari on iOS

  • sans-serif 100 = Helvetica Light
  • sans-serif 200 = Helvetica Light
  • sans-serif 300 = Helvetica Light
  • sans-serif 400 = Helvetica Regular
  • sans-serif 500 = Helvetica Bold
  • sans-serif 600 = Helvetica Bold
  • sans-serif 700 = Helvetica Bold
  • sans-serif 800 = Helvetica Bold
  • sans-serif 900 = Helvetica Bold

  • -apple-system-font 100 = Helvetica Thin
  • -apple-system-font 200 = Helvetica SemiLight
  • -apple-system-font 300 = Helvetica Light
  • -apple-system-font 400 = Helvetica Regular
  • -apple-system-font 500 = Helvetica Regular
  • -apple-system-font 600 = Helvetica Bold
  • -apple-system-font 700 = Helvetica Bold
  • -apple-system-font 800 = Helvetica Bold
  • -apple-system-font 900 = Helvetica Bold

Chrome on Android

  • sans-serif 100 = Roboto Regular
  • sans-serif 200 = Roboto Regular
  • sans-serif 300 = Roboto Regular
  • sans-serif 400 = Roboto Regular
  • sans-serif 500 = Roboto Regular
  • sans-serif 600 = Roboto Bold
  • sans-serif 700 = Roboto Bold
  • sans-serif 800 = Roboto Bold
  • sans-serif 900 = Roboto Bold

  • sans-serif-thin = Roboto Thin
  • sans-serif-light = Roboto Light
  • sans-serif-medium = Roboto Medium

Firefox on Android

  • sans-serif 100 = Clear Sans Thin
  • sans-serif 200 = Clear Sans Thin
  • sans-serif 300 = Clear Sans Light
  • sans-serif 400 = Clear Sans Regular
  • sans-serif 500 = Clear Sans Medium
  • sans-serif 600 = Clear Sans Bold
  • sans-serif 700 = Clear Sans Bold
  • sans-serif 800 = Clear Sans Bold
  • sans-serif 900 = Clear Sans Bold

Firefox OS

  • sans-serif 100 = Fira Sans Eight
  • sans-serif 200 = Fira Sans UltraLight
  • sans-serif 300 = Fira Sans ExtraLight
  • sans-serif 400 = Fira Sans Book
  • sans-serif 500 = Fira Sans Medium
  • sans-serif 600 = Fira Sans SemiBold
  • sans-serif 700 = Fira Sans Bold
  • sans-serif 800 = Fira Sans ExtraBold
  • sans-serif 900 = Fira Sans Heavy

Firefox on Linux

(Using Roboto as the sans-serif font)

  • sans-serif 100 = Roboto Light
  • sans-serif 200 = Roboto Light
  • sans-serif 300 = Roboto Light
  • sans-serif 400 = Roboto Regular
  • sans-serif 500 = Roboto Medium
  • sans-serif 600 = Roboto Bold
  • sans-serif 700 = Roboto Bold
  • sans-serif 800 = Roboto Black
  • sans-serif 900 = Roboto Black

Chrome on Linux

(Using Roboto as the sans-serif font)

  • sans-serif 100 = Roboto Regular
  • sans-serif 200 = Roboto Regular
  • sans-serif 300 = Roboto Regular
  • sans-serif 400 = Roboto Regular
  • sans-serif 500 = Roboto Regular
  • sans-serif 600 = Roboto Bold
  • sans-serif 700 = Roboto Bold
  • sans-serif 800 = Roboto Bold
  • sans-serif 900 = Roboto Bold

IE11 on Windows

  • sans-serif 100 = Arial Regular
  • sans-serif 200 = Arial Regular
  • sans-serif 300 = Arial Regular
  • sans-serif 400 = Arial Regular
  • sans-serif 500 = Arial Regular
  • sans-serif 600 = Arial Bold
  • sans-serif 700 = Arial Bold
  • sans-serif 800 = Arial Black
  • sans-serif 900 = Arial Black

  • 'Segoe UI' 100 = Segoe UI Light
  • 'Segoe UI' 200 = Segoe UI Light
  • 'Segoe UI' 300 = Segoe UI Light
  • 'Segoe UI' 400 = Segoe UI Regular
  • 'Segoe UI' 500 = Segoe UI Regular
  • 'Segoe UI' 600 = Segoe UI SemiBold
  • 'Segoe UI' 700 = Segoe UI Bold
  • 'Segoe UI' 800 = Segoe UI Black
  • 'Segoe UI' 900 = Segoe UI Black

Firefox on Windows

  • sans-serif 100 = Arial Regular
  • sans-serif 200 = Arial Regular
  • sans-serif 300 = Arial Regular
  • sans-serif 400 = Arial Regular
  • sans-serif 500 = Arial Regular
  • sans-serif 600 = Arial Bold
  • sans-serif 700 = Arial Bold
  • sans-serif 800 = Arial Bold
  • sans-serif 900 = Arial Bold

  • 'Segoe UI' 100 = Segoe UI Regular
  • 'Segoe UI' 200 = Segoe UI Regular
  • 'Segoe UI' 300 = Segoe UI Regular
  • 'Segoe UI' 400 = Segoe UI Regular
  • 'Segoe UI' 500 = Segoe UI Regular
  • 'Segoe UI' 600 = Segoe UI Bold
  • 'Segoe UI' 700 = Segoe UI Bold
  • 'Segoe UI' 800 = Segoe UI Bold
  • 'Segoe UI' 900 = Segoe UI Bold

Chrome on Windows

  • sans-serif 100 = Arial Regular
  • sans-serif 200 = Arial Regular
  • sans-serif 300 = Arial Regular
  • sans-serif 400 = Arial Regular
  • sans-serif 500 = Arial Regular
  • sans-serif 600 = Arial Bold
  • sans-serif 700 = Arial Bold
  • sans-serif 800 = Arial Black
  • sans-serif 900 = Arial Black

  • 'Segoe UI' 100 = Segoe UI Light
  • 'Segoe UI' 200 = Segoe UI Light
  • 'Segoe UI' 300 = Segoe UI Light
  • 'Segoe UI' 400 = Segoe UI Regular
  • 'Segoe UI' 500 = Segoe UI SemiBold
  • 'Segoe UI' 600 = Segoe UI SemiBold
  • 'Segoe UI' 700 = Segoe UI Bold
  • 'Segoe UI' 800 = Segoe UI Black
  • 'Segoe UI' 900 = Segoe UI Black
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment