Use CSS To Improve Your Typography - Scale

Use CSS to improve your typography - Scale

 

Always compose with a scale, whether it’s the traditional scale developed in the sixteenth century that we’re all familiar with, or one you create on your own. A scale is important because it establishes a typographic hierarchy that improves readability and creates harmony and cohesiveness within the text.

 

An example of a typographic scale defined in CSS:

 

01 h1 {

02 font-size: 48px;

03 }

04

05 h2 {

06 font-size: 36px;

07 }

08

09 h3 {

10 font-size: 24px;

11 }

12

13 h4 {

14 font-size: 21px;

15 }

16

17 h5 {

18 font-size: 18px;

19 }

20

21 h6 {

22 font-size: 16px;

23 }

24

25 p {

26 font-size: 14px;

27 }