cloud fog icon

Common uses

• Displaying current weather conditions.
• Indicating a foggy or hazy setting in a map or game.
• Representing a 'low visibility' status in a system.

Use it in React

npm i @phosphor-icons/react

import { CloudFog } from '@phosphor-icons/react';

<CloudFog size={24} />

Styles

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

<CloudFog size={24} />

<CloudFog size={24} weight="thin" />

<CloudFog size={24} weight="light" />

<CloudFog size={24} weight="bold" />

<CloudFog size={24} weight="fill" />

<CloudFog size={24} weight="duotone" />

Details

Library

Phosphor (1,512 icons)

License

MIT

viewBox

0 0 256 256

Category

weather

Keywords

meteorologycloudyovercastfoggymisthazeweathercloudfog

FAQ

What does the cloud fog icon represent?

It depicts a cloud with fog or mist, typically used for weather-related information or to signify obscurity.

How do I use the cloud fog icon in React?

Import it from the library like this: import { CloudFog } from '@phosphor-icons/react'. Then use it as a component: <CloudFog size={32} />.

What is the license for this icon?

The Phosphor icon library, including the cloud fog icon, is available under the MIT license.

Related icons

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