search...
CTRL+K

VX Typhography

Fluid typography scale works perfectly for all breakpoints – desktop, tablet and mobile. Calculated in rems.

VX Design System

light-vxds v1.0

Last Update: 21 December 2024

  • Foundation
  • Typography

Fluid typography scale works perfectly for all breakpoints – desktop, tablet and mobile. Calculated in rems.

Primary Font - DM Sans

Uppercase

A B C D E F G H I J K L M N O P Q R S T U V W X Y Z

Lowercase

a b c d e f g h i j k l m n o p q r s t u v w x y z

Numbers

0 1 2 3 4 5 6 7 8 9

Symbols

`~ ! @ # $ % ^ & * ( ) _ - + = { } [ ] | \ : ; " ' , . ? /

Secondary Font - Playfair Display

Uppercase

A B C D E F G H I J K L M N O P Q R S T U V W X Y Z

Lowercase

a b c d e f g h i j k l m n o p q r s t u v w x y z

Numbers

0 1 2 3 4 5 6 7 8 9

Symbols

`~ ! @ # $ % ^ & * ( ) _ - + = { } [ ] | \ : ; " ' , . ? /

  • Foundation
  • Typography
  • Headings

Fluid typography scale works perfectly for all breakpoints – desktop, tablet and mobile. Calculated in rems.

Display 2XL
Regular 400 / Medium 500 / Semibold 600 / Bold 700
  • Font Size: 72px [4.5rem]
  • Line Height: 74px [4.625rem]
  • Tracking: -2%
  • Font Size: 42px [2.625rem]
  • Line Height: 74px [4.625rem]
  • Tracking: -2%
  • Clamp:
  • clamp(2.625rem, 2.2889rem + 1.4151vw, 4.5rem);

Pack my box with five dozen liquor jugs.

Pack my box with five dozen liquor jugs.

Pack my box with five dozen liquor jugs.

Pack my box with five dozen liquor jugs.

Display XL
Regular 400 / Medium 500 / Semibold 600 / Bold 700

Bright vixens jump; dozy fowl quack.

Bright vixens jump; dozy fowl quack.

Bright vixens jump; dozy fowl quack.

Bright vixens jump; dozy fowl quack.

H1 / Heading 1
Regular 400 / Medium 500 / Semibold 600 / Bold 700

John quickly extemporized five tow bags.

John quickly extemporized five tow bags.

John quickly extemporized five tow bags.

John quickly extemporized five tow bags.

H2 / Heading 2
Regular 400 / Medium 500 / Semibold 600 / Bold 700

Viewing quizzical abstracts mixed up hefty jocks.

Viewing quizzical abstracts mixed up hefty jocks.

Viewing quizzical abstracts mixed up hefty jocks.

Viewing quizzical abstracts mixed up hefty jocks.

H3 / Heading 3
Regular 400 / Medium 500 / Semibold 600 / Bold 700

My girl wove six dozen plaid jackets before she quit.

My girl wove six dozen plaid jackets before she quit.

My girl wove six dozen plaid jackets before she quit.

My girl wove six dozen plaid jackets before she quit.

H4 / Heading 4
Regular 400 / Medium 500 / Semibold 600 / Bold 700

Monsieur Jack, vous dactylographiez bien mieux que votre ami Wolf.

Monsieur Jack, vous dactylographiez bien mieux que votre ami Wolf.

Monsieur Jack, vous dactylographiez bien mieux que votre ami Wolf.

Monsieur Jack, vous dactylographiez bien mieux que votre ami Wolf.

H5 / Heading 5
Regular 400 / Medium 500 / Semibold 600 / Bold 700

Wizardly knights vex a dozen powerful dragons on quick paths.

Wizardly knights vex a dozen powerful dragons on quick paths.

Wizardly knights vex a dozen powerful dragons on quick paths.

Wizardly knights vex a dozen powerful dragons on quick paths.

H6 / Heading 6
Regular 400 / Medium 500 / Semibold 600 / Bold 700

Wizardly knights vex a dozen powerful dragons on quick paths.

Wizardly knights vex a dozen powerful dragons on quick paths.

Wizardly knights vex a dozen powerful dragons on quick paths.

Wizardly knights vex a dozen powerful dragons on quick paths.

© All rights reserved.