Hugging Face icon
thesvg-color:hugging-face
The Hugging Face icon (thesvg-color:hugging-face) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 95 × 88 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
- 95 × 88
- Tags
- huggingface
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="95" height="88" viewBox="0 0 95 88"><g fill="none" fill-rule="evenodd"><path fill="#fff" fill-rule="nonzero" d="M93.793 70.08c.75 2.16.57 4.46-.43 6.46c-.72 1.46-1.75 2.59-3.01 3.6c-1.52 1.2-3.41 2.22-5.69 3.2c-2.72 1.16-6.04 2.25-7.56 2.65c-3.89 1.01-7.63 1.65-11.42 1.68c-5.42.05-10.09-1.23-13.41-4.5c-1.72.21-3.46.33-5.21.33c-1.66 0-3.3-.1-4.93-.3c-3.33 3.25-7.98 4.52-13.38 4.47c-3.79-.03-7.53-.67-11.43-1.68c-1.51-.4-4.83-1.49-7.55-2.65c-2.28-.98-4.17-2-5.68-3.2c-1.27-1.01-2.3-2.14-3.02-3.6c-.99-2-1.18-4.3-.42-6.46c-.7-1.65-.88-3.54-.33-5.63c.25-.95.66-1.83 1.18-2.61c-.11-.41-.2-.83-.26-1.29c-.38-2.74.57-5.24 2.36-7.18c.88-.97 1.83-1.64 2.82-2.07c-.73-3.1-1.11-6.29-1.11-9.55C5.313 18.69 24.003 0 47.063 0c7.92 0 15.33 2.2 21.65 6.04c1.14.7 2.26 1.45 3.33 2.25c.53.4 1.06.81 1.57 1.24c.52.42 1.03.86 1.52 1.31c1.48 1.35 2.87 2.8 4.14 4.35c.43.51.84 1.04 1.24 1.58q1.215 1.605 2.25 3.33c1.05 1.72 1.97 3.52 2.77 5.39c.53 1.25.99 2.53 1.4 3.84a42 42 0 0 1 1.4 6.06c.1.69.19 1.39.26 2.09c.14 1.4.22 2.82.22 4.27c0 3.22-.38 6.38-1.09 9.43c1.1.43 2.14 1.13 3.11 2.19c1.79 1.94 2.74 4.45 2.36 7.19c-.06.45-.15.87-.26 1.28c.52.78.93 1.66 1.18 2.61c.55 2.09.37 3.98-.32 5.63"/><circle cx="46.75" cy="41.75" r="34.75" fill="#ffd21e" fill-rule="nonzero"/><path fill="#ffac03" fill-rule="nonzero" d="M81.5 41.75C81.5 22.558 65.942 7 46.75 7S12 22.558 12 41.75S27.558 76.5 46.75 76.5S81.5 60.942 81.5 41.75m-73.5 0C8 20.349 25.349 3 46.75 3S85.5 20.349 85.5 41.75S68.151 80.5 46.75 80.5S8 63.151 8 41.75"/><path fill="#3a3b45" fill-rule="nonzero" d="M58.04 32.291c1.275.45 1.782 3.07 3.07 2.386a5 5 0 1 0-6.763-2.068c.612 1.151 2.554-.72 3.694-.318m-23.558 0c-1.274.45-1.781 3.07-3.068 2.386a5 5 0 1 1 6.762-2.068c-.612 1.151-2.554-.72-3.694-.318M46.5 56.289c9.828 0 13-8.763 13-13.263c0-2.338-1.572-1.602-4.09-.356c-2.327 1.152-5.462 2.74-8.91 2.74c-7.18 0-13-6.884-13-2.384s3.172 13.263 13 13.263"/><g transform="translate(33.5 41.5)"><mask id="SVG0A1IzbYM" fill="#fff"/><path fill="#ef4e4e" fill-rule="nonzero" d="M13.25 25a8.673 8.673 0 0 0 2.643-16.936c-.833-.266-1.721 2.598-2.643 2.598c-.861 0-1.693-2.882-2.479-2.649A8.673 8.673 0 0 0 13.25 25" mask="url(#SVG0A1IzbYM)"/></g><circle cx="70.25" cy="33.75" r="3.25" fill="#ffd21e" fill-rule="nonzero"/><circle cx="23.75" cy="33.75" r="3.25" fill="#ffd21e" fill-rule="nonzero"/><g fill-rule="nonzero"><path fill="#ffac03" d="M17.062 48c-1.62 0-3.066.665-4.075 1.871c-.624.747-1.276 1.951-1.33 3.754c-.678-.195-1.331-.304-1.941-.304c-1.55 0-2.95.594-3.94 1.673c-1.272 1.385-1.837 3.087-1.591 4.79c.117.811.388 1.538.793 2.211c-.854.691-1.483 1.653-1.787 2.81a5.87 5.87 0 0 0 .792 4.742a6 6 0 0 0-.228.394c-.766 1.454-.815 3.097-.14 4.627c1.026 2.319 3.573 4.146 8.519 6.107c3.077 1.22 5.892 2 5.917 2.007c4.068 1.055 7.747 1.591 10.932 1.591c5.854 0 10.045-1.793 12.457-5.329c3.882-5.694 3.327-10.902-1.696-15.922c-2.78-2.778-4.628-6.874-5.013-7.773c-.776-2.662-2.828-5.621-6.24-5.621q-.432 0-.863.068c-1.494.235-2.8 1.095-3.733 2.389c-1.007-1.252-1.985-2.248-2.87-2.81C19.69 48.429 18.358 48 17.062 48m0 4c.51 0 1.133.217 1.82.653c2.133 1.353 6.249 8.428 7.756 11.18c.505.922 1.368 1.312 2.145 1.312c1.542 0 2.746-1.533.14-3.481c-3.916-2.931-2.542-7.722-.672-8.017q.124-.02.24-.019c1.7 0 2.45 2.93 2.45 2.93s2.199 5.52 5.975 9.293c3.776 3.774 3.97 6.803 1.219 10.839c-1.877 2.752-5.47 3.583-9.152 3.583c-3.82 0-7.734-.894-9.928-1.463c-.108-.028-13.451-3.797-11.761-7.005c.284-.539.752-.755 1.34-.755c2.38 0 6.71 3.542 8.57 3.542c.417 0 .71-.177.83-.609c.793-2.845-12.057-4.041-10.974-8.162c.19-.729.709-1.025 1.437-1.024c3.145 0 10.2 5.531 11.68 5.531q.17.001.238-.103c.74-1.196.335-2.031-4.888-5.192s-8.89-5.064-6.804-7.334c.24-.262.58-.378.993-.378c3.17.001 10.663 6.819 10.663 6.819s2.022 2.103 3.245 2.103c.28 0 .52-.111.682-.385c.867-1.462-8.053-8.222-8.556-11.011c-.341-1.89.239-2.847 1.312-2.847"/><path fill="#ffd21e" d="M38.135 76.69c2.752-4.036 2.557-7.065-1.22-10.84c-3.775-3.772-5.973-9.292-5.973-9.292s-.821-3.206-2.691-2.911s-3.243 5.086.674 8.017s-.78 4.92-2.287 2.169s-5.622-9.827-7.756-11.18c-2.133-1.353-3.635-.595-3.132 2.194s9.424 9.549 8.556 11.012c-.868 1.462-3.927-1.72-3.927-1.72s-9.572-8.71-11.656-6.44s1.58 4.172 6.804 7.334c5.224 3.16 5.629 3.996 4.888 5.192C19.673 71.42 8.143 61.7 7.06 65.82c-1.082 4.12 11.767 5.317 10.974 8.162s-9.051-5.385-10.74-2.178c-1.69 3.208 11.653 6.977 11.76 7.005c4.31 1.118 15.257 3.487 19.08-2.12"/></g><g fill-rule="nonzero"><path fill="#ffac03" d="M76.938 48c1.62 0 3.066.665 4.075 1.871c.624.747 1.276 1.951 1.33 3.754c.678-.195 1.331-.304 1.941-.304c1.55 0 2.95.594 3.94 1.673c1.272 1.385 1.837 3.087 1.591 4.79a5.85 5.85 0 0 1-.793 2.211c.854.691 1.483 1.653 1.787 2.81a5.87 5.87 0 0 1-.792 4.742q.122.191.228.394c.766 1.454.815 3.097.14 4.627c-1.026 2.319-3.573 4.146-8.519 6.107c-3.077 1.22-5.892 2-5.917 2.007c-4.068 1.055-7.747 1.591-10.932 1.591c-5.854 0-10.045-1.793-12.457-5.329c-3.882-5.694-3.327-10.902 1.696-15.922c2.78-2.778 4.628-6.874 5.013-7.773c.776-2.662 2.828-5.621 6.24-5.621q.432 0 .863.068c1.494.235 2.8 1.095 3.733 2.389c1.007-1.252 1.985-2.248 2.87-2.81C74.31 48.429 75.642 48 76.938 48m0 4c-.51 0-1.133.217-1.82.653c-2.133 1.353-6.249 8.428-7.756 11.18c-.505.922-1.368 1.312-2.145 1.312c-1.542 0-2.746-1.533-.14-3.481c3.916-2.931 2.542-7.722.672-8.017a1.5 1.5 0 0 0-.24-.019c-1.7 0-2.45 2.93-2.45 2.93s-2.199 5.52-5.975 9.293c-3.776 3.774-3.97 6.803-1.219 10.839c1.877 2.752 5.47 3.583 9.152 3.583c3.82 0 7.734-.894 9.928-1.463c.108-.028 13.451-3.797 11.761-7.005c-.284-.539-.752-.755-1.34-.755c-2.38 0-6.71 3.542-8.57 3.542c-.417 0-.71-.177-.83-.609c-.793-2.845 12.057-4.041 10.974-8.162c-.19-.729-.709-1.025-1.437-1.024c-3.145 0-10.2 5.531-11.68 5.531q-.17.001-.238-.103c-.74-1.196-.335-2.031 4.888-5.192s8.89-5.064 6.804-7.334c-.24-.262-.58-.378-.993-.378c-3.17.001-10.663 6.819-10.663 6.819s-2.022 2.103-3.245 2.103a.74.74 0 0 1-.682-.385c-.867-1.462 8.053-8.222 8.556-11.011c.341-1.89-.239-2.847-1.312-2.847"/><path fill="#ffd21e" d="M55.865 76.69c-2.752-4.036-2.557-7.065 1.22-10.84c3.775-3.772 5.973-9.292 5.973-9.292s.821-3.206 2.691-2.911s3.243 5.086-.674 8.017s.78 4.92 2.287 2.169s5.622-9.827 7.756-11.18c2.133-1.353 3.635-.595 3.132 2.194s-9.424 9.549-8.556 11.012c.868 1.462 3.927-1.72 3.927-1.72s9.572-8.71 11.656-6.44s-1.58 4.172-6.804 7.334c-5.224 3.16-5.629 3.996-4.888 5.192c.742 1.196 12.272-8.525 13.355-4.404c1.082 4.12-11.767 5.317-10.974 8.162s9.051-5.385 10.74-2.178c1.69 3.208-11.653 6.977-11.76 7.005c-4.31 1.118-15.257 3.487-19.08-2.12"/></g></g></svg>How to use the Hugging Face icon
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:hugging-face" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:hugging-face" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:hugging-face" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--hugging-face]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:hugging-face"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:hugging-face"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/thesvg-color/hugging-face.svg" alt="Hugging Face icon" width="24" height="24">Hugging Face icon in other icon sets
Hugging Face icon FAQ
Is the Hugging Face 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 Hugging Face icon in React?
Install @iconify/react and render <Icon icon="thesvg-color:hugging-face" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Hugging Face icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/hugging-face.svg" alt="Hugging Face icon">, or paste the SVG code inline to style it with CSS.