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

Share moodboards with your clients directly from your website and receive feedback that can help improve your designs. 

We use this Moodboard tool internally with clients and they love it, so we thought we'd share it with the community. 

Quick notes:

- The tool uses Jetboost.io
- We've created a Figma template (https://www.figma.com/community/file/981779110629528999/Relume-Moodboard-Template) for all moodboard images
- Go to the settings page to adjust the styling and add new Jetboost boosters so that you can configure your own like buttons

---------

Like this cloneable? 

We've built the world's largest component library and we're excited to release this to the Webflow Community! Simply search from 650+ components, copy with one click and paste them into your Webflow project. 

Get access to Relume Library BETA
-> https://library.relume.io/

Upvote on Product Hunt
-> https://www.producthunt.com/posts/relume-library

Relume Moodboard Tool

Refokus

How do you create custom sliders in Webflow?

Use Refokus Slider Generator to create custom sliders with static elements or CMS collection lists. This tool is powered by SlickJS, allowing you to use all of this slider flexibility without writing a line of code.

Refokus Slider Generator

Slick Slider Generator (by Refokus)

I have wasted lots of time over the years exploring all the css easing options that Webflow offers. That being said, I decided to make a one-page guide that conveniently displays all ease options at once. Feel free to clone it!

I hope this is helpful to you! Updated April 2021.

Webflow Easing

Webflow CSS Easing Visualized

How do you add CMS Filters in Webflow?

Use this Refokus Tool to create one or more filter sets (also possible as individual CMS Collections) to filter results on a CMS collection list. The core is based on the core form elements (Input, Dropdown, Checkbox, and Radio Buttons) with which you can create any type of filtering UI, such as toggles, tags, tabs, switches, and anything else you can visually imagine!Additionally, the input element can be used to create live search filtering results on the collection item.

Refokus Tools: CMS Filters

CMS Filters (by Refokus)

Learnflow is a free template to learn how to no-code in Webflow.

You'll learn how to..
1. Add a comment section with Remarkbox
2. Integrate a chat box with Crisp (our sponsor)
3. Translate your site instantly with Weglot (our sponsor)
4. Integrate a video chat with Daily.co
5. Sell digital assets easily with Gumroad
6. Track events and conversion rate with Splitbee
7. Add 3D scenes and elements with Spline 
8. Add a radio with RadioKing
9. Create a community space with Memberstack
and +10 other exercises to integrate powerful features to your website. 

For more informations, visit https://www.supercreative.design/download/learnflow

Clone the project to get started.

If you have any questions, you can either leave a comment below or join the Discord server! https://discord.gg/jN9wvyZT

For more informations, visit https://www.supercreative.design/download/learnflow

Clone the project to get started.

Learnflow

Empowering the Webflow Community, Agencies and Marketing Teams with Refokus Tools. A free collection of our in-house tools, adding more functionality to Webflow.

We created Refokus Tools to give back to the community—collecting our knowledge and sharing it one designer, developer, marketer, and brand manager at a time.

Current Tools:
- Social Share
- Time to Read
- Slider Generator
- Page Transitions
- Rich Text Enhancer
- Masonry Layout
- Form Validator
- Image Magnifier
- CMS Filters
- Automatic Tabs
- API Filler (Data)
- CMS Prev/Next
- CMS Load More
- Copy to Clipboard
- CMS Tabs

New tools coming every month! 

Refokus Tools (v2)

Refokus Tools

Refokus Tools it’s a collection of tools for Webflow created by Refokus (yes, us!) that range from small boosters that improve a specific Webflow’s functionality (like CMS load more) to bigger features built from scratch (like CMS filters).

One of the biggest misconceptions of no-code is that you are limited to the tool you are using, and that code is not part of the equation. We challenge this every single day at Refokus by building on top of Webflow, pushing the boundaries of no-code even further. These tools are our own toolset of internal resources to run a successful digital agency.

Refokus tools

How to add CMS Tabs in Webflow?

Use Refokus CMS Tabs to create powerful tabs where the tab menu and content are managed from a CMS collection.

CMS Tabs

CMS Tabs (by Refokus)

Hey Friends!

