Hover the icon or press Play. Suggested motion: pop. Pick another to preview it and update the animated code:
Thumbs Up icon
A free thumbs up icon from Typicons, ready for React. Use it static or animated: both versions are below, copy-paste or one shadcn command away. Sized in em and colored by currentColor.
- License
- CC BY-SA 3.0 license
- Project
- s-ings.com
npx shadcn@latest add https://ui.cuelark.com/r/icons/typicons/thumbs-up.jsonimport * as React from "react";
/**
* Thumbs Up from Typicons (http://s-ings.com/typicons/), CC BY-SA 3.0.
* Via Cuelark UI: ui.cuelark.com/icons/typicons/thumbs-up. Sized in em, colored by currentColor.
*/
export function TiThumbsUpIcon(props: React.SVGProps<SVGSVGElement>) {
return (
<svg
aria-hidden="true"
version="1.2"
baseProfile="tiny"
viewBox="0 0 24 24"
stroke="currentColor"
fill="currentColor"
strokeWidth="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<path
d="M19.57 8.676c-.391-.144-2.512-.406-3.883-.56.215-1.255.313-2.405.313-3.616 0-1.379-1.122-2.5-2.5-2.5s-2.5 1.121-2.5 2.5c0 1.875-.666 2.738-1.616 3.699-.548-.722-1.407-1.199-2.384-1.199-1.654 0-3 1.346-3 3v6c0 1.654 1.346 3 3 3 .755 0 1.438-.29 1.965-.752l.188.193c.96.736 3.667 1.559 5.848 1.559 1.879 0 2.608-.293 3.253-.553l.316-.123c.834-.305 1.576-1.227 1.736-2.2l.666-5.974c.173-1.037-.443-2.125-1.402-2.474zm-12.57 8.324c-.551 0-1-.448-1-1v-6c0-.552.449-1 1-1s1 .448 1 1v6c0 .552-.449 1-1 1zm11.327-.15c-.037.224-.292.541-.443.596l-.376.146c-.545.219-1.016.408-2.508.408-1.914 0-4.118-.753-4.632-1.146-.158-.12-.368-.564-.368-.854v-4.98c.003-.047.051-.656.707-1.312.913-.914 2.293-2.294 2.293-5.208 0-.275.225-.5.5-.5s.5.225.5.5c0 1.407-.146 2.73-.479 4.293l-.297 1.396 1.321-.188c.603.05 3.933.447 4.334.55.058.03.132.183.111.323l-.663 5.976z"
/>
</svg>
);
}import { TiThumbsUp } from "react-icons/ti";
export function Example() {
return <TiThumbsUp className="size-5" />;
}<svg
version="1.2"
baseProfile="tiny"
viewBox="0 0 24 24"
stroke="currentColor"
fill="currentColor"
stroke-width="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M19.57 8.676c-.391-.144-2.512-.406-3.883-.56.215-1.255.313-2.405.313-3.616 0-1.379-1.122-2.5-2.5-2.5s-2.5 1.121-2.5 2.5c0 1.875-.666 2.738-1.616 3.699-.548-.722-1.407-1.199-2.384-1.199-1.654 0-3 1.346-3 3v6c0 1.654 1.346 3 3 3 .755 0 1.438-.29 1.965-.752l.188.193c.96.736 3.667 1.559 5.848 1.559 1.879 0 2.608-.293 3.253-.553l.316-.123c.834-.305 1.576-1.227 1.736-2.2l.666-5.974c.173-1.037-.443-2.125-1.402-2.474zm-12.57 8.324c-.551 0-1-.448-1-1v-6c0-.552.449-1 1-1s1 .448 1 1v6c0 .552-.449 1-1 1zm11.327-.15c-.037.224-.292.541-.443.596l-.376.146c-.545.219-1.016.408-2.508.408-1.914 0-4.118-.753-4.632-1.146-.158-.12-.368-.564-.368-.854v-4.98c.003-.047.051-.656.707-1.312.913-.914 2.293-2.294 2.293-5.208 0-.275.225-.5.5-.5s.5.225.5.5c0 1.407-.146 2.73-.479 4.293l-.297 1.396 1.321-.188c.603.05 3.933.447 4.334.55.058.03.132.183.111.323l-.663 5.976z"
/>
</svg>"Thumbs Up" icon from Typicons (http://s-ings.com/typicons/), licensed under CC BY-SA 3.0 license.