Image Loader

A sophisticated image loading component designed for AI-generated image workflows.

A sophisticated image loading component designed for AI-generated image workflows. It displays a placeholder with customizable loading animations while an image loads, then smoothly transitions to reveal the final image. Perfect for showcasing AI image generation processes with professional loading states. Features 3 Progress Types : Bar, Donut, and Spinner with contextual controls Loading Effects : Blur-to-reveal and shimmer effects for smooth transitions Smart Timing : Configurable start delay and duration with realistic progress simulation Typography Control : Separate font controls for progress text, percentage, and labels Color Customization : Progress colors, background colors, and label colors Accessibility : ARIA progressbar roles with live progress announcements Performance Optimized : Constants-based code with efficient state management Contextual UI : Controls only show when relevant to selected progress type Controls Image Settings : Image source, object fit options Loading State : Enable/disable, start delay (0-100s), duration (1-10s) Loading Effects : Blur (with intensity) or Shimmer (with intensity) Progress Types : Bar, Donut, or Spinner selection Bar Controls : Height, radius, vertical gap (when bar selected) Donut Controls : Size, thickness (when donut selected) Spinner Controls : Size, thickness (when spinner selected) Typography : Progress font, percentage font, label font Colors : Progress color, background color, label color Labels : Show/hide, temporary label option, custom text Appearance : Border radius, background color