This is a fun scroll interaction thingy heavily inspired by some interactions found on colabgroup.com.

It's really hard to customize the content of the slides, but you could probably connect them to the CMS or just hide/show the default transform values for each slide. 🤙

Hidden Sections

The idea for this is to highlight the item based on the movement of the mouse. 

No custom codes were used.

Feel free to clone and enjoy!

Accordion Highlight - Interactions

This is the official project starter cloneable for Client-First.

It contains a style guide page with all the utility classes that come with the Client-First style system.

What is Client-First? https://www.finsweet.com/client-first

Full docs: https://www.finsweet.com/client-first/docs

Made with 💪 by Finsweet

Client-First Cloneable

One of my frustrations with Webflow transitions is that achieving a good horizontal scroll effect with things like parallax is not possible out of the box. The "while scrolling in view" trigger only works for vertical scroll. So, after some trial and errors, I came up with a setup that gets the job done!

Hokaido is a free template focused on images and horizontal scroll. It's main features are:

1. Works well with CMS - no need to manually tweak any transitions, the horizontal scroll works with any number of CMS elements.

2. Parallax effects - create cool horizontal parallax effects, with the current setup, it just works!

3. Cool page transitions - go from page to page with a smooth transition between different projects.

Want to know how the trick is done? Clone it, change it, make it your own!

Hokaido - Free Horizontal Scrolling Template

A Cloneable Responsive Website for Kids Competition where users can participate in the competition and add their submissions.

I have designed this in Figma, Developed it with Webflow, and Airtable for handling Submission.

Hit the LIKE button to show your Support! 😄

Available for Work: Mail me at rehankhurshid1@gmail.com

Check out my Portfolio: www.rehankhurshid.com

Junior Bolter

I'm Jo Ash Sakula, a product designer with a speciality in digital health.

After working on some wicked projects over the last year, I finally managed to put together a new portfolio. Created with lots of coffee, some help from the community and a wee bit of custom code.

Thanks for stopping by :)

jashsak-portfolio

We built 20 CSS Button Hover Styles inspired by Codrops for the Webflow Community. 
Copy them, modify them, and have fun using them in your own projects.

You want more?
Just tell us what kind of component or layout you'd like and we'll build it for the community.

✌ If you like this project, don't be shy and follow our Webflow profile to not miss any future clonables for the Webflow community.

Best wishes from Germany and stay healthy!

Vibrand Design

20 CSS Button Hover Styles

A prototype I worked on at Headspace. I had so much fun making this.

The hero section is composed of 6 different lottie animations to achieve some subtle movement.

Happy to answer any questions :)

Sleep by Headspace

Another year, another iPhone, another website rebuild!

iPhone 12 Pro Rebuild

Hey designers 👋

We're super excited to announce FontInLogo.com with you today! 🤩Demystify famous brands font with FontInLogo.

FontInLogo helps you search and find a World Brands (and other) Logo with their font details.

A tool for everyone who tried to design a logo 

The idea of FontInLogo came up from our dealing team(@ azwedo.com) lecturing about the importance of well-known fonts. We started collecting data and ended up with a platform that lets you search brands and find out what font they are using. Fun right?

The platform is FREE to search for any Logo and find any Font used by world brands.

🥳Yes, anyone can join the FontInLogo community
So whether you’re new to design or consider yourself a pro — your contribution to submit a logo font(that’s not in our list) is welcome here.

We've built the platform from Zero to Hero in just 7 days, this is becoming our routine of building valuable products

Give it a try - Can't wait to see what you think!

Fontinlogo.com

Font In Logo

This is a simple one-pager in black and white. 
- Full height hero
- Sections for value props that expand to full width.
- A how-to section using a grid
- A CMS collection using a grid (so nice)
- And a footer with images fixed to the bottom.

I combined a display serif called Tiffany for headings and a geometric sans called DM Sans for the body. I think they make a nice combo. Tiffany is a paid font. If you want a Google equivalent, try DM Serif Display or Abril Fatface.

Disclaimer: My naming conventions are horrible. Maybe you can do something better. Lol.

--- 

I made this for Open Peeps—a hand-drawn illustration library packed with doodle building blocks. You could use them in product imaging, marketing, comics, product states, user flows, personas, storyboarding, quinceañera invitations, or whatever you want!

open-peeps-landing-page

Wouldn’t it be great if you could use vibration in your mobile/tablet application?

This is a basic tutorial on how to implement/trigger the vibration in phone/tablet devices when user clicking on an element.

vibrating-buttons

Kubo's uniqueness lies in the combination and enhancement of two senses: olfaction & taste.
This website was created to introduce this concept providing the ability for visitors to buy products and book pastry workshop.
I have made the whole graphic design, brand identity and webdesign.

kubo-patisserie.com

Here's a short tutorial on how to add particles to your project.

Follow my profile to get notified about new tutorials of cool Webflow tricks.

Tutorial Floating Particles.js

I was super inspired by the incredible work done by the team behind the Epicurrence 8 site design that I just had to take a stab at rebuilding it this past week 💜

Epicurrence site rebuild (2018)

The issue with common templates is that they offer a predefined UX and UI, while designers usually only need white-labeled building blocks when they start a project.

I couldn't find anything like this in the templates marketplace, so decided to build my own responsive wireframe kit.

The aim of this kit is to allow Webflow designers create wireframe prototypes directly in Webflow, ideally skipping Sketch and Invision. 

The great thing about using Webflow is that the wireframes can be turned into the final product. How cool is that? Efficiency over 8000!

I worked on this for over 120 hours, so if you use it, please consider a donation ^^ https://www.paypal.me/dariostefanutto

Thanks for your support and don't forget to subscribe to my account! I'll add more free templates.

-Dario

Legowerk

016 Button

This is demo of some "sticky on scroll" elements I created completely within Webflow. I tried my best to explain how I did it, but I'm happy to answer any questions you have about the setup.

NOTE: This setup may not work in older browsers.