Input field documentation

Hey đź‘‹ Make sure to check out the full-size attachment.

As part of our app refresh, I had some time to go over our components and make a styleguide/documentation for designers/developers working with the product.

We are following the 8px grid for our components and I decided to build every state of input fields as a component instead of having one single master. I think this causes less confusion for users who aren't experienced with design tools/layers, and also requires less resource load since we don't load every single variant of an input field every time.

I'm also hoping having one component for every variant will play better with Figma's auto layout in the future.

Make sure to follow me if you want to see more of this project.

forms.png
200 KB
Download

More by Esben Lorenzen

View profile