Webflow Social Login
.svg)
Cloneable tags
Description
Webflow Social Login is a simple yet effective sign in/login page for Webflow that allows users to sign in with their Google or Facebook accounts. This cloneable, created by Duncan Hamra, is categorized under the Account and Membership categories and can be easily implemented to improve the functionality of your Webflow login page. The form features native Webflow input fields with states, checkboxes, and buttons, making it easy for users to log in and access their accounts. With Webflow Social Login, you can offer your users the convenience of signing in with their social media accounts, saving them time and effort in the process. Webflow Social Login is a great solution for streamlining the login process on your website.
A template on how to use Auth0 and Webflow to create gated client-side content.
A well designed sign up/sign in page for your Webflow site. This sign up or sign in page features a unique confirm password interaction in which appears once the password field is starting to be typed into. The sign up page features a unique rotating logo image, email field, password, confirm password, create account and custom input field states (hover, selected, default).
A login page featuring a sign in form with a password showing button in Webflow. This enables you to add a show password option for the password field of a sign in page on Webflow. This cloneable features a simple login page with email, unique form labels, password label and field, stay logged in checkbox and sign in button. This technique uses some custom javascript which can be found at the bottom of the cloneable of the page as an embed.
A demonstration of creating moving and shrinking labels in Webflow. When a user focuses on the input field the field label moves out from the input field and above it. This method does not use Webflow interactions but a custom script found within the page settings.
A membership pricing table design for Webflow featuring three pricing structures in a clean and modern design. This pricing table cloneable features a unique header section and three different pricing packages with an emphasis on one package. It includes price, description, button and individual pricing options.
Get more insight into why your clients are cancelling with this cancellation insight form for Webflow. This cancellation modal form data is submitted directly to Webflow, meaning it's easy to export and analyze the results at any point.
A free login/sign in page for Webflow. This free Webflow cloneable features a unique feature in which the password field is hidden until a user begins to type their email address. A unique way of turning a simple page into a dynamic one while potentially reducing bot activity.
A free membership splitscreen signup page for Webflow. This cloneable features a sign up page with all of the necessary elements you'd need to create a perfect sign up page in Webflow. This includes sign in with Google buttons, Facebook, first name field, last name, email and password. Each input field has unique states (hover/active/selected) and the entire page is well designed and laid out.
Another fun text effect, this one shows you how to scramble text between transitions.
Here are 18 hand drawn SVG elements for your Webflow site. This cloneable includes 18 different arrows inside individual custom embeds. The great thing about SVGs, when setup properly is that they can inherit their color from the font-color of the parent elements.
A 100% native Webflow tooltips solution. Most tooltips utilize third party JS libraries to add tool tips to Webflow. These tooltips are created 100% with Webflow dropdowns to create a unique solution to creating tooltips within Webflow.
A Matrix style text scramble effect in Webflow. This entire effect relies on custom code which is included as an HTML embed and was found on a CodePen. In order to modify the text you'll need to update the custom code in the HTML embed.
A responsive safari mockup built for Webflow. A perfect way to showcase a product demonstration or image in a responsive Safari style window. This Apple Safari mockup window is a light version rather than a dark version.
A fun login and sign up page for Webflow featuring a unique cartoon character that follows your mouse cursor. This is accomplished via 100% native Webflow interactions. The SVG was broken up into several parts, and added a hover over element interaction to the background and hover/in out interactions to the email, password and login fields. The rotating head effect is created by moving close-up elements slightly more than the background elements. For example, the nose moves 11px to the left or right, while the mouth only moves 9px and the face moves 6px while the body doesn't move at all.
Here's a fun technique, using a slider with a hover slider to dynamically change the color of a sites background in Webflow. This was all made with Webflow interactions.