Making your forms look less “straight out of the box” is sometimes just as simple as adding a border-radius to things. In this quick post, I figured that I would show the power of it.In the below pen, there isn’t any fancy CSS. There is a form with a border, three inputs, and two buttons. Next to the “username” input and the “password” input, there are font awesome icons but beyond that, there aren’t any libraries of external dependencies.
It is a pretty straight-forward webform. Now, let’s see what happens when you add
border-radius: 5px; to the form, input class, and button class.
Have a question, comment, etc? Feel free to drop a comment, below.