DEV Community

Cover image for Full Page: 20 Advanced CSS & HTML techniques: clip-path, @property, aspect-ratio and blend-mode
Astrit
Astrit

Posted on • Edited on

14 3

Full Page: 20 Advanced CSS & HTML techniques: clip-path, @property, aspect-ratio and blend-mode

Today I am sharing with you this advanced CSS & HTML tutorial where we are going to go through some of the best techniques to achieve the effect that you see on this landing page like mix-blend-mode, clip-path, position: sticky, css grid and what not.

This is a 2hr long tutorial where I explain how I build that demo landing page start to finnish and along the way you can find some very interesting things.

We are going to build an entire landing page with a hero, gallery, list, object rotation and the final section position sticky horizontally.

Note that time to time I might have mixed the words but please don't mind me this has been a very long tutorial and just my second video.

Source:

https://github.com/astrit/youtube

Demo:
https://css.gg/epic/index.html

Top comments (0)

AWS Security LIVE!

Join us for AWS Security LIVE!

Discover the future of cloud security. Tune in live for trends, tips, and solutions from AWS and AWS Partners.

Learn More

👋 Kindness is contagious

If this post resonated with you, feel free to hit ❤️ or leave a quick comment to share your thoughts!

Okay