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

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

Hey guys,

Here's the first pack of UI elements that I thought I'd share with the community.

Please Note: This project was made 2+ years ago, and doesn't meet our current quality standards. BUT hopefully, it can still help someone <3 
⁃⁃⁃⁃⁃⁃⁃⁃

🥰 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)
⦿ Iconography available under CC0 (UpLabs, Flaticon, Noun Project)

Avo - Webflow UI Kit (Clone)

Avocado - Webflow UI Kit

I liked Pitch's old website so much that I wanted to develop it in Webflow to learn, to give the project to others to learn too, and to show once again what Webflow is capable of - 100% visual development, no custom code was used.

Pitch's old website for comparison: http://web.archive.org/web/20201004032417/https://pitch.com/

I built 3 pages in total:
• Home: https://pitch-rebuild.webflow.io
• About: https://pitch-rebuild.webflow.io/about
• Blog: https://pitch-rebuild.webflow.io/blog

--

Tutorials incoming on my YouTube channel, subscribe 👉 youtube.com/channel/UCgwvah4M6Anta4_5ACFiuRQ

--

• Do you need web design & development? Get in touch 👉 bjorn-encutescu.webflow.io/

• Follow my daily tips on Instagram 👉instagram.com/bjorn_encutescu/

Pitch Webflow Rebuild

Hey! 👋

Here's a free cloneable landing page!
Simply clone this project to your account and edit it as you need! 
We have used clear class naming and structure to ensure its as easy to follow as possible!

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

🥰 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)

Cloneable Start-up Template (CLONE)

Circle is a platform where you can learn everything you need to know to launch a successful e-commerce start up. On such a platform, you can study core topics as management, finance and creating websites.

Circle Website

Сircle Website

Hello everyone!

The Agency - Is a free clonable website made for any marketing or design agency.

This is my first webflow project in which I tried to implement animations and certain features found on the websites of the most powerful agencies in the world.

Inspirations: curberto.com | fleava.com
       
Fonts used: Neuzeitgrolig | Warning | Graphic

Fell free to use this template in any of your projects!

Much more will come!

I hope you like it! :)

-> Facebook - https://www.facebook.com/sivadvertising
-> Instagram - https://www.instagram.com/sivmedia/
-> Website - https://www.sivmedia.com/

Demo1

The Agency - Cloneable Template

Recent portfolio refresh that features my graphic, digital, UX/UI and product design work as well as some personal photography and design explorations.

Madisen Fedo's Portfolio

UX/UI Portfolio

Brand new website launched Jan 2020

London based designer focusing on User Experience, User Interface & Web Design.

I've always been passionate about helping start-ups. I love the challenge of starting with a clean slate and designing a successful product from the ground up, and I've been fortunate enough to work with clients from across the globe.

In my spare time I love traveling to a new corner of the world, taking as many landscape photos as I can when passing through.

Overton Graphics

Josh Overton

Skillex has facilitated practical learning experiences for students all over the globe for 10 years now. This platform is a place to learn from world-leading experts in their field. It is priceless to become a member of a supportive community. Students can choose between 250 online courses in 10 fields, including data science, art, business, and many others.

Skillex

Skillex Online Education

Easily Create Web Design Proposals for your clients.

Proposal

Web Design Proposal Generator

🏆 Awwwards Honorable Mention
🏆 Awwwards Mobile Excellence
🔗 awwwards.com/sites/monograph-communications

This site features a contrast typography design with the sans-serif (Roboto) representing the corporate professional side of the business, and the serif (Zangezi designed by Daria Petrova) representing an appreciation for the history of the written word.

The website features a restrained typography and linework-based design, which floats over these beautiful colour backgrounds. 

The entire site is designed using webfonts, SVGs, and linework so the website loads fast. The BG images are the only large files, so I used Webflow's interaction features to make the website wait until the user's browser has loaded the entire background image, then it slowly fades in. This is great because the user never has to see the image loading if they have a slow connection.

Check out my case study here: garycolwell.net/monograph

Monograph Communications

I create engaging experiences for people, and occasionally for cats. I'm a full-time creative, cat dad, and partner that believes equity and inclusion are instrumental to the progress of design and imperative to the UX process.

Portfolio

liamforshort

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 in Webflow

Recreated illustration and animation

Plan your voyage to Earth's moon, to Mars, Jupiter or Saturn!  

Original concept and design by Mike Delsing, brought to life on the web in Webflow by yours truly.

spaced

Spaced - To Space & Back — responsive, interactive website 🚀🌙🌎✨👾

VIREFLOW

Vireflow | Webflow Wireframe kit

Hey Webflow tribe ! 😁

We know you guys love clonable projects !

And we love them too ! 

What better way to learn and get inspired than by deconstructing existing projects, while saving tons of time and struggles.

And it’s because we got to learn sooo much with Webflow projects shared by awesome designers over the last few years that we decided to create our own Webflow UI Kit, to give you the opportunity to deconstruct and learn step-by-step how to use Webflow to create beautiful and interactive websites.

Hope you guys like it ! ;D

- - -

For more Webflow components & tutorials, visit our website :
=> www.nocodetribe.com

NoCodeTribe Webflow UI KIt

Webflow UI Kit - NoCodeTribe

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

Recreated Editor illustration and animation in Webflow

Webflow Editor Page Illustration Animation

Candy Brittle - This is a free clonable template for a candy shop or any other niche do you want to develop.

I found on Dribbble a photo so, I wanted to recreate this one in Webflow. The entire design of the landing page was created in Figma, and then I translated it into Webflow. 

For the first heading - Power of Candy Brittle, I combined 2 fonts (Lovelace & Erotique) for an interesting effect of the section.

And for the slider below I used one variation of a slider made by Timothy Ricks, which I adjusted a little bit to be exactly like the version I found on Dribbble.

Inspirations: dribbble.com

Fonts used: Lovelace | Erotique | Megabyte

Images: Brittle & Beyond website | Unsplash

Fell free to use this template in any of your projects!

Much more will come!

I hope you like it! :)

-> Facebook - https://www.facebook.com/sivadvertising
-> Instagram - https://www.instagram.com/sivmedia/
-> Website - https://www.sivmedia.com/

Discover web design websites built by the Webflow community

Discover web design websites built by the Webflow community