Focalboard icon
thesvg-color:focalboard
The Focalboard icon (thesvg-color:focalboard) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 300 × 300 grid. theSVG Color 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
- theSVG Color
- Author
- thesvg.org
- License
- MIT
- Size
- 300 × 300
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300" viewBox="0 0 300 300"><g fill="#0058cc" fill-rule="evenodd" clip-rule="evenodd"><path d="M181.891 56.859c-59.592-16.315-127.316 15.476-149.072 79.74c-21.906 64.712 12.795 134.93 77.505 156.836c64.713 21.906 134.93-12.794 156.837-77.505c17.9-52.878-2.176-106.835-42.243-137.652l-2.166 22.925l-.004.003c21.796 23.037 31.577 56.194 20.354 89.348c-15.822 46.736-67.991 71.304-116.525 54.874s-75.052-67.636-59.231-114.372c14-41.358 56.464-64.549 97.62-59.418l-.001-.005zm-29.062 77.596c16.264-3.131 32.879 12.96 27.118 29.976c-4.02 11.874-17.274 18.117-29.606 13.942s-19.069-17.186-15.049-29.06c2.701-7.981 9.575-13.418 17.537-14.858m-6.045-23.269c-8.405 1.52-16.237 5.195-22.647 10.626c-6.114 5.18-10.912 11.978-13.642 20.042c-4.136 12.217-2.723 25.049 2.905 35.917c5.677 10.961 15.647 19.928 28.566 24.302c12.912 4.371 26.282 3.302 37.457-1.961c11.067-5.212 19.981-14.546 24.118-26.766c2.611-7.712 2.982-15.316 1.617-22.411c-.989-5.141-2.895-10.041-5.526-14.547l4.796-24.034q1.334 1.319 2.598 2.703c8.235 9.03 14.158 20.155 16.508 32.364c1.952 10.14 1.432 20.978-2.275 31.929c-5.834 17.233-18.345 30.368-33.855 37.673c-15.403 7.254-33.768 8.748-51.44 2.767c-17.668-5.981-31.348-18.328-39.181-33.453c-7.882-15.219-9.839-33.251-4.005-50.486c3.854-11.386 10.635-20.991 19.28-28.314c8.848-7.496 19.678-12.581 31.326-14.706l-.004-.02c8.279-1.593 16.575-1.473 24.534.073l-16.866 17.704q-2.078.2-4.154.599h-.11z"/><path d="m202.712 53.891l-3.317-15.146L219.518 0l12.316 20.728l24.096-.834l-21.734 37.865l-15.448 5.729l-53.465 97.859l-16.399-8.931z"/></g></svg>How to use the Focalboard icon
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:focalboard" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:focalboard" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:focalboard" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--focalboard]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:focalboard"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:focalboard"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/thesvg-color/focalboard.svg" alt="Focalboard icon" width="24" height="24">Focalboard icon in other icon sets
Focalboard icon FAQ
Is the Focalboard icon free for commercial use?
Yes. theSVG Color icons are released under the MIT license, which allows use in personal and commercial projects.
How do I use the Focalboard icon in React?
Install @iconify/react and render <Icon icon="thesvg-color:focalboard" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Focalboard icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/focalboard.svg" alt="Focalboard icon">, or paste the SVG code inline to style it with CSS.