Discover the best trendy websites created by professional designers. Get inspired and start planning your perfect trendy web design today!

Learn how to build this and many other interactions on my YouTube Channel at https://www.youtube.com/watch?v=gSWQPaybNiI

Learn how to build a working CMS Pricing Calculator and other Javascript lessons on my Patreon at https://www.patreon.com/timothyricks

T.RICKS Glassmorphism

TLDR; people seem to like this circular text with movement, so I thought I'd try and see if I couldn't hack in WF. I did. This is that.

Powered by circletype.js, it's a little wonky and weird with regards to how it's sized... but it works. Includes interactions for page load, scrolling through sections, and for page transitions.

Clone away, and let me know what you think in the comments!

Circle Text

Trendy AF Circular Text

Rebuild of the https://k72.ca/en nav menu

This cloneable is for learning purposes only. I do not own the rights to this design and content.

K72 Menu

One of my favorite, trendy interactions is a footer that reveals itself once the user gets to the bottom of the page. I've used this effect a number of times, and thought I'd share it with you (trendy vertical nav included)! Enjoy, and clone away!

For Cloners: Be sure to make the height of the section-footer-spacer to be the same as your footer height is for the reveal to work! Or, if your footers height is content-based, duplicate the footer as you want it, rename it, and give it the following values: z-index: 0, opacity: 0, position: relative. That should solve any issues you might have!

Footer Reveal on Scroll

Trendy Footer Reveal!

Welcome to Dribbble series, where I attempt to bring to life projects created by popular Dribble artists using only the elements supplied by Webflow! Todays project is web design 04 - Photo Studio by Romeo M. • https://dribbble.com/shots/5593011-web-design-04-Photo-Studio

In my freelancing using Webflow, 95% of my work involves creating crazy, weird sliders that accomplish certain goals. This project is peak slider; displaying information, using grid, with customizations applied to the snide nav, arrows, & content.

For this project, I opted to change a few things that didn't make sense. For example, there were 3 different places in the page where social links were listed, which felt like overkill. I also nixed the mouse icon in the prev/next section, as the slider doesn't let you interact like that. Clone away, and let me know what you think in the comments! Be sure to download the Fontawesome font family to make sure the icons work (https://fontawesome.com/cheatsheet)

web design 04 - Photo Studio

CSS GRID HERO 2 - Dribbble Series - web design 04 - Photo Studio

Hey everyone!

I've been seeing this nifty trend on Dribbble wherein the top nav has this transparent area around an indicator on the active state so that you can see whatever is behind the link (i.e., image, color, etcetera). However, what I haven't seen is what these sections might look like when interacted with, or as the user goes down a page. So, I built it out for fun, and I've included a super trendy vertical indicator, which indicates where the user in the page, just for kicks.

Thanks for taking a look, and let me know what you think in the comments!

Note: If you clone this project and want to add sections, you'll need to duplicate the 2.0 interaction and apply it to the new section, and add a new link block in the vertical nav that directs to the new section. Otherwise, duplicating this project is as easy as clicking the clone button!

Trendy Top Nav with Vertical Indicators

Trendy Top Nav with Vertical Nav Indicator

Watch the tutorial at https://www.youtube.com/watch?v=aHeG-XDiEDs

MRstudio

Hey there guys! Was bored and decided to design this homepage from scratch off a trendy-fashion brand in a few hours. Enjoy and use for educational purposes.

Trendsetter

Trendsetter - Free

A creative and unique website design explorations based on a shipping service category 

Hope to see to feedback on this! And feel free to Explore :)

Shipping Sass Web Layout

Shipping-sass-web-layout

Role: design & development
Date: jun 2022

Url (old version): https://www.topazaviation.com.kg/

Info:

Topaz Aviation is the first and only charter business aviation company founded in Kyrgyzstan. Them cover the huge areas of Central Asia, providing high quality services for the demanding audience.

Topaz aviation

Topaz Aviation

A design and marketing agency SNAP solutions website. The main feature was to implement:
- organize blocks and website storytelling in the solid way of "Golden Circle" and answer client's main questions

- realize horizontal scroll on the main pages

- create an online test for gathering results (TESTING folder - https://www.snapsolutions.io/testing)

- make static illustrations and infographics interactive and animated (TEAM folder - https://www.snapsolutions.io/team )

- Non-horizontal mobile version

- included SEO features, OpenGraph, Search Console, Google Analytics, Custom Domain

SNAP solutions

SNAP Solutions - design & marketing website

you got amazed when you interact with this portfolio. This is my very first portfolio. I have given some more power to the cursor and very soft visual designs.

Discover trendy websites built by the Webflow community

Discover trendy websites built by the Webflow community