Sam, these tutorials have been so vaulable to me and my work and I can't thank you enough for sharing with us! Keep it up man, the Front-end Dev side of UA-cam needs people like you❤
Thanks for this amazing series! I've read framer motion's docs through, and didn't realize how powerful it actually is, until I started watching your videos!
Always look forward to your videos. Your Design sense, teaching style and spirit of generosity in sharing is unparalleled, a rare blend and inspiration. A big thanks to you Sam!
This was very informative and you also fixed the few glitches that occurred, kudos to you and framer motion and tailwind team to make this so beautiful
Wow. I've heard a lot about framer motion but this really sold it for me. I thought for sure you would have to pull the pill out of the map to animate it. Really nice how they handle the scale / radius ratio for you.
I watched this based on Adam Wathan's recommendation and was pleasantly surprised by the quality from a small UA-cam channel. My concern is that the title and thumbnail aren't click-worthy enough for me to have watched this without a human recommendation.
I wonder how this would go combined with the iOS treatment from the last video. So that when you are hovering to the right of the pill, it grows right a few pixels to show the intent.
@Sam Selikoff how can I transform center to specific tab item by clicking it with framer ? I have also drag tab( with framer) . And I also tried with scroll-IntoView and it doesn't well with framer drag .
That's awesome ! Plus the timing is perfect, i just integrated Framer motion to a project. One issue : The mix-blender isn't working sometimes, but can't figure out why... Anyone has a clue ? Thanks a lot !
This feels like magic. Could u pls explain how the layout id actually work under the hood? Removing the pill from one child to another child in the dom. Is it actually removed from the dom?
This is a fantastic way to create animated tabs. However, when the background of the entire screen is white and the button and text are black, the text is not visible. I've tried a lot with other ways, but haven't found a way yet. It would be great if the color could be changed more freely
Awesome video. Can you share your vim config for vs code? I've just started to use the vim extension, and would like some inspiration. Btw which vim extension are you using? Thanks in advance..
Sam, these tutorials have been so vaulable to me and my work and I can't thank you enough for sharing with us! Keep it up man, the Front-end Dev side of UA-cam needs people like you❤
Your attention to detail is second to none
This is insanely simple for how clean the animation is. Great video Sam!
This was probably the best ad framer motion could ever get
🤯It's an insanely simple explanation for such a complex animation. I love the way you covered every minute detail. Thank you so much!!
Thanks for this amazing series!
I've read framer motion's docs through, and didn't realize how powerful it actually is, until I started watching your videos!
Always look forward to your videos. Your Design sense, teaching style and spirit of generosity in sharing is unparalleled, a rare blend and inspiration. A big thanks to you Sam!
Please make more cool scroll animations using framer-motion, really love your work man👍
This was very informative and you also fixed the few glitches that occurred, kudos to you and framer motion and tailwind team to make this so beautiful
this tutorial is simple and good to the point , i'll save this video to watch it later for sure
This is the tutorial that motivated me to learn framer motion..
Really, your handling with subtle visual cues is stunning. Awesome Sam
i can always find the better ways of the complex designs or animations what i tried on your channel, and this is absolutely perfect. thanks Sam.
Wow. I've heard a lot about framer motion but this really sold it for me. I thought for sure you would have to pull the pill out of the map to animate it. Really nice how they handle the scale / radius ratio for you.
It just how should I say, Simple, Subtle and great
really awesome work! love how you go into details and perfection!
Sam, I love your videos! So happy I found your channel! You really take FE development to a next level! Keep it up!
Always learn something new from your content
Sam, great tutorial. I am going to include this in my site's navbar. Thank you!
lol wtf! just a `layoutId` prop and you can have such a cool animation, not only of the position but also the width!
great to know!
This is what I call a valuable content!
Amazing, always looking for something like that and here is video from one of my favorite author
This is awesome, thanks Sam!
incredible per usual
You're the goat for this tutorial
+1 for vim. Gorgeous transition!
thanks Sam. very clear explanation and nice tips as always
You're an awesome tutor, explained so well !🙌🙌
realy good explaning! i will start using framer motion thanks to you!
You’re awesome Sam! Great content as always.
Love your content Sam.
Awesome one Sam 👍. Waiting for the calendar animation
Amazing again Sam!
Really cool and smooth ! Thank you
You just gave me a reason to tryout framer motion thanks!
Sam you are awesome, keep this good work!!
THank you so much sam, very helpful content
Excellent video! Thanks.
I watched this based on Adam Wathan's recommendation and was pleasantly surprised by the quality from a small UA-cam channel. My concern is that the title and thumbnail aren't click-worthy enough for me to have watched this without a human recommendation.
thats why youre the boss man
Thank you 🔥
Ammazing demo !!
Basic solution to a complex problem 🎉
framer motion is powerful
You are a f***** goat ! u saved me hours maybe even days trying to make this
Insane tutorial, thanks ❤❤❤
Framer is awesome
super work
Jesus I love these videos keep it up ❤
Awesome tutorials hoping for the PPP for your Build UI Courses
learnt a lot, thank you
Great tutorial, as always🔥
Спасибо за идею! Очень классно получилось!
Amazing
Awesome!
Instantly watched it 😂😂😂,
Thanks buddy
That is wild
really cool lesson 👌
Love it❤
You are Awesome
Awesome🎉
thank you :)
I wonder how this would go combined with the iOS treatment from the last video. So that when you are hovering to the right of the pill, it grows right a few pixels to show the intent.
@Sam Selikoff how can I transform center to specific tab item by clicking it with framer ? I have also drag tab( with framer) . And I also tried with scroll-IntoView and it doesn't well with framer drag .
This is what I've been looking for HAHHAHAH
More content please 😢
That's awesome !
Plus the timing is perfect, i just integrated Framer motion to a project.
One issue : The mix-blender isn't working sometimes, but can't figure out why... Anyone has a clue ?
Thanks a lot !
you are good teacher , can you teach how to make ripple effect with framer motion and react . like material ui ripple which is reliable
This feels like magic. Could u pls explain how the layout id actually work under the hood?
Removing the pill from one child to another child in the dom.
Is it actually removed from the dom?
please, an example with colors.🙏
Working on it!
@@samselikoff Really want this actively figuring it out now. Buzz kill that it doesn't work with colour. Should be in the title, black and white only
This only works on a static page, if you add it as a navigation between pages it will bug with the animation.
that's why it's called tabs, not navbar
Does anyone know why he uses 'let' instead of 'const' for setting variables?
This is a fantastic way to create animated tabs. However, when the background of the entire screen is white and the button and text are black, the text is not visible. I've tried a lot with other ways, but haven't found a way yet. It would be great if the color could be changed more freely
I haven’t tried this yet but you may be able to use this technique twitter.com/pacocoursey/status/1522641710639194114?s=46&t=k4XEISmV-XBZYtw2JeE4ow
Awesome video.
Can you share your vim config for vs code?
I've just started to use the vim extension, and would like some inspiration.
Btw which vim extension are you using?
Thanks in advance..
I use this one and all defaults! marketplace.visualstudio.com/items?itemName=vscodevim.vim
@@samselikoff Okayy, thanks 👍
guy's a legend and its coming from an indian so he is a legend......
How do I use my own colors still?
Working on an updated demo!
WTFFFFFFFFFFFFFFFFFFFF. I am flabbergasted
forget about code but Sam is looking handsome 😍😍🤩 I guess a lot of girls must have crush on him.
🤯🤯
build with content tabs
Awesome!