Circle color filled icon

About the Circle color filled icon

This icon shows a simple ring: two concentric circle outlines drawn close together so they read as a single thick band rather than one thin line. It represents geometric shape, wholeness, cycles or a badge outline. Use it as a decorative UI element, a button or avatar frame, a loading or progress indicator base, or a bullet marker.

The narrow gap between the two circles gives the shape visible thickness and weight without filling it solid, keeping it light for overlay use. It works well layered behind icons, text or avatars as a frame, and pairs with square and triangle shape icons in a basic-shapes set. Scale it up for use as a background badge.

This is the colour filled version of the circle icon: a flat, solid-colour shape that stands out in dashboards, marketing pages and app tiles where the icon needs to carry colour meaning.

Get it free as an SVG vector or transparent PNG (16-512px), copy the SVG code, or restyle it in the free online editor — recolor any part, add gold, neon or gradient effects, animate it, or export EPS, PDF and DXF.

Free for personal and commercial use with attribution.