Icon Input

Input with icon

Add data-icon attribute with any icon as value to show the icon on the input

<input type="text" placeholder="Username" data-icon="user">

Specify the size with data-icon-size

<input type="text" placeholder="Username" data-icon="user" data-icon-size="40px">

Control the position with data-icon-position. Either left or right, default is left

<input type="text" placeholder="Username" data-icon="user" data-icon-position="right">

Finally, set the color with data-icon-color. You can use hex, rgb, hsl, etc

<input type="text" placeholder="Username" data-icon="user" data-icon-color="green">