Full Landing Page + All Details - http://janlosert.com/store/webflow-cards.html My first fully web based UI Template, 100% developed in Webflow Designer. All elements ready to copy & paste or fully clone in to 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 dialog with all form elements covered.
ui kit, ui design, responsive, webdesign, web, blog, sign up, landing page, hero, clonable, resources
A site created for a competition at my workplace. It's still somewhat of a work in progress, I want to continue to make updates on it.
animation, history, cartoons, disney, simpsons, bugs bunny, website, responsive, scrolling website, graphic design, designer, interactive, interaction design, fund
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 beauty for over 120 hours, so if you use it, please consider a donation ^^ https://www.paypal.me/dariostefanutto Thanks for your support! -Dario
wireframes, ui kit, components, blueprints, wire, uxui, userexperience
Hey guys, Here's the first pack of UI elements that I thought I'd share with the community. If this sort of thing interests you sign up to the mail list down the bottom, I have some pretty cool projects in the works ;) Included in this kit is some hover CSS effects that will require custom code. It's pretty straightforward and there are plenty of guides on it! If you want to get involved with Webflow please use our referral link! https://webflow.com/?rfsn=1238427.48b8d You can follow my work here: www.tombekkers.com www.dribbble.com/bekkers And you can follow the agency here: www.oakland.agency www.dribbble.com/oakland
ui kit, uidesign, ui design, web, webdesign, landing, dribbble
Cards 2.0 are Symbol based Framework/UI Kit for quick design or wireframe of your next landing page project. 100+ symbols/elements ready for design or hi-fidelity wireframe for any UI/UX designers or developers out there. The main goal of this project is to help you - Webflow users - with creating beautiful landing pages or wireframes within minutes directly in Webflow with ready to be published code. All again with a coded styleguide for all the main typography elements (H1-H6, links, paragraphs etc.) buttons, tags you name it. What you get/Package overview: 50 New Cards as Webflow Symbols (in 2 versions Dark and Light = 100+ Symbols) 3 Complete landing pages in 2 versions Symbols for Hero sections, Features, Testimonials, Pricing, Team, Blog and more. Ready for all 4 responsive breakpoint Cards from v1.0 recreated into a new structure All cards in Sketch file Happy Cloning! 🎉
ui kit, landing, landing page, wireframes, wireframing, uxui, uxdesign, design
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.
css, parallax, vertical nav, space, sandbox, experiment, don't read my tags
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.
sticky, scroll, interactions, fixed, webflow, tutorial, ix2
A collection of useful animations made on wedflow. telegram: https://t.me/webflow_io youtube: https://www.youtube.com/channel/UCYqajjjpMZJ5h4P3M-PVvUA
interaction, interactions2, animation, animations, 3d animation, tutorial, tutorials, cms, webflow, webflowcms, expert, webflowexpert
A CSS solar system. Apart from one small SVG and an animated GIF for title texture, it's all CSS within Webflow designer. Custom code only for title effect. Custom font from FontSquirrel. This is not the responsiveness we're looking for.
star wars, solar, solar system, cloneable, template
Hey, Just finished another template, it uses a nice bold design, is very simple and easy to edit and focuses on content. This was an interesting site for me because I set myself the challenge of designing it in only an hour which means that I really had to cut the features to just what was needed. PLEASE LIKE, COMMENT AND CLONE! I want to see what you guys come up with! Arthur
freebie, template, clone, throughflow, slick, agency, portfolio, arthur, throughflow labs, brain
This is a quick example showing it is possible to add/integrate React Components into your existing Webflow sites. How I did this: - I first created a static component with all the elements and styles - Published the site and copied the component's HTML from the live site - Converted the HTML into JSX with http://magic.reactjs.net/htmltojsx.htm - Coded a quick todo app functionality and retrofitted the generated JSX - Placed a div on the page where the React Component needs to render (It's a good idea to keep the static components alive on a separate page somewhere for when you want to update the styles etc) That's it; you now have a React Component using Webflow generated styles!
Hey all, I was playing around with overflows to create a one page multi windowed site for personal or creative use. Feel free to clone and edit. Check out this link for help: http://forum.webflow.com/t/help-with-focus-template/8554 Arthur
one page, webflow template, templates, portfolio, personal, interactions, unique, user interface, experimental
A free kit to help get you started Wireframing in Webflow. The base colour is light blue but it can be easily changed. I use this as a template for my new UX wireframing projects. It's fully responsive and consists of about 40+ unique elements. Remember... Close, Play, Enjoy! Many more projects to come so if you clone, get inspired or like this... Follow me :)
wireframes, wireframing, free, freebie, blue, ui kit, ui design, ux design, ui/ux
We built this freely cloneable style guide template to help you kickstart your design process and make your sites more consistent. Just clone it to your dashboard, then use it as a jumping off point for every site to get your type, colors, logo treatments, and component styles locked in from day one — and super-easy to update as needed. For example, if you want to change the style for every H1 on your site, just edit the instance on your style guide, and it’ll automatically update across your site.
styleguide, cloneable, template
There are so many fantastic projects in the Webflow showcase, and (if they're cloneable) you can copy & paste elements into your own projects. That's insanely awesome!! The only thing that's been missing from the showcase is the ability to discover projects with a quick search. This is the first step in that direction. More to come! Please like, follow, and subscribe for updates. P.S. I'm open to feedback and feature requests.
search, searching, search engine, webflow, webflowsites, webflow template, webflow experiment, bestwebflowsite, madeinwebflow, portfolio, projects, inspiration, showcase, ranking, organization, find your project, templates, ui kit, clone, cloneme, cloneable
Another unused personal project I'm giving away free to the Webflow community. Clone, Play, Enjoy! Many more templates to come so if you clone, get inspired or like this... Follow me :)
playfair font, free, freebie, template, blue, white, slider, parallax, icons, news, stock, interactions, portfolio
Introducing, Ridge, the newest webflow clonable from Oakland Agency. We hope you find this useful for building out your own websites. Be sure to check out our other kit if you find this useful! These elements provide a base for you to edit / style towards your own projects, and also a great learning platform for new users to break down components and understand how they are built. Please consider joining our mailing list for updates about this product and future projects! If this provides useful to you, and webflow is something you'd like to try, please use our referral link here. If you would like to follow more of our work you can check at www.dribbble.com/oakland www.dribbble.com/bekkers
ridge, interface, kit, copy, copypaste, clonable, clone, website, template, free, freebies, uiux
The Webflow Editor is pretty intuitive, but that doesn't mean clients couldn't use a handy reference work on it. Which is why I built this site, and am now making it free to clone. So go ahead: clone it, customize it, share it with your clients. And if you or your clients have feedback on how I could make it even more useful, please let me know!
webflowcms, editor, guide
Taking advantage of Webflow's visual designer and powerful visual CMS, this responsive ecommerce template gives you a jumpstart on launching your online store. Simply add your products into the visual CMS, connect to your Foxy account, and deploy your website. Foxy is a powerful ecommerce platform that allows merchants to sell any type of product in their Webflow website. Take advantage of live shipping rates, auto tax calculations, coupons, discounts, and more while allowing your customers to securely pay online with nearly 100 payment gateways and alternate payment methods. Creating your Foxy account is quick, easy, and affordable at www.foxy.io. If you have any questions, feel free to comment here or email email@example.com
ecommerce, e-commerce, shopping cart, webstore, minimal, flat, foxy, foxycart, responsive, store, online shopping
Just a quick template for a photography site or personal portfolio, feel free to clone and use however! Some of the images are pretty big so it might take a while to load.
free, templates, clone, web design, throughflow, photography, photography website, amazing, cool
This was inspired by the following CodePen: https://codepen.io/farmok/full/aYbKOO Learn about how I used the BEM naming convention to create the page in the following YouTube video: https://www.youtube.com/watch?v=gcKprnFVCUQ Also, feel free to ask any questions
bem, codepen, text