CSS Text Animation with Variable Fonts - Variable Fonts Tutorials

Published: 04 October 2021
on channel: pmCodingTutorials
3,424
70

In today's css animations tutorial, I show you how to animate variable fonts to add subtle movement to your website.

The main CSS property we will cover for the animation is:
font-variation-settings.

Resources:
Movement variable font used in this tutorial:
http://www.nmtype.com/movement/
Source Code:
https://github.com/patriciamolnar/tut...

Sites offering variable fonts:
https://v-fonts.com/
https://fontsarena.com/tag/variable-f...
https://fonts.google.com/variablefonts

Documentation:
https://developer.mozilla.org/en-US/d...



For other CSS animations, check out the following tutorials:
1) Animated Neon Glow Animation with SVG text:
   • CSS Animation:  Animated Neon Glow with SV...  

2) Interactive CSS background animation:
   • CSS background animation tutorial - code i...  

3) CSS Text animation:
   • CSS Text Animation - Animate letters in fr...  

For more web development tutorials subscribe:
   / channel  

Connect with me on social media:
Twitter:   / pmcoding  
Instagram:   / pmcoding  
CodePen: https://codepen.io/patriciamolnar

My website: https://pmcoding.co.uk
Any questions, email me at info@pmcoding.co.uk


On this page of the site you can watch the video online CSS Text Animation with Variable Fonts - Variable Fonts Tutorials with a duration of hours minute second in good quality, which was uploaded by the user pmCodingTutorials 04 October 2021, share the link with friends and acquaintances, this video has already been watched 3,424 times on youtube and it was liked by 70 viewers. Enjoy your viewing!