Bring your project to life with a smooth, organic preloader. Modern, responsive, and easy to customize. Make every transition elegant and engaging.
Make it with Workshop
Build your own component with AI
This component is a fully responsive preloader, designed to cover the browser window (100% width and 100vh height) and ensure a smooth transition during your page’s loading process.
You can easily customize the following elements:
Background color
Texts and text colors
Preloader content (by editing the elements inside the “Change Content” stack)
If you want to change the animated figure, you can replace it inside the “Figure” stack with your own design. Just make sure its background color matches the page’s background and that you keep the component’s base configuration to preserve proper behavior.
The figure (path) color is automatically linked to the “Background Color - Web&Component” style, ensuring that the preloader maintains the visual harmony of your site without manual adjustments — simply modify that color style from the style panel, and the update will apply globally.
To ensure a smooth user experience, set the component’s variant to pointer: none, preventing the preloader from interfering with user interactions while it’s active.
It lasts approximately 2.5 seconds, so it’s recommended to align the appearance of your main page elements with this duration for a synchronized and professional transition.
Tip: Keep the base structure of the component and make changes only to the recommended areas to avoid display or behavior issues.
No returns. If you have any problems, please contact me at bryanherpa03@gmail.com