Home/Libraries/Freehand free icons (Iconify)/cloud-error-404

Freehand free icons (Iconify)

CloudError404

License: CC-BY-4.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 24 24"><g fill="#818cf8" fill-rule="evenodd" clip-rule="evenodd"><path d="M22.197 12.735a.35.35 0 0 0-.407.02a.4.4 0 0 0-.093.11a.36.36 0 0 0 .12.5a2.56 2.56 0 0 1 1.09 3.317a4.8 4.8 0 0 1-2.798 2.668a26 26 0 0 1-7.774 1.258a21.4 21.4 0 0 1-7.723-1.179a9.2 9.2 0 0 1-2.338-1.148a3.8 3.8 0 0 1-1.09-1.2a2.55 2.55 0 0 1 .18-2.737a3.78 3.78 0 0 1 2.519-1.589a.34.34 0 0 0 .28-.37a.33.33 0 0 0-.37-.28c-.451.062-.89.193-1.3.39a3.83 3.83 0 0 1-.499-2.248a3.05 3.05 0 0 1 1-2.118c.346-.32.754-.568 1.198-.73q.669-.27 1.38-.399c.404-.09.823-.09 1.228 0a8 8 0 0 1 1.859.83a.37.37 0 1 0 .38-.63l-.78-.51a.3.3 0 0 0 .05-.13a3 3 0 0 1 1.678-2.477a4.6 4.6 0 0 1 2.928-.69a3 3 0 0 1 1.369.53c.418.289.778.655 1.059 1.079c.447.588.751 1.272.889 1.998a1.5 1.5 0 0 1-.25 1.21a.37.37 0 0 0 0 .519a.38.38 0 0 0 .53 0a2.3 2.3 0 0 0 .6-1.789a7.4 7.4 0 0 1 1.468-.12a3.4 3.4 0 0 1 1.399.36c.49.25.931.589 1.299 1c.392.398.728.849.999 1.338c.577.982.762 2.145.52 3.257a.37.37 0 0 0 .699.23a5.25 5.25 0 0 0-.17-3.997a5.7 5.7 0 0 0-1.149-1.698c-.5-.496-1.1-.881-1.759-1.13a4.3 4.3 0 0 0-1.468-.239a6.8 6.8 0 0 0-1.999.37a7.3 7.3 0 0 0-.699-1.849a5 5 0 0 0-1.269-1.538a4.05 4.05 0 0 0-1.998-.76a5 5 0 0 0-1.999.19a5.9 5.9 0 0 0-1.698.89A3.84 3.84 0 0 0 7.669 6.36q-.295-.166-.61-.29a3.9 3.9 0 0 0-1.628-.19a7.5 7.5 0 0 0-2.108.51a4.3 4.3 0 0 0-1.279.849a4.13 4.13 0 0 0-1.099 2.997c.061.942.41 1.841 1 2.578a4.2 4.2 0 0 0-1.22 1.08a3.41 3.41 0 0 0-.37 3.616a4.7 4.7 0 0 0 1.3 1.569a10.3 10.3 0 0 0 2.547 1.409a21.7 21.7 0 0 0 8.153 1.368a25.6 25.6 0 0 0 8.103-1.528a5.65 5.65 0 0 0 3.517-4.287a3.25 3.25 0 0 0-1.778-3.307"/><path d="m6.24 13.655l1.27-1.999a.3.3 0 0 0 .059-.111q.018-.061.012-.125a.322.322 0 0 0-.571-.174l-1.67 1.75c-.17.2-.37.37-.51.54a1.4 1.4 0 0 0-.349.739c0 .38.07.83.75 1.229l.749.29l.77.14h.109v.999a.38.38 0 0 0 .35.4a.37.37 0 0 0 .41-.34c.07-.36.16-.73.24-1.1h.709a.37.37 0 0 0 .32-.6a.36.36 0 0 0-.25-.129l-.6-.17c0-.17.07-.33.09-.5s.06-.499.07-.749v-1.768a.33.33 0 1 0-.65-.09c-.17.57-.38 1.109-.52 1.699q-.087.365-.129.739v.5l-.51-.17c-.919-.45-.769-.08-.15-1m10.183.089l.999-2.188a.32.32 0 0 0-.11-.45a.34.34 0 0 0-.45.11l-1.408 1.999c-.15.21-.32.41-.44.6a1.43 1.43 0 0 0-.25.769c0 .39.18.819.91 1.129l.789.19h.88c0 .33.099.669.159.999a.37.37 0 0 0 .74-.05c0-.38.06-.75.09-1.13l.699-.11a.37.37 0 0 0 0-.739h-.6v-1.248c0-.6-.17-1.17-.25-1.759a.33.33 0 1 0-.65 0c-.099.58-.229 1.149-.289 1.749v1.248l-.52-.1c-1.018-.38-.799-.01-.3-1.019m-3.196-1.149c-.75-.53-1.22-.43-2.079 0a2.9 2.9 0 0 0-.839.7a2.74 2.74 0 0 0-.44 2.817a1.94 1.94 0 0 0 1.869 1.08a2.43 2.43 0 0 0 1.998-1.3a2.9 2.9 0 0 0 .25-2.257a2.3 2.3 0 0 0-.76-1.04m-.48 2.678a1.31 1.31 0 0 1-1 .67a.87.87 0 0 1-.918-.63a1.84 1.84 0 0 1 .19-1.499q.178-.293.43-.53a1 1 0 0 1 1.278 0c.191.172.33.393.4.64c.053.482-.083.966-.38 1.35"/></g></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. CloudError404Icon.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-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.