The Polar Gradient Preloader is just like it sounds – a polar gradient is created and placed in the center of the stage. Inside of it, an optional text field displays the current percentage loaded. The preloader will automatically reposition itself if the stage is resized or fullscreen mode is toggled. This preloader is 100% code-driven, so there are no graphics to include!
There are several settings you can use to customize this preloader. Many of these settings can be tried out right now by clicking on the ‘settings’ bar in the demo above. The full list of settings is:
- bgColor – This is the base color used to create the background.
- polarColor – The base color used in creating the polar gradient
- radius – The radius of the polar gradient (in pixels)
- thickness – How thick the polar gradient should be (in pixels)
- outlineColor – The color of the outline
- rotateSpeed – How many degrees the gradient should rotate on each update. Use a negative number to rotate counter-clockwise.
- txtColor – The color of the percentage text
- txtSize – The font size of the percentage text
- txtFont – This is the name of the font used for any text. The font you specify here needs to be embedded in your project to show up properly. A text field is provided in the preloader where you can change the embedded font.
- showGlow – A true/false value that controls whether or not to have a glow effect on the polar gradient
- showOutline – A true/false value that controls whether or not to show the outline around the polar gradient
- showBackground – A true/false value that controls whether or not to show the background behind the preloader.
- fadeOutAtEnd – A true/false value that controls whether or not the preloader fades out when it’s finished before moving to Frame 2.
All settings are accessed in their own layer in the preloader’s MovieClip, making it quick and easy to change the appearance of the preloader to suit your project’s needs. To use the preloader, simply place it on Frame 1 of your timeline, and begin your project on Frame 2. The preloader does the rest! Full instructions on how to implement and customize this preloader are included with your purchase.
Thank you and enjoy!
More Modulus Products
Galleries
Utilities
Preloaders

16 Purchases
1 Comments