ICONYZ
English
Wind icon from IconPark

Wind icon

icon-park:wind

The Wind icon (icon-park:wind) is a free SVG icon from the IconPark set by ByteDance. It is drawn on a 48 × 48 grid. IconPark icons are released under the Apache 2.0 license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set
IconPark
Author
ByteDance
License
Apache-2.0
Size
48 × 48
Category
Weather
Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><g fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"><path d="M12 17H10C7.79086 17 6 18.7909 6 21V21C6 23.2091 7.79086 25 10 25H12"/><path d="M22 33H19C16.7909 33 15 34.7909 15 37V37C15 39.2091 16.7909 41 19 41H22"/><path d="M27 7H24C21.7909 7 20 8.79086 20 11V11C20 13.2091 21.7909 15 24 15H27"/><path d="M24 15H40"/><path d="M12 25H42"/><path d="M22 33H34"/></g></svg>

How to use the Wind icon

React

import { Icon } from "@iconify/react";

<Icon icon="icon-park:wind" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="icon-park:wind" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="icon-park:wind" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[icon-park--wind]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/icon-park -->
<div class="i-icon-park:wind"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="icon-park:wind"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/icon-park/wind.svg" alt="Wind icon" width="24" height="24">

Related icons in IconPark

Wind icon in other icon sets

Wind icon FAQ

Is the Wind icon free for commercial use?

Yes. IconPark icons are released under the Apache 2.0 license, which allows use in personal and commercial projects.

How do I use the Wind icon in React?

Install @iconify/react and render <Icon icon="icon-park:wind" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Wind icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/icon-park/wind.svg" alt="Wind icon">, or paste the SVG code inline to style it with CSS.

Browse all IconPark icons →