John KuehJohn Kueh

tornado icon

Phosphor · tornado · MIT

Download SVG

The Phosphor tornado icon visually represents a powerful rotating column of air, commonly used in weather-related applications or to signify extreme weather events.

Common uses

  • Displaying current severe weather alerts.
  • Indicating a 'storm' or 'windy' condition in a forecast.
  • Representing a 'disaster' or 'emergency' status.

Use it in React

Install
npm i @phosphor-icons/react
Import & render
import { Tornado } from '@phosphor-icons/react';

<Tornado size={24} />

Styles

Phosphor ships this icon in 6 styles — each its own import:

regular
<Tornado size={24} />
thin
<Tornado size={24} weight="thin" />
light
<Tornado size={24} weight="light" />
bold
<Tornado size={24} weight="bold" />
fill
<Tornado size={24} weight="fill" />
duotone
<Tornado size={24} weight="duotone" />

Details

Library
Phosphor (1,512 icons)
License
MIT
viewBox
0 0 256 256
Category
weather
Keywords
*new*meteorologytwisterstormwinddisasterweathertornadoweather warning

FAQ

What does the tornado icon represent?
It depicts a tornado, a violently rotating column of air that is in contact with both the surface of the earth and a cumulonimbus cloud or, in rare cases, the base of a cumulus cloud.
How do I use the tornado icon in React?
You can import and use it like this: import { Tornado } from '@phosphor-icons/react'. Then render it as <Tornado size={32} />.
What is the license for this icon?
The Phosphor icon library, including the tornado icon, is available under the MIT license.

Related icons

The same idea in other libraries, and near matches in Phosphor.

Looking for something else? Search Phosphor and 4 more libraries by description →

The search behind these pages runs as a Claude Code skill. What skills are and how I ship them →