blog-page

Final project style guide

Fonts

• IBM Plex Sans

• 200

• IBM Plex Serif

  • 300
  • 400
  • 700

Font sizes

Mobile

• all very small text: .75rem
• links and buttons: 1rem
• body: 1.25rem
• card titles: 1.375rem
• section titles and subtitles: 1.75rem
• primary title: 2.125rem

Large screens

• all very small text: .75rem
• links and buttons: 1rem
• body: 1.25rem
• card titles: 1.75rem
• section titles and subtitles: 2.125rem
• primary title: 4.25rem

Colors

• neutral 100: #fff

• neutral 200: #eef1f6

• neutral 300: #a9afbc

• neutral 400: #737b8c

• neutral 500: #434956

• neutral 900: #020203

• primary-300: #f3f7ff (background in one or two places)

• primary-400: #8ea8da (link and button hovers)

Layout

• Max width of most content: 800px

• Max width of article: 640px