design principles
Typography
How understanding typography & hierarchy can help you better convey information
Font families
Serif
Sans-serif
Display
Script
Monospaced
Weights
different weights for different emphasis
Alignment
Spacing
Kerning is the space between letters.
Sometimes, just subtle adjustment can make a whole difference
Don't be afraid
Of adjusting the letter spacing, specially when using headers and titles. Usually, it's necessary !
Don't be afraid
Of adjusting the letter spacing, specially when using headers and titles. Usually, it's necessary !
Sometimes, you can use the extra spacing for a dramatic
EFFECT
specially when going full caps on your titles
Sometimes, you can use the extra spacing for a dramatic
EFFECT
specially when going full caps on your titles
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla at dapibus ex, a scelerisque orci. Donec tristique sed dolor vel semper. Pellentesque id commodo purus.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla at dapibus ex, a scelerisque orci. Donec tristique sed dolor vel semper. Pellentesque id commodo purus.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla at dapibus ex, a scelerisque orci. Donec tristique sed dolor vel semper. Pellentesque id commodo purus.
Too much !
Just righ
Too tight !
Big text usually needs the spacing to me manually adjusted
Big text usually needs the spacing to me manually adjusted
Justification
When in doubt, always justify left !
Consistency
White space
Colors
Black text might be too contrasting in big sizes
Don't be afraid to use dark grays !
In a similar way, black background contrasts too much with white text
Use some more subtle color for the background, or even for the text itself.
Pay attention to contrast when using colors !
There's no need to be too drastic, choose wisely !
https://www.dafont.com/
https://fonts.google.com/
https://www.fontsquirrel.com/
Free font resources
Design principles - typography
By Felipe Delestro
Design principles - typography
- 600