Home/Libraries/Game Icons (Iconify)/cloud-ring

Game Icons (Iconify)

CloudRing

License: CC-BY-3.0

ICON SIZE

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 512 512"><path fill="#818cf8" d="M245.22 31.387c-70.06.15-134.335 31.794-168.1 90.28c-5.223 9.045-8.83 18.417-12.24 28C122.157 70.996 219.372 40.6 292.07 82.57c78.822 45.506 98.658 158.253 44.405 252.223c-25.855 44.782-63.857 77.026-105.15 93.723c95.38 29.26 195.698-.307 240.96-78.704c54.027-93.574 8.905-220.773-100.055-283.68c-40.858-23.59-84.976-34.837-127.01-34.747zm-24.763 49.945c-40.357.123-84.108 16.545-122.254 49.408C19.45 198.588-6.02 311.192 41.32 382.244c4.577 6.87 9.9 12.55 15.434 18.137C20.79 331.21 31.144 244.728 83.69 199.46c56.97-49.083 141.443-31.06 188.98 40.292c22.654 34.003 32.705 73.913 30.926 111.78c51.07-67.13 63.006-155.83 23.347-215.356h-.002C302.534 99.54 263.42 81.2 220.458 81.332zm-63.36 107.71c-26.76.083-53.228 9.95-73.05 29.65c-48.848 48.55-47.855 142.19 1.144 205.94c49 63.75 128.323 76.074 177.17 27.524c-47.107 29.645-84.88 26.3-128.778-20.916c-39.45-42.43-24.435-122.8 24.62-171.554c23.376-23.234 51.128-35.812 77.675-37.696c-21.48-22.033-50.296-33.034-78.78-32.947z"/></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. CloudRingIcon.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-3.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.