Default Progress Bar Large
Brooklyn’s default progress bar comes with 2 predefined sizes, large and small.
Customized Progress Bar Large
Make use of HEX, RGB, RGBA and Gradient colors with opacity and angle support, change the border radius to create a different shape or change the alignment of percentage value and description. The given options are making the progress bar very versatile.
Default Progress Bar Small
You can also change the animation speed per progress bar and decide, if the animation of the progress bar starts over again every time the user re-enters the viewport.
Customized Progress Bar Small
Absolutely identical in terms of available options just displaying with a smaller bar height.
Thin Progress Bar
Brooklyn’s second progress bar modul is optimized for displaying thin bars paired with an animated percentage label.
Customized Progress Bar Thin
Use HEX, RGB, RGBA and Gradient colors with opacity and angle support or change the alignment of the bar description. Optionally you are able to switch the position fo the bar description from above to below.
Use Case Example
As part of a virtual business card.
Marcel M.
Design Freak
Marcel M.
Hello, I’m Marcel Designer at Brooklyn Designs.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et.