Orluma Progress Ring is a premium Framer Code Component for displaying progress, goals, KPIs, skill levels, completion states, and dashboard metrics in a polished visual format.
It uses an animated SVG progress ring with gradient stroke, glow, pulse, shimmer, optional icon, value display, label, helper text, and a customizable card container.
Everything can be edited directly inside Framer through property controls. You can adjust the value, max value, prefix, suffix, label, helper text, icon, size, shape, card style, stroke width, colors, glow, pulse, shimmer, animation, hover lift, and disabled state without touching the code.
Key features:
• Animated SVG progress ring
• Custom value and max value
• Prefix and suffix support
• Optional center icon
• Optional value display
• Optional label and helper text
• Gradient progress stroke
• Glow effect
• Pulse effect
• Shimmer highlight
• Optional card container
• Rounded and circle shapes
• Small, medium, and large sizes
• Obsidian, Aurora, Glass, and Pearl variants
• Custom colors, border, radius, padding, and stroke width
• Hover lift interaction
• Disabled state
• Built with React and Framer Motion
• No heavy external dependencies
Use it for dashboards, SaaS metrics, AI tools, progress tracking, course completion, fitness goals, finance widgets, productivity apps, portfolio skill displays, and modern Framer templates.