harrypotter-progress | Vaadin

This is a Harry Potter themed progress web component made using Polymer 2 library.

[ This description is mirrored from README.md at github.com/binhbbbb/harrypotter-progress on 2019-05-14 ]

Published on webcomponents.org
Vaadin Directory: Published on vaadin.com/directory Star on vaadin.com/directory Rating on vaadin.com/directory Rating count on vaadin.com/directory Latest version on vaadin.com/directory Latest release date on vaadin.com/directory


Live Demo ↗

<shields-badge> is a Polymer 2 web component for generating a Harry Potter themed progress.

<harrypotter-progress active="true" size="1"></harrypotter-progress>

Shield-badge is awesome

Getting Started

The element is a progress which is inspired by Harry Potter's glass and his famous lightning scar. There are some few properties which you can use (active - for running the animation, disabled - if true, loader will be hidden, size - default is 1x, if set 0.5, it will be 0.5x)


Link to this version
ImportedReleased 05 March 2018MIT License
Framework Support
Polymer 2.0+
Browser Independent
Install with
bower install --save binhbbbb/harrypotter-progress"#1.0.1"
Run the above Bower command in your project folder. If you have any issues installing, please contact the author.
Release notes - Version 1.0.1


  • polymer#^2.3.1