Home/Libraries/OpenMoji (Iconify)/aragon-flag

OpenMoji (Iconify)

AragonFlag

License: CC-BY-SA-4.0

ICON SIZE

STROKE WEIGHT1.5px

COLOR PICKER

Download SVG without fill color (CSS-styleable)

<svg style="color: #818cf8" xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 72 72"><path fill="#f1b31c" d="M5 17h62v38H5z"/><path fill="#d22f27" d="M5 22h62v4H5zm0 8h62v4H5zm0 8h62v4H5zm0 8h62v4H5z"/><g stroke="#818cf8" stroke-width="1.5"><path fill="#fcea2b" d="m17.688 38.009l-.007-6.396h5.68l.013 6.407"/><path fill="#1e50a0" d="m23.348 38.009l-.007-6.396h5.645L29 38.02"/><path fill="#fcea2b" d="m17.683 37.992l11.314.025s.025 2.404-.047 3.237c-.007.967-1.192 5.312-5.728 5.311c-4.612.026-5.534-3.912-5.54-5.54c-.006-.509 0-3.034 0-3.034z"/><path fill="#fff" d="M23.343 46.559c-1.057.031-2.025-.134-2.654-.478c-.521-.285-1.008-.533-1.439-1.019a6.5 6.5 0 0 1-.885-1.243a4 4 0 0 1-.196-.436c-.178-.484-.458-1.268-.476-2.115a96 96 0 0 1-.005-3.275c.993 0 5.655.009 5.655.009"/></g><path fill="#d22f27" d="m20.168 38.003l-.007 2.934l-2.47-.003c.008.254-.002.435.031.713l2.44-.004l-.004 4.135c.235.142.464.264.73.393v-4.528l2.446-.004v-.705l-2.446.003l-.004-2.934zm7.558.017h.622v5.283c-.075.19-.443.828-.622 1.032zm-1.248 0h.622v7.04c-.116.113-.41.382-.62.52zm-1.243-.006h.622v7.94a5 5 0 0 1-.62.27zm-1.243 0l.621.004l.002 8.39c-.181.033-.407.091-.623.106z"/><g fill="#fff" stroke="#818cf8"><path stroke-width="1.5" d="m23.77 33.47l1.877-.01m-.967-1.01v2.467"/><path stroke-width="1.5" d="m24.68 35.8l-.003-.88"/></g><path fill="#d22f27" stroke="#818cf8" stroke-width="1.5" d="M19.92 32.41h1.121m-.561-.44l-.007 1.703"/><ellipse cx="20.41" cy="33.97" fill="#5c9e31" rx="2.055" ry=".88"/><path fill="none" stroke="#818cf8" stroke-width="1.5" d="m20.4 37.42l.004-2.621"/><path fill="none" stroke="#818cf8" stroke-width="1.5" d="M19.09 37.46c.78-.415 2.396-.662 2.793.043"/><path fill="none" stroke="#818cf8" stroke-width="1.5" d="M19.72 37.56c.542-.69 1.051-.581 1.541.005"/><path fill="none" stroke="#818cf8" stroke-width="1.5" d="M20.08 37.61c.203-.628.434-.806.734.076M19.6 37.29s.686-.067.782-1.422m.788 1.422s-.686-.067-.782-1.422"/><g fill="none" stroke="#818cf8" stroke-width="1.5"><path d="m17.688 38.009l-.007-6.396h5.68l.013 6.407"/><path d="m23.348 38.009l-.007-6.396h5.645L29 38.02"/><path d="m17.683 37.992l11.314.025s.025 2.404-.047 3.237c-.007.967-1.192 5.312-5.728 5.311c-4.612.026-5.534-3.912-5.54-5.54c-.006-.509 0-3.034 0-3.034zm5.665.005l-.002 8.567"/><path d="M23.343 46.559c-1.057.031-2.025-.134-2.654-.478c-.521-.285-1.008-.533-1.439-1.019a6.5 6.5 0 0 1-.885-1.243a4 4 0 0 1-.196-.436c-.178-.484-.458-1.268-.476-2.115a96 96 0 0 1-.005-3.275c.993 0 5.655.009 5.655.009"/></g><g fill="#fcea2b"><ellipse cx="21.8" cy="27.86" rx=".741" ry="1.072"/><ellipse cx="18.76" cy="28.05" rx=".741" ry="1.072"/><ellipse cx="24.88" cy="27.89" rx=".741" ry="1.072"/><ellipse cx="27.95" cy="28.02" rx=".741" ry="1.072"/><path stroke="#818cf8" stroke-linecap="round" stroke-width="1.5" d="M17.36 28.89v-2.411"/><path stroke="#818cf8" stroke-linecap="round" stroke-width="1.5" d="M20.29 28.53v-2.501"/><path stroke="#818cf8" stroke-linecap="round" stroke-width="1.5" d="M23.33 28.53v-2.611"/><path stroke="#818cf8" stroke-linecap="round" stroke-width="1.5" d="M26.43 28.63v-2.561"/><path stroke="#818cf8" stroke-linecap="round" stroke-width="1.5" d="M29.31 28.83v-2.587"/><path stroke="#818cf8" stroke-linecap="round" d="M17.33 30.75s5.348-.99 12.04.006"/></g><path fill="none" stroke="#818cf8" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M5 17h62v38H5z"/></svg>

Icons in Action

WEB APPLICATION HEADER & NAVIGATION

my-app.com/dashboard

Overview Dashboard

PROGRESS STEPPER

BUTTON UI ACTIONS

SCALABILITY & CLARITY

12px

16px

24px

32px

48px

“

Highly adaptable, clean vectors that scale perfectly across modern UI components, navigation bars, and mobile actions. Perfectly pre-vetted for production deployment.

IconSearch Presets

Frequently Asked Questions

Q.How do I use this icon in my React/Next.js project?

You have two choices: install the official package listed under the "REACT IMPORT" tab (e.g. npm install @iconify/react) and import the icon directly, or copy the complete React Component code from the "STANDALONE JSX" tab and paste it directly into a local file (e.g. AragonFlagIcon.tsx) to avoid installing any npm packages.

Q.Is this icon free for commercial use?

Yes. This icon is published under the open-source **CC-BY-SA-4.0** license. The license grants full permissions for personal and commercial usage (e.g., in SaaS platforms, client projects, or business landing pages). Attributing the icon creator is generally not required for MIT/ISC licenses, but check details on our dedicated License Guide.

Q.What is the "Download SVG without fill color" toggle?

Many SVGs ship with inline fill="..." attributes. By checking this toggle, we strip these attributes and enforce fill="none", making the SVG fully styleable via CSS classes or Tailwind utility classes like fill-current.