Thumbs Up icon
icon-park:thumbs-up
The Thumbs Up icon (icon-park:thumbs-up) 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
- Hands
- Tags
- thumbsup, thumb
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-linejoin="round" stroke-width="4"><path d="M27.6002 18.5998V11.3998C27.6002 8.41743 25.1826 5.99977 22.2002 5.99977L15.0002 22.1998V41.9998H35.9162C37.7113 42.0201 39.2471 40.7147 39.5162 38.9398L42.0002 22.7398C42.1587 21.6955 41.8506 20.6343 41.1576 19.8373C40.4645 19.0403 39.4564 18.5878 38.4002 18.5998H27.6002Z"/><path fill="#2F88FF" d="M15 22.0001H10.194C8.08532 21.9628 6.2827 23.7095 6 25.7994V38.3994C6.2827 40.4894 8.08532 42.0367 10.194 41.9994H15V22.0001Z"/></g></svg>
How to use the Thumbs Up icon
React
import { Icon } from "@iconify/react";
<Icon icon="icon-park:thumbs-up" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="icon-park:thumbs-up" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="icon-park:thumbs-up" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[icon-park--thumbs-up]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/icon-park -->
<div class="i-icon-park:thumbs-up"></div>
Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="icon-park:thumbs-up"></iconify-icon>
HTML image
<img src="https://iconyz.com/api/public/svg/icon-park/thumbs-up.svg" alt="Thumbs Up icon" width="24" height="24">
Related icons in IconPark
Thumbs Up icon in other icon sets
Thumbs Up icon FAQ
Is the Thumbs Up 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 Thumbs Up icon in React?
Install @iconify/react and render <Icon icon="icon-park:thumbs-up" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Thumbs Up icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/icon-park/thumbs-up.svg" alt="Thumbs Up icon">, or paste the SVG code inline to style it with CSS.
Browse all IconPark icons →
ICONYZ
