Hey! 👋

Here's a cloneable step / process section. Edit this to suit a timeline, process or anything you can think of. 

⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃

🥰 Support Us:

𝙄𝙛 𝙮𝙤𝙪 𝙚𝙣𝙟𝙤𝙮 𝙤𝙪𝙧 𝙘𝙤𝙣𝙩𝙚𝙣𝙩, 𝙥𝙡𝙚𝙖𝙨𝙚 𝙘𝙤𝙣𝙨𝙞𝙙𝙚𝙧 𝙨𝙪𝙥𝙥𝙤𝙧𝙩𝙞𝙣𝙜 𝙪𝙨 𝙤𝙣 𝙤𝙪𝙧 𝙨𝙤𝙘𝙞𝙖𝙡 𝙘𝙝𝙖𝙣𝙣𝙚𝙡𝙨. 𝙔𝙤𝙪𝙧 𝙨𝙪𝙥𝙥𝙤𝙧𝙩 𝙝𝙚𝙡𝙥𝙨 𝙪𝙨 𝙜𝙧𝙤𝙬 𝙩𝙝𝙧𝙤𝙪𝙜𝙝 𝙧𝙚𝙖𝙘𝙝𝙞𝙣𝙜 𝙛𝙪𝙧𝙩𝙝𝙚𝙧!

⦿ Website @ www.flowbase.co
⦿ Webflow @ www.webflow.com/flowbase
⦿ Twitter @ www.twitter.com/t_bekkers
⦿ Instagram @ www.instagram.com/flowbase.co

⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃⁃

✒️ Licence Notes:

⦿ Images available under CC0 (Unsplash, Pexels, Freepix or Similar)
⦿Typography available under SIL Open Font License 1.1 (Inter)
⦿ Iconography available under CC0 (UpLabs, Flaticon, Noun Project)

Process Step Component | Flowbase

.mask {
  -webkit-text-fill-color: transparent; 
  -webkit-background-clip: text;
  -webkit-text-stroke: 1px #fff;
}

Great browser support (IE is not supported)

Custom Clipping Mask

YMU Group

Yup, our first "official" handshake with the rest of the planet. We tried our best to build something enjoyable to use, whether you're 5 or 85. Simple, chunky and graphic, but staying functional (we hope), we like having a site that feels a little like Lego.

Okalpha

Help customers understand how much your product costs, and (most importantly) which plan is best for them. MemberStack's costs are dependant on a websites volume of sales and the features they need. I added a sales volume slider using IX2.

Ix2 Pricing Slider - Cloneable

One of my favorite modern web effects is when a menu hides on scroll down and reveals on scroll up. Most mobile web browsers like Google Chrome do this for their top menus, and for good reason; moving these elements out of the way of the user allows the page content to reign supreme.

I use this effect on my personal site, and now so can you! You can also customize the delay or offset to whenever you'd like the menu to start disappearing or reappearing. Don't forget to like, comment, and clone away!

Fancy Hide/Show Menu on Scroll

Hey everyone! Just playing with some super simple headline highlight effects, and thought I'd share them with you! Enjoy!

Headline Highlight + Display on Load/Scroll/Click

Just another experiment...

Saw an interesting interaction online and thought I'd try to translate it into webflow. I also added the same interaction on scroll over for mobile, so nobody gets left out! Clone away, Webflow-ites!

Circular Hover Effect

roknrol.studio

buttons-031b4d

Full Landing Page + All Details - https://janlosert.com/webflow-cards

My first fully web-based UI Template, 100% developed in Webflow Designer. All elements ready to copy & paste or fully clone into your projects! 

I prepared all styles for all the main typography elements (H1-H6, links, paragraphs etc.), button, tags, alerts or social icons. And then using these “atoms” create as many cards as possible for you to have a nice starting field for new designs. I ended up with 28 cards in total My main aim was to create something visually beautiful for new users or developers who are, to put it nicely non-designers.. All of them are obviously responsive in all Webflow stages. There are 2 hero sections, nice product cards, article thumbnails for the blog or even sign up dialogue with all form elements covered.

Cards - Webflow UI Kit

Parallax

Another beautiful illustration by @Ryan Morrison that I built out with div blocks and animated in @Webflow

Webflow Editor Page Illustration Animation

I am inspired and honored to work with Ryan Morrison at Webflow, he does amazing work! Ryan recently designed a beautiful illustration for our new home page at Webflow, the moment I saw it, I just wanted to animate and build it all in Webflow. 

So I decided to bring it to life in Webflow without using any images, yep, those are all div blocks :D

Recreated illustration and animation

Another fun project today,

This Apple Keyboard is purely made out of html elements and css using Webflow


ps: I Love Feedback!

Pure CSS Apple Keyboard

More an experiment than an example to follow... a vertical parallax using only webflow and custom CSS code. It's a bit hard to fine tune and maintaink lot's of tweaking, but it mainly works.

Asger Krause