Guides
px > rems, line heights (18px base)
Font Weight
Font | Weight Name | CSS Weight |
---|---|---|
Arial | Regular | 400 |
Arial | Bold | 700 |
Arial | Italic | 400 (italic) |
Arial | Bold Italic | 700 (italic) |
Stratum | Light | 300 |
Stratum | Regular | 400 |
Stratum | Medium | 500 |
Stratum | Semibold | 600 |
Stratum | Bold | 700 |
Stratum | Black | 900 |
Proxima Nova | Thin | 100 |
Proxima Nova | Extra Light | 200 |
Proxima Nova | Light | 300 |
Proxima Nova | Regular | 400 |
Proxima Nova | Medium | 500 |
Proxima Nova | Semibold | 600 |
Proxima Nova | Bold | 700 |
Proxima Nova | Extra Bold | 800 |
Proxima Nova | Black | 900 |
Line Height
This is a refrence only chart for WCAG - we use default paragraph settings - refer to W3.org for information on meeting AA standards - W3.org - Text spacing
Line Height Multiplier | 16px | 18px | 20px | 22px | 27px | 32px | 39px | 48px | 58px | 71px | 86px | 105px | 127px |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
HEADINGS: 1.2x | 19.2 | 21.6 | 24.0 | 26.4 | 32.4 | 38.4 | 46.8 | 57.6 | 69.6 | 85.2 | 103.2 | 126.0 | 152.4 |
LARGE TXT 20+: 1.4x | 22.4 | 25.2 | 28.0 | 30.8 | 37.8 | 44.8 | 54.6 | 67.2 | 81.2 | 99.4 | 120.4 | 147.0 | 177.8 |
STANDARD LINE HEIGHT 20+: 1.5x | 24.0 | 27.0 | 30.0 | 33.0 | 40.5 | 48.0 | 58.5 | 72.0 | 87.0 | 106.5 | 129.0 | 157.5 | 190.5 |
BODY TEXT: 1.6x | 25.6 | 28.8 | 32.0 | 35.2 | 43.2 | 51.2 | 62.4 | 76.8 | 92.8 | 113.6 | 137.6 | 168.0 | 203.2 |
1.75x | 28.0 | 31.5 | 35.0 | 38.5 | 47.25 | 56.0 | 68.25 | 84.0 | 101.5 | 124.25 | 150.5 | 183.75 | 222.25 |
Px : Rem : Pt
PX | = | REM | PT | PX | = | REM | PT | PX | = | REM | PT | PX | = | REM | PT |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
1 | = | 0.0556 | 0.75pt | 2 | = | 0.1111 | 1.5pt | 3 | = | 0.1667 | 2.25pt | 4 | = | 0.2222 | 3pt |
5 | = | 0.2778 | 3.75pt | 6 | = | 0.3333 | 4.5pt | 7 | = | 0.3889 | 5.25pt | 8 | = | 0.4444 | 6pt |
9 | = | 0.5000 | 6.75pt | 10 | = | 0.5556 | 7.5pt | 11 | = | 0.6111 | 8.25pt | 12 | = | 0.6667 | 9pt |
13 | = | 0.7222 | 9.75pt | 14 | = | 0.7778 | 10.5pt | 15 | = | 0.8333 | 11.25pt | 16 | = | 0.8889 | 12pt |
17 | = | 0.9444 | 12.75pt | 18 | = | 1.0000 | 13.5pt | 19 | = | 1.0556 | 14.25pt | 20 | = | 1.1111 | 15pt |
21 | = | 1.1667 | 15.75pt | 22 | = | 1.2222 | 16.5pt | 23 | = | 1.2778 | 17.25pt | 24 | = | 1.3333 | 18pt |
25 | = | 1.3889 | 18.75pt | 26 | = | 1.4444 | 19.5pt | 27 | = | 1.5000 | 20.25pt | 28 | = | 1.5556 | 21pt |
29 | = | 1.6111 | 21.75pt | 30 | = | 1.6667 | 22.5pt | 31 | = | 1.7222 | 23.25pt | 32 | = | 1.7778 | 24pt |
33 | = | 1.8333 | 24.75pt | 34 | = | 1.8889 | 25.5pt | 35 | = | 1.9444 | 26.25pt | 36 | = | 2.0000 | 27pt |
37 | = | 2.0556 | 27.75pt | 38 | = | 2.1111 | 28.5pt | 39 | = | 2.1667 | 29.25pt | 40 | = | 2.2222 | 30pt |
41 | = | 2.2778 | 30.75pt | 42 | = | 2.3333 | 31.5pt | 43 | = | 2.3889 | 32.25pt | 44 | = | 2.4444 | 33pt |
45 | = | 2.5000 | 33.75pt | 46 | = | 2.5556 | 34.5pt | 47 | = | 2.6111 | 35.25pt | 48 | = | 2.6667 | 36pt |
49 | = | 2.7222 | 36.75pt | 50 | = | 2.7778 | 37.5pt | 51 | = | 2.8333 | 38.25pt | 52 | = | 2.8889 | 39pt |
53 | = | 2.9444 | 39.75pt | 54 | = | 3.0000 | 40.5pt | 55 | = | 3.0556 | 41.25pt | 56 | = | 3.1111 | 42pt |
57 | = | 3.1667 | 42.75pt | 58 | = | 3.2222 | 43.5pt | 59 | = | 3.2778 | 44.25pt | 60 | = | 3.3333 | 45pt |
61 | = | 3.3889 | 45.75pt | 62 | = | 3.4444 | 46.5pt | 63 | = | 3.5000 | 47.25pt | 64 | = | 3.5556 | 48pt |
65 | = | 3.6111 | 48.75pt | 66 | = | 3.6667 | 49.5pt | 67 | = | 3.7222 | 50.25pt | 68 | = | 3.7778 | 51pt |
69 | = | 3.8333 | 51.75pt | 70 | = | 3.8889 | 52.5pt | 71 | = | 3.9444 | 53.25pt | 72 | = | 4.0000 | 54pt |
73 | = | 4.0556 | 54.75pt | 74 | = | 4.1111 | 55.5pt | 75 | = | 4.1667 | 56.25pt | 76 | = | 4.2222 | 57pt |
77 | = | 4.2778 | 57.75pt | 78 | = | 4.3333 | 58.5pt | 79 | = | 4.3889 | 59.25pt | 80 | = | 4.4444 | 60pt |
81 | = | 4.5000 | 60.75pt | 82 | = | 4.5556 | 61.5pt | 83 | = | 4.6111 | 62.25pt | 84 | = | 4.6667 | 63pt |
85 | = | 4.7222 | 63.75pt | 86 | = | 4.7778 | 64.5pt | 87 | = | 4.8333 | 65.25pt | 88 | = | 4.8889 | 66pt |
89 | = | 4.9444 | 66.75pt | 90 | = | 5.0000 | 67.5pt | 91 | = | 5.0556 | 68.25pt | 92 | = | 5.1111 | 69pt |
93 | = | 5.1667 | 69.75pt | 94 | = | 5.2222 | 70.5pt | 95 | = | 5.2778 | 71.25pt | 96 | = | 5.3333 | 72pt |
97 | = | 5.3889 | 72.75pt | 98 | = | 5.4444 | 73.5pt | 99 | = | 5.5000 | 74.25pt | 100 | = | 5.5556 | 75pt |
101 | = | 5.6111 | 75.75pt | 102 | = | 5.6667 | 76.5pt | 103 | = | 5.7222 | 77.25pt | 104 | = | 5.7778 | 78pt |
105 | = | 5.8333 | 78.75pt | 106 | = | 5.8889 | 79.5pt | 107 | = | 5.9444 | 80.25pt | 108 | = | 6.0000 | 81pt |
109 | = | 6.0556 | 81.75pt | 110 | = | 6.1111 | 82.5pt | 111 | = | 6.1667 | 83.25pt | 112 | = | 6.2222 | 84pt |
113 | = | 6.2778 | 84.75pt | 114 | = | 6.3333 | 85.5pt | 115 | = | 6.3889 | 86.25pt | 116 | = | 6.4444 | 87pt |
117 | = | 6.5000 | 87.75pt | 118 | = | 6.5556 | 88.5pt | 119 | = | 6.6111 | 89.25pt | 120 | = | 6.6667 | 90pt |
121 | = | 6.7222 | 90.75pt | 122 | = | 6.7778 | 91.5pt | 123 | = | 6.8333 | 92.25pt | 124 | = | 6.8889 | 93pt |
125 | = | 6.9444 | 93.75pt | 126 | = | 7.0000 | 94.5pt | 127 | = | 7.0556 | 95.25pt | 128 | = | 7.1111 | 96pt |
129 | = | 7.1667 | 96.75pt | 130 | = | 7.2222 | 97.5pt | 131 | = | 7.2778 | 98.25pt | 132 | = | 7.3333 | 99pt |
133 | = | 7.3889 | 99.75pt | 134 | = | 7.4444 | 100.5pt | 135 | = | 7.5000 | 101.25pt | 136 | = | 7.5556 | 102pt |
137 | = | 7.6111 | 102.75pt | 138 | = | 7.6667 | 103.5pt | 139 | = | 7.7222 | 104.25pt | 140 | = | 7.7778 | 105pt |
141 | = | 7.8333 | 105.75pt | 142 | = | 7.8889 | 106.5pt | 143 | = | 7.9444 | 107.25pt | 144 | = | 8.0000 | 108pt |
145 | = | 8.0556 | 108.75pt | 146 | = | 8.1111 | 109.5pt | 147 | = | 8.1667 | 110.25pt | 148 | = | 8.2222 | 111pt |
149 | = | 8.2778 | 111.75pt | 150 | = | 8.3333 | 112.5pt | 151 | = | 8.3889 | 113.25pt | 152 | = | 8.4444 | 114pt |
153 | = | 8.5000 | 114.75pt | 154 | = | 8.5556 | 115.5pt | 155 | = | 8.6111 | 116.25pt | 156 | = | 8.6667 | 117pt |
157 | = | 8.7222 | 117.75pt | 158 | = | 8.7778 | 118.5pt | 159 | = | 8.8333 | 119.25pt | 160 | = | 8.8889 | 120pt |
161 | = | 8.9444 | 120.75pt | 162 | = | 9.0000 | 121.5pt | 163 | = | 9.0556 | 122.25pt | 164 | = | 9.1111 | 123pt |
165 | = | 9.1667 | 123.75pt | 166 | = | 9.2222 | 124.5pt | 167 | = | 9.2778 | 125.25pt | 168 | = | 9.3333 | 126pt |
169 | = | 9.3889 | 126.75pt | 170 | = | 9.4444 | 127.5pt | 171 | = | 9.5000 | 128.25pt | 172 | = | 9.5556 | 129pt |
173 | = | 9.6111 | 129.75pt | 174 | = | 9.6667 | 130.5pt | 175 | = | 9.7222 | 131.25pt | 176 | = | 9.7778 | 132pt |
177 | = | 9.8333 | 132.75pt | 178 | = | 9.8889 | 133.5pt | 179 | = | 9.9444 | 134.25pt | 180 | = | 10.0000 | 135pt |
181 | = | 10.0556 | 135.75pt | 182 | = | 10.1111 | 136.5pt | 183 | = | 10.1667 | 137.25pt | 184 | = | 10.2222 | 138pt |
185 | = | 10.2778 | 138.75pt | 186 | = | 10.3333 | 139.5pt | 187 | = | 10.3889 | 140.25pt | 188 | = | 10.4444 | 141pt |
189 | = | 10.5000 | 141.75pt | 190 | = | 10.5556 | 142.5pt | 191 | = | 10.6111 | 143.25pt | 192 | = | 10.6667 | 144pt |
193 | = | 10.7222 | 144.75pt | 194 | = | 10.7778 | 145.5pt | 195 | = | 10.8333 | 146.25pt | 196 | = | 10.8889 | 147pt |
197 | = | 10.9444 | 147.75pt | 198 | = | 11.0000 | 148.5pt | 199 | = | 11.0556 | 149.25pt | 200 | = | 11.1111 | 150pt |