React SVG Loading Spinner
Budget: $250 – $750 USD
I need a lightweight React component that renders a linear SVG loading spinner with progressive step animation. The goal is a clean, smooth indicator that can be dropped into any React app without additional dependencies.
Key points:
• Style: linear bar rather than circular or dotted.
• Animation: progressive steps that visually move across the bar.
• Keep the SVG code minimal and easy to customize (colors, size, duration).
• The component should export default and accept simple props like width, height, color, and speed.
• No external animation libraries—native SVG + React hooks or CSS only.
• Deliver a single .jsx file plus a short README showing usage in create-react-app.
I’ll test by importing the component into an existing project; it should run smoothly in the latest versions of Chrome, Firefox, and Edge.
Key points:
• Style: linear bar rather than circular or dotted.
• Animation: progressive steps that visually move across the bar.
• Keep the SVG code minimal and easy to customize (colors, size, duration).
• The component should export default and accept simple props like width, height, color, and speed.
• No external animation libraries—native SVG + React hooks or CSS only.
• Deliver a single .jsx file plus a short README showing usage in create-react-app.
I’ll test by importing the component into an existing project; it should run smoothly in the latest versions of Chrome, Firefox, and Edge.