Adding a date field doesn't have to be tricky. Here's one that you can add in 30 seconds, and it includes some of the basic styles to help you customise it.

Oh, it will also inherit the sites <body> typography, so if you want it to match your sites vibe, please be sure to have that selected.

You can find the code in the page settings, and utilise it by adding the custom attribute that you'll find on the demo input field.

For the full guide, visit flowbase.co

-------------

Discover the world's largest collection of Webflow components.

⭐ flowbase.co/explore

Instantly copy from our huge library with a single click. Premium components that help you solve problems faster. 

Become a member today!
⭐ flowbase.co/club

Webflow - Date Picker

Webflow Date Picker

Vibrand Design

Hey Webflow Fam,

this page is a supplement to the Webflow X GSAP presentation by Dennis Karg presented at the German-speaking Meetup on 20/07/2022. It is therefore primarily intended for the meetup attendees, but of course you can use it for yourself as well. 

It serves as a great help to get started with the animation library GSAP and gives you some recommendations for sources and people you could follow for more GSAP related content. 

Here's the summary (German) of the last Meetup: https://www.vibranddesign.com/blog/webflow-gsap-meetup-recap

The next German-speaking Meetup is already being planned and will probably take place in September. To make sure you don't miss the next one, follow Dennis Karg on Twitter (twitter.com/Dennis_Karg).

Have a great day and have fun with your start in GSAP!

Dennis from Vibrand Design ✌

Webflow X GSAP - Meetup Cloneable

Flow Keeper is the perfect website for Webflow designers and no-code developers who want to easily locate and sort over 1500+ tools, inspiration, typography and more resources.

Any feedback would be appreciated. Thank you!

Flow Keeper

Flow Keeper · 1500+ resources for Webflow

I've created a small site library with a bunch of great tools and games to expand your creativity and workflow.

Flygh Media Resources

Webflow Resources

SiteFlow - the no-code way to build sitemaps. A simple symbol-powered cloneable that allows you to easily build beautiful sitemaps within Webflow! 🔥

With SiteFlow, building a simple landing page sitemap takes less than 5 minutes!

Wow your clients, host them sitemaps on your own subdomain, choose from three beautiful and professional templates! 🚀

Feel free to ask any questions below or shoot me a DM/email!

We hope this is useful! Enjoy :)

SiteFlow

[Cloneable] SiteFlow - Visual Sitemap Builder

SignFlow - the no-code way to build email signatures. A simple CMS cloneable that allows you to easily create + manage email signatures within Webflow! 🔥

We've created a step-by-step guide to help you use SignFlow properly as well as tips + tricks to manage your email signatures.

With SignFlow, building an email signature takes less than 2 minutes!

Upgrade your old, tacky and boring email signature using one of our three beautiful and professional templates! 🚀

Feel free to ask any questions below or shoot me a DM/email!

We hope this is useful! Enjoy :)

SignFlow Builder

[Cloneable] SignFlow - Build Email Signatures All Within Webflow

No-Code Supply Co. (aptly dubbed NCSC) is a resource for helping people explore what’s possible with no-code tools. Every day we expand our vast directory with a variety of inspiring websites, useful apps, delightful code snippets, and much more — to help you design and build your next website, app, or digital experience.

The items curated (and in some cases created!) for NCSC are a direct reflection of the no-code movement itself, and are represented by four main categories of Inspo, Code, Learn and Tools.

No-Code Supply Co

No-Code Supply Co.

How to add CMS Load More in Webflow?

Use Refokus Load More to extend Webflow’s pagination adding a Load More Button on your CMS lists.

Refokus CMS Load More

CMS Load More (by Refokus)

Let this made-in-webflow robot chose the appropriate HTML5 tag for you element. Answer its questions and it will tell you what semantic element to use and why.

This mini site comes with an article for the Webflow Blog, about HTML5 Tags. https://webflow.com/blog/html5-semantic-elements-and-webflow-the-essential-guide

HTML5 Semantic Element Robot

The HTML5 Robot

A set of Photoshop, Illustrator, Sketch, Adobe Xd and Affinity Designer templates to generate useful assets for your Webflow projects.

Discover tool websites built by the Webflow community

Discover tool websites built by the Webflow community