Cotton icon
fluent-mdl2:cotton
The Cotton icon (fluent-mdl2:cotton) is a free SVG icon from the Fluent UI MDL2 set by Microsoft Corporation. It is drawn on a 2048 × 2048 grid. Fluent UI MDL2 icons are released under the MIT 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
- Fluent UI MDL2
- Author
- Microsoft Corporation
- License
- MIT
- Size
- 2048 × 2048
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="2048" height="2048" viewBox="0 0 2048 2048"><path fill="currentColor" d="M1504 393q91 18 167 64t131 112t87 150t31 177q0 101-37 191t-103 160t-153 112t-189 48q-71 106-178 173t-236 81v387H896v-387q-128-14-235-81t-179-173q-101-5-189-47t-153-112t-102-160T0 896q0-93 31-176t86-150t132-113t167-64q29-88 83-160t125-124t157-80T960 0q93 0 178 28t157 81t126 124t83 160m-96 887q79 0 149-30t122-82t83-122t30-150q0-79-30-149t-82-122t-123-83t-149-30h-3q-1 0-3 1q-12-82-51-152t-98-123t-134-81t-159-29q-84 0-159 29t-134 81t-98 122t-51 153h-3q-1 0-3-1q-80 1-150 31t-122 81t-82 122t-30 150q0 80 30 149t82 122t122 83t150 30h45q24 51 59 93t79 75t94 54t107 29v-129q-56-12-103-41t-81-70t-53-94t-19-109h128q0 30 9 58t26 53t40 42t53 28V896h128v373q29-10 52-28t41-42t26-52t9-59h128q0 57-19 109t-53 93t-81 71t-103 41v129q55-8 106-29t95-53t79-75t59-94z"/></svg>How to use the Cotton icon
React
import { Icon } from "@iconify/react";
<Icon icon="fluent-mdl2:cotton" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="fluent-mdl2:cotton" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="fluent-mdl2:cotton" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-mdl2--cotton]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/fluent-mdl2 -->
<div class="i-fluent-mdl2:cotton"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="fluent-mdl2:cotton"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/fluent-mdl2/cotton.svg" alt="Cotton icon" width="24" height="24">Cotton icon FAQ
Is the Cotton icon free for commercial use?
Yes. Fluent UI MDL2 icons are released under the MIT license, which allows use in personal and commercial projects.
How do I use the Cotton icon in React?
Install @iconify/react and render <Icon icon="fluent-mdl2:cotton" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Cotton icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/fluent-mdl2/cotton.svg" alt="Cotton icon">, or paste the SVG code inline to style it with CSS.