bean icon
bean from TDesign Icons by TDesign · Outline · MIT Free for personal and commercial use.
- Name
- bean
- Set
- TDesign Icons
- Style
- Outline
- Viewbox
- 24×24
- License
- MIT
1 other variant in TDesign Icons
The same icon in other sets
Use the bean icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path d="M8.866 8.934C7.661 10.14 6.05 10.263 4.768 11.2c-1.724 1.26-2.924 3.2-1.736 6.043c2 4.785 9.692 5.858 14.847.703c5.509-5.509 4.13-12.896-.705-14.845c-2.853-1.151-4.806.061-6.041 1.735c-.937 1.269-1.047 2.879-2.267 4.098"/><path d="M11.364 11.387a3.5 3.5 0 0 0-.806-5.553c-.485 1.047-.775 2.184-1.69 3.1c-.893.892-2.007 1.192-3.046 1.667a3.503 3.503 0 0 0 5.542.786"/><path stroke="currentColor" stroke-width="2" d="M5.822 10.6c1.038-.474 2.153-.774 3.044-1.666c.917-.916 1.207-2.053 1.692-3.1m-4.736 4.767c-.365.167-.72.355-1.053.6m1.053-.6a3.5 3.5 0 1 0 4.736-4.766m.574-.999a5.7 5.7 0 0 0-.574.999m0 0l-.001-.001m7.322 12.112c-5.155 5.155-12.847 4.082-14.847-.703c-1.188-2.843.012-4.782 1.736-6.043c1.282-.937 2.893-1.06 4.098-2.266c1.22-1.22 1.33-2.829 2.267-4.098C12.368 3.162 14.32 1.95 17.174 3.1c4.834 1.95 6.214 9.336.705 14.845Z"/></g></svg>
React
import type { SVGProps } from "react";
export function TdesignBean(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path d="M8.866 8.934C7.661 10.14 6.05 10.263 4.768 11.2c-1.724 1.26-2.924 3.2-1.736 6.043c2 4.785 9.692 5.858 14.847.703c5.509-5.509 4.13-12.896-.705-14.845c-2.853-1.151-4.806.061-6.041 1.735c-.937 1.269-1.047 2.879-2.267 4.098"/><path d="M11.364 11.387a3.5 3.5 0 0 0-.806-5.553c-.485 1.047-.775 2.184-1.69 3.1c-.893.892-2.007 1.192-3.046 1.667a3.503 3.503 0 0 0 5.542.786"/><path stroke="currentColor" strokeWidth="2" d="M5.822 10.6c1.038-.474 2.153-.774 3.044-1.666c.917-.916 1.207-2.053 1.692-3.1m-4.736 4.767c-.365.167-.72.355-1.053.6m1.053-.6a3.5 3.5 0 1 0 4.736-4.766m.574-.999a5.7 5.7 0 0 0-.574.999m0 0l-.001-.001m7.322 12.112c-5.155 5.155-12.847 4.082-14.847-.703c-1.188-2.843.012-4.782 1.736-6.043c1.282-.937 2.893-1.06 4.098-2.266c1.22-1.22 1.33-2.829 2.267-4.098C12.368 3.162 14.32 1.95 17.174 3.1c4.834 1.95 6.214 9.336.705 14.845Z"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path d="M8.866 8.934C7.661 10.14 6.05 10.263 4.768 11.2c-1.724 1.26-2.924 3.2-1.736 6.043c2 4.785 9.692 5.858 14.847.703c5.509-5.509 4.13-12.896-.705-14.845c-2.853-1.151-4.806.061-6.041 1.735c-.937 1.269-1.047 2.879-2.267 4.098"/><path d="M11.364 11.387a3.5 3.5 0 0 0-.806-5.553c-.485 1.047-.775 2.184-1.69 3.1c-.893.892-2.007 1.192-3.046 1.667a3.503 3.503 0 0 0 5.542.786"/><path stroke="currentColor" stroke-width="2" d="M5.822 10.6c1.038-.474 2.153-.774 3.044-1.666c.917-.916 1.207-2.053 1.692-3.1m-4.736 4.767c-.365.167-.72.355-1.053.6m1.053-.6a3.5 3.5 0 1 0 4.736-4.766m.574-.999a5.7 5.7 0 0 0-.574.999m0 0l-.001-.001m7.322 12.112c-5.155 5.155-12.847 4.082-14.847-.703c-1.188-2.843.012-4.782 1.736-6.043c1.282-.937 2.893-1.06 4.098-2.266c1.22-1.22 1.33-2.829 2.267-4.098C12.368 3.162 14.32 1.95 17.174 3.1c4.834 1.95 6.214 9.336.705 14.845Z"/></g></svg> </template>
CSS
.icon-bean {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M8.866%208.934C7.661%2010.14%206.05%2010.263%204.768%2011.2c-1.724%201.26-2.924%203.2-1.736%206.043c2%204.785%209.692%205.858%2014.847.703c5.509-5.509%204.13-12.896-.705-14.845c-2.853-1.151-4.806.061-6.041%201.735c-.937%201.269-1.047%202.879-2.267%204.098%22%2F%3E%3Cpath%20d%3D%22M11.364%2011.387a3.5%203.5%200%200%200-.806-5.553c-.485%201.047-.775%202.184-1.69%203.1c-.893.892-2.007%201.192-3.046%201.667a3.503%203.503%200%200%200%205.542.786%22%2F%3E%3Cpath%20stroke%3D%22currentColor%22%20stroke-width%3D%222%22%20d%3D%22M5.822%2010.6c1.038-.474%202.153-.774%203.044-1.666c.917-.916%201.207-2.053%201.692-3.1m-4.736%204.767c-.365.167-.72.355-1.053.6m1.053-.6a3.5%203.5%200%201%200%204.736-4.766m.574-.999a5.7%205.7%200%200%200-.574.999m0%200l-.001-.001m7.322%2012.112c-5.155%205.155-12.847%204.082-14.847-.703c-1.188-2.843.012-4.782%201.736-6.043c1.282-.937%202.893-1.06%204.098-2.266c1.22-1.22%201.33-2.829%202.267-4.098C12.368%203.162%2014.32%201.95%2017.174%203.1c4.834%201.95%206.214%209.336.705%2014.845Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M8.866%208.934C7.661%2010.14%206.05%2010.263%204.768%2011.2c-1.724%201.26-2.924%203.2-1.736%206.043c2%204.785%209.692%205.858%2014.847.703c5.509-5.509%204.13-12.896-.705-14.845c-2.853-1.151-4.806.061-6.041%201.735c-.937%201.269-1.047%202.879-2.267%204.098%22%2F%3E%3Cpath%20d%3D%22M11.364%2011.387a3.5%203.5%200%200%200-.806-5.553c-.485%201.047-.775%202.184-1.69%203.1c-.893.892-2.007%201.192-3.046%201.667a3.503%203.503%200%200%200%205.542.786%22%2F%3E%3Cpath%20stroke%3D%22currentColor%22%20stroke-width%3D%222%22%20d%3D%22M5.822%2010.6c1.038-.474%202.153-.774%203.044-1.666c.917-.916%201.207-2.053%201.692-3.1m-4.736%204.767c-.365.167-.72.355-1.053.6m1.053-.6a3.5%203.5%200%201%200%204.736-4.766m.574-.999a5.7%205.7%200%200%200-.574.999m0%200l-.001-.001m7.322%2012.112c-5.155%205.155-12.847%204.082-14.847-.703c-1.188-2.843.012-4.782%201.736-6.043c1.282-.937%202.893-1.06%204.098-2.266c1.22-1.22%201.33-2.829%202.267-4.098C12.368%203.162%2014.32%201.95%2017.174%203.1c4.834%201.95%206.214%209.336.705%2014.845Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/tdesign/bean.svg?color=%231a73e8&size=48