Custom Checkbox Styling in Webflow Forms (Quick & Easy)

You will learn how to customize the style of checkboxes inside Webflow forms.
We will take the default blue style and turn it into something more interesting that also matches our design.
▶ Build Multi-Step Forms in Webflow:
inputflow.io
0:00 Intro
0:16 Why the default checkbox looks bad
0:48 Prepare checkbox
1:16 Basic styling
3:21 Styling the checked state
4:43 Custom checkbox icon
6:52 Cursor style
#webflow

[@mikepecha]

▶ Build Multi-Step Forms in Webflow: inputflow.io

[@tayfunkucukkarakurt7661]

Great & Useful video bro! Keep doing your best! :)

[@micdouglass]

thanks mike!

[@joemontero741]

Is there a way to custom radio buttons to look like single select chip and checkboxes as multi-select chip?

[@PeterRychlik]

Your channel is great, your pacing is excellent, easy-to-follow and not monotonous or boring whatsoever. I stayed engaged and interested the entire time, and the way you laid things out starting with basic styles and narrowing down to more advanced styling was really logical and built a solid foundation of understanding (and retaining!) the information! Please keep it up, make more videos and continue being awesome. Also, are you Polish perhaps? Trying to guess by the name and the accent, I couldn't tell because it's not very strong, so I am just curious. I am Polish myself!

[@mikepecha]

Thanks for the kind words Peter :) Really happy to hear that. I have Czech ancestors (that's why I have a Czech/Polish surname), but I am German.

[@PeterRychlik]

Ayy that's pretty cool. I've definitely got some German ancestors in there too, (who doesn't in this part of the world, eh?) But yeah, loving the videos. I'm super impressed that after one watch of just about any of your stuff, I still remember how to do it all. @@mikepecha

[@dasadorahIRL]

Thanks for your video! I selected the form from elements but when the form populates on the page it stretches from one side to another. How to prevent this to look like yours?

[@mikepecha]

You could give the form element a fixed width, or a max-width, then it will no longer fill up all the available space.