I love how these utilities can be used on top of the custom class names. Just tried it in a large client project: 3 seconds to copy-paste the styled divs from the clonable and you get 90% (probably more) of flexbox settings covered with just those utilities
The custom element isn’t required and doesn’t affect the way the utilities work. To make the style guide look nicer, I added some additional inline styles that are only supported on the custom element.
Hi Tim, love this. When I rename the class, webflow saying that it "already exist". How I can quickly rename the class name like you did in the end? Thank you!
Thank you! That “already exist” is a weird Webflow quirk. To get around it, we can remove the class from the element, add it back, and then rename it freely. Or we can rename it to u- and then rename it again to the full class we actually want
I use my own framework called Lumos. It has some base utilities that can be used as a starting point, and we can add extra utilities in like these flex utilities I created or animation utilities from my previous video. webflow.grsm.io/tricks?path=lumos-v2-beta
Hey Tim!!!! I remember coming across a video of yours where you flip a 2 column div from left to right to right to left (this helps in mobile design) but I cant find it anymore. Any chance you can lead me to it? :D
I used to think that mastering just webflow is enough, but every time I watch you video my webflow knowledge feels very low, hatsoff
Wow! Amazing as usual! Thank you! 🙏🏻
The resources from your channel are great. Very helpful to develop an efficient webflow workflow
Thank you!!
This is amazing!
This is amazing! love the approach
Thanks so much!
I love how these utilities can be used on top of the custom class names. Just tried it in a large client project: 3 seconds to copy-paste the styled divs from the clonable and you get 90% (probably more) of flexbox settings covered with just those utilities
Hey Tim. Is it possible to create a tutorial for a parallax-like scroll on mobile devices, especially for safari ?
This is awesome. Thanks for sharing!
Why did you use a custom element to create these utility classes and not a regular div block?
The custom element isn’t required and doesn’t affect the way the utilities work. To make the style guide look nicer, I added some additional inline styles that are only supported on the custom element.
Do you plan on adding it to Lumos V2 utilities?
Possibly in a future version! I’ll leave them as an optional add-on for now
Hi Tim, love this. When I rename the class, webflow saying that it "already exist". How I can quickly rename the class name like you did in the end? Thank you!
Thank you! That “already exist” is a weird Webflow quirk. To get around it, we can remove the class from the element, add it back, and then rename it freely. Or we can rename it to u- and then rename it again to the full class we actually want
Thanks. What framework are you using here?
I use my own framework called Lumos. It has some base utilities that can be used as a starting point, and we can add extra utilities in like these flex utilities I created or animation utilities from my previous video.
webflow.grsm.io/tricks?path=lumos-v2-beta
@@timothyricks It's awesome, thanks a lot. The custom properties on the utilities is exciting.
Hey Tim!!!! I remember coming across a video of yours where you flip a 2 column div from left to right to right to left (this helps in mobile design) but I cant find it anymore. Any chance you can lead me to it? :D
Hi, sure thing! Was this the video?
ruclips.net/video/HQB6-RhiIlo/видео.html
@@timothyricks magicccc. Thanks legend!
How can I import your Style Selectors into a project I'm working on?
Hi, you can copy the whole section from the cloneable and paste it into your project. It will automatically add all of the classes in.
@@timothyricks Brilliant, thanks!