Menu

Beta
Sign in
Thunderstorm SVG icon, line

Thunderstorm SVG icon, line

A cloud above a large outlined lightning bolt marks a thunderstorm. Use it in a storm alert and on a home station conditions display.

Free · from Home Weather Station Icons, Line

Similar SVGs

More from Home Weather Station Icons, Line

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/LLbFcTRzUID4/amnt.svg" alt="Thunderstorm" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><g id="layer-1" data-name="Shape 1"><path d="M8.8 16.5L5.6 16.5C3.72 16.64 2.09 15.23 1.95 13.35C1.81 11.47 3.22 9.84 5.1 9.7C5.63 6.82 8 4.63 10.91 4.33C13.83 4.03 16.59 5.69 17.7 8.4C19.76 8.49 21.43 10.09 21.6 12.14C21.78 14.19 20.41 16.06 18.4 16.5L16.4 16.5" fill="none" stroke="#000000" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-2" data-name="Shape 2"><path d="M12 14.4L9.8 18.5L12 18.5L11.2 22.5L16.1 16.5L13.5 16.5L14.5 14.4Z" fill="none" stroke="#000000" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></g></svg>
CSS background-image
.thunderstorm {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/LLbFcTRzUID4/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.thunderstorm {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/LLbFcTRzUID4/amnt.svg") center / contain no-repeat;
}
React
import ThunderstormSvg from "./thunderstorm.jsx"; // from the React tab above

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

Tags

stormlightningthunderstormweather

Made with AMNT

AMNT SVG 1.1 drew this from the words Draw one thunderstorm weather icon: a rounded cloud with a single large outlined zigzag lightning bolt extending beneath its center. Use a clean monochrome outline, uniform stroke width, rounded caps and joins, no text, and a transparent square canvas. Remove hidden overlaps and optimize for 24-pixel display. as part of the pack Home Weather Station Icons, Line. Want one like it? Make your own in the SVG studio.

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

Settings