Profile PictureWebDev For You

New! Interaction #151 is now in the subscription!

Interaction #151 is now in the subscription!

View interaction here: https://webdev-for-you-interaction-151.webflow.io/

The video tutorial covers how to create an animated grain background texture. The texture is created in Photoshop and then added to Webflow. The grain background is animated via interactions in Webflow. The image is edited via photomosh.com and the illustration is created in Illustrator. The illustration then scales in on hover in Webflow.

Inspired by this website here: https://carnival.withspotify.com/

Websites referenced in video:

Creating a grain texture in Photoshop: https://redstapler.co/css-film-grain-effect/

Photomosh for editing photos: https://photomosh.com/

Coolors.co for selecting colors: https://coolors.co/

Feel free to contact me via the WebDev For You contact form if you have any questions!

Best,

John

Subscribe Today!

New! One Page Website - DevBook - Part 3 is now in the Subscription!

New! One Page Website - DevBook - Part 2 is now in the Subscription!

New! One Page Website - Part 1 is now in the Subscription!

New! Interaction #40 is now in the subscription!

New! Interaction #43 is now in the subscription!

See all posts from WebDev For You

Powered by