Slide 1
Slide 1 text
Customizing
Icons to
Complement
Fonts
Gleb
Stroganov
Bites & Bytes. Lisbon. 2023
Slide 2
Slide 2 text
The icon and font
scene
Slide 3
Slide 3 text
Selecting fonts
fonts.google.com
Slide 4
Slide 4 text
Reference icons
feathericons.com
Slide 5
Slide 5 text
Default view
Slide 6
Slide 6 text
Default view
Slide 7
Slide 7 text
Default view
Slide 8
Slide 8 text
Font anatomy
fonts.google.com/knowledge
Slide 9
Slide 9 text
Comparison view
Slide 10
Slide 10 text
Icon modification 1
high-contrast
Playfair Display
Slide 11
Slide 11 text
Icon modification 1
high-contrast
Slide 12
Slide 12 text
Icon modification 1
bonus exploration 1
Slide 13
Slide 13 text
Using character sets
for further inspiration
Slide 14
Slide 14 text
Icon modification 1
bonus exploration 2
Slide 15
Slide 15 text
push the
boundaries and
emphasize the
importance of
exploration
even if we break some rules
Slide 16
Slide 16 text
Icon modification 2
square angles
Kanit
Slide 17
Slide 17 text
Icon modification 2
square angles
Slide 18
Slide 18 text
Icon modification 2
bonus exploration
Slide 19
Slide 19 text
Icon modification 3
ink traps
GT Flexa
Slide 20
Slide 20 text
Icon modification 3
ink traps
Slide 21
Slide 21 text
Icon modification 3
bonus exploration
Slide 22
Slide 22 text
Adjusting arrows
Slide 23
Slide 23 text
EXPLORE
THE WAYS
TO BRING
BEAUTY
INTO YOUR
PROJECTS
new fonts
new icons
new forms
Slide 24
Slide 24 text
Next steps
Slide 25
Slide 25 text
We love icons
and fonts
evil-icons.io Google fonts
Slide 26
Slide 26 text
Learn more about
fonts on our blog
Slide 27
Slide 27 text
@evilmartians evilmartians.com
@strongeron
Thank
you!