Cloud SVG illustration, flat

Free
Cloud SVG illustration, flat

Overlapping rounded lobes give this cloud a fluffy top and flat base. It fits a weather worksheet or the background of a children's story page.

Sign in to download. Free SVGs are free with any account.

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/BJK9TCbT6Cs0/amnt.svg" alt="Cloud" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 300"><ellipse cx="200" cy="246" rx="103" ry="11" fill="#DCE5EA" opacity=".5"/><path d="M103 211C77 211 59 193 59 169C59 147 75 129 97 126C97 100 117 80 142 80C151 80 160 83 167 87C179 65 204 54 229 61C254 68 269 88 271 112C293 107 315 121 321 143C335 149 343 161 343 177C343 197 327 211 306 211Z" fill="#DCE8EF"/><path d="M103 199C82 199 67 185 67 165C67 147 80 132 97 130C106 129 111 132 117 136C112 113 126 92 147 89C156 88 164 90 173 95C183 76 203 66 223 71C246 76 261 97 260 119C282 110 305 123 311 145C326 149 335 161 335 176C335 190 323 199 307 199Z" fill="#EFF5F8"/><path d="M186 99C191 86 206 80 219 84C224 85 227 89 225 93C223 97 219 97 214 96C207 94 200 97 195 103C191 108 183 105 186 99Z" fill="#FFFFFF"/></svg>
CSS background-image
.cloud {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/BJK9TCbT6Cs0/amnt.svg");
  background-size: contain;
}
React
import CloudSvg from "./cloud.jsx"; // from the React tab above

<CloudSvg width={48} height={48} />

Made with AMNT

AMNT SVG Pro 1.1 drew this from the words Cloud: One fluffy cloud made of overlapping rounded lobes and a flat base. as part of the pack Everyday Doodles, Flat. Want one like it? Make your own in the SVG studio.

Rest of Everyday Doodles, Flat

Similar SVGs

Licence: free. A Free account may use it for personal work; Pro and Max download it with a commercial licence, fixed at download, forever. No credit needed. Read the licence