Password Toogle Demo

You can find here few exemples of password input custom element.

With default style

You can use this custom element without any css framework

Without parameters
<input type="password" is="toggle-password"/>
Override labels
<input type="password" is="toggle-password" data-show-text="Voir" data-hide-text="Cacher"/>
With default icons
<input type="password" is="toggle-password" data-display-icon="true"/>
With custom icons
<input type="password" is="toggle-password" data-display-icon="true" data-icon-show="./icons/hide.svg" data-icon-hide="./icons/show.svg" />

With bootstrap style

You can also use this custom element with your favorite css framework like boostrap

Without parameters
<form>
    <div class="form-group">
        <input class="form-control" type="password" is="toggle-password"/>
    </div>
</form>
Override labels
<form>
    <div class="form-group">
        <input class="form-control" type="password" is="toggle-password" data-show-text="Voir" data-hide-text="Cacher"/>
    </div>
</form>
With default icons
<form>
    <div class="form-group">
        <input class="form-control" type="password" is="toggle-password" data-display-icon="true"/>
    </div>
</form>
With custom icons
<form>
    <div class="form-group">
        <input class="form-control" type="password" is="toggle-password" data-display-icon="true" data-icon-show="./icons/show.svg" data-icon-hide="./icons/hide.svg" />
    </div>
</form